Themes > Define how/which components change based on theme selection
Currently, some components change their appearance based on which theme the user has selected. One example is the border on active tabs (gitlab-org/gitlab-ui!2183 (merged)).
We need to define when a component takes the coloring of the active theme and how those colors are applied.
Proposal
Themes only extend to the header and left sidebar navigation and not controls within. This provides a more clear delineation between primary navigational elements, and in-page controls. Doing so means we can better audit controls for accessibility, and avoid the compounded effect of themes and dark UI combinations which we don't address today in Pajamas. From a user perspective, this means that in-page controls and function will visually have more parity and relationship.
Next steps
-
Document decision in Pajamas -
Update broadcast messages in GitLab UI to use hex values like labels, not themes -
Update colors of broadcast messages and tabs in Figma to use chromatic palette -
Remove theming from tabs in GitLab UI -
Remove theming from path in GitLab UI