Authenticated accounts in the user profile have the authenticated user role checked and greyed out. That label has a too low color contrast.
The text color is grey (#828388) while the background is white (#fff) resulting into a contrast ratio of 3.8:1. Since the font size 14.223999977111816px (the listed calculated value in Safari) is smaller than 24px nor bold and smaller than 18,5 px it is considered as regular text and so the contrast ratio has to be 4.5:1 instead of 3:1.
- Go to user/1/edit
- Check the roles section
| Comment | File | Size | Author |
|---|---|---|---|
| user_roles.png | 11.32 KB | rkoller |
Comments
Comment #2
ckrinaThe element
.form-item__label.is-disabledis using the variable--input--disabled-fg-color. It is defined in thevariables.pcss.cssfile on line 104 as--input--disabled-fg-color: var(--color-gray-600). Instead of--color-gray-600it should be using--color-gray-700, with a contrast ratio of 4.53. It'll solve this existing problem in all disabled labels.Comment #3
ckrinaThis is actually a duplicated of #3266299: Claro: Form labels that are disabled have too low color contrast.