fix(color): make brand palette swatches readable in dark mode
-
Please check this box if this contribution uses AI-generated content (including content generated by GitLab Duo features) as outlined in the GitLab DCO & CLA. As a benefit of being a GitLab Community Contributor, you receive complimentary access to GitLab Duo.
Resolves #2012 (closed)
Summary of changes
- hard-codes white
#ffffffor charcoal#171321text color for hard-coded primary and secondary brand swatches, following the pairings suggested in "Contrast and Accessibility" - removes
gl-text-whiteclass names applied to some text on color swatches. This class will still invert the text color when the theme changes, similar to if there is no class & if the default text color is applied. Inverted colors on hard-coded swatches will cause text to be unreadable for one theme or the other.
| Before | After |
|---|---|
|
|
|
|
Note
Technically the Orange 03p color (#E24329) paired with a white text foreground is not fully AA contrast (it is 4.14:1, not 4.5:1), but this is the pairing that is suggested in the "Contrast and Accessibility" for that specific color. I think charcoal would be 4.4:1 contrast... but that's still just short of 4.5:1. I think that would be out-of-scope here, however.
Thank you for reading!
Edited by Dan MH



