Increase contrast for .disabled-content CSS
requested to merge 22348-avt-text-content-does-not-meet-wcag-aa-minimum-contrast-requirements into master
What does this MR do and why?
Increase contrast for disabled content. Instead of using opacity, this change uses $gray-500 to obtain a 4.5:1 minimum contrast ratio on a white surface. The text itself isn't disabled, and at the same time can communicate meaningful information, so it should meet the minimum contrast ratio.
Screenshots or screen recordings
Screenshots are required for UI changes, and strongly recommended for all other merge requests.
| Before | After |
|---|---|
 |
 |
How to set up and validate locally
View an example by going to Settings / Badges, the text that's present when there are no badges uses the .disabled-content class.
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 #22348 (closed)
Edited by Jeremy Elder