Tabs Style Fixes

[Madmanmayson]

The Tabulation component (found under commnon/tabs) may need needs styles updated to fix some consistency issues:

• Consult on if collapsable versions should have 0 right hand padding, thereby breaking the default style conventions to make tab lists appear centered inside the parent. (Minor consistency issue that can be ignored if preferred to keep them looking different)

Edge alignment with no collapse button:

Edge alignment with collapse button:

• When collapsed, the un-collapse button currently has improper styling, appearing as a square button with no hover effects to make it seem clickable

Current collapsed style:

• Consult on when collapsed, should the un-collapse button account for borders for it's positioning, and if so are those borders based on a consistent size (i.e. are they 2px width globally). Handling this may require an additional optional parameter or class being passed into the component and could require a bit of tweaking of existing tabulations in project files to account for.

Concept with no border offset:

Concept with border offset:

[ClaudiaMia]

I see your point!

In these cases, I do not feel very strongly, but I think you raised this well documented issue because you feel it is not nice like it is and would like to improve it! You are also likely a much more experienced front end dev than us, so I am very happy that you show your creative vision here!

1. I think it may be nice to streamline it so there is a padding on both sides. But I am not feeling strongly about any choice.

2. I think that was an intentional design decision to have it square, but yes, ideally it should be a similarly behaving button and I am also personally fine with it being rounded.

3. I think the first option is a bit more popping out an easier to notice, but it may look a bit unclean. Since the user likely knows there could be a tab bar there, since it starts not collapsed, I think it is fine to add the border offset.

UI design is something very personal and subjective in many cases, I feel. Here I would be happy if you follow what you think would speak a better front end design / usability language.