Utilize GitLab UI variables for color themes
What does this MR do and why?
Update theme color hex values to match GitLab UI and design specs.
Screenshots or screen recordings
Screenshots are required for UI changes, and strongly recommended for all other merge requests.
👁🗨 View before and after images
| Before | After |
|---|---|
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
- Hex values are pulled from https://gitlab.com/gitlab-org/gitlab-ui/-/blob/main/src/scss/variables.scss.
- Changing the
$indigo-prefix to$theme-indigo-is out of scope for this and requires additional changes throughout the SCSS. Currently, because$theme-indigo-is only in GitLab UI it doesn't get overwritten here.
How to set up and validate locally
- Go to User settings > Preferences
- Inspect the hex values (Note that if you're using the new navigation, the themes won't change until !127990 (merged) has merged. In addition to developer tools in the browser, I use ColorSlurp to help speed up the inspection (color profile set to Use Native Values in app preferences).
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.
Related to #336146 (closed)
Edited by Jeremy Elder