Code Highlight - Address a11y contrast issues
What does this MR do and why?
Closes #346975 (closed)
Found when working on !75279 (merged)
There are some A11y concerns on the line numbers when highlighting lines of code on MR diffs. The contrast of the foreground to background are not AA compliant.
This is/was a very minute issue but was further exposed when the scss mixin was used as part of !75279 (merged) with SVG icons.
Screenshots or screen recordings
| Theme | Before | After |
|---|---|---|
| White |  |
 |
| Dark |  |
 |
| Solar Light |  |
 |
| Solar Dark |  |
 |
| Monakai |  |
 |
| None |  |
 |
| Dark Mode w/ Dark |  |
 |
How to set up and validate locally
- Fetch this branch
- Go to a MR with code changes
- Go to the Changes Tab
- Hover over a line and notice the CSS changes to the line numbers
- Repeat for each syntax theme (set in user 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 #346975 (closed)
Edited by Zack Cuddy