#34037: Low text contrast for grey buttons in admin light theme
-------------------------------------+-------------------------------------
Reporter: Thibaud | Owner: nobody
Colas |
Type: | Status: new
Uncategorized |
Component: | Version: 4.0
contrib.admin | Keywords: accessibility,
Severity: Normal | color contrast, ux
Triage Stage: | Has patch: 0
Unreviewed |
Needs documentation: 0 | Needs tests: 0
Patch needs improvement: 0 | Easy pickings: 0
UI/UX: 1 |
-------------------------------------+-------------------------------------
The Django admin’s light theme uses mid-grey backgrounds for the "object
tools" and "cancel" buttons, which doesn’t offer enough contrast combined
with their white text. Here is a [https://contrast-
grid.eightshapes.com/?version=1.1.0&background-colors=%23fff%2C%20body-
bg%0D%0A%23417690%2C%20header-bg%0D%0A%2379aec8%2C%20breadcrumbs-
bg%0D%0A%23dfd%2C%20message-success-bg%0D%0A%23ffc%2C%20message-warning-
bg%0D%0A%23ffefef%2C%20message-error-bg%0D%0A%23f8f8f8%2C%20darkened-
bg%0D%0A%23e4e4e4%2C%20selected-bg%0D%0A%2379aec8%2C%20button-
bg%0D%0A%23609ab6%2C%20button-hover-bg%0D%0A%23417690%2C%20default-button-
bg%0D%0A%23205067%2C%20default-button-hover-bg%0D%0A%23888%2C%20close-
button-bg%0D%0A%23747474%2C%20close-button-hover-bg%0D%0A%23ba2121%2C
%20delete-button-bg%0D%0A%23a41515%2C%20delete-button-hover-bg&foreground-
colors=%2379aec8%2C%20primary%0D%0A%23417690%2C%20secondary%0D%0A%23f5dd5d%2C%20accent%0D%0A%23fff%2C
%20primary-fg%0D%0A%23333%2C%20body-fg%0D%0A%23666%2C%20body-quiet-
color%0D%0A%23000%2C%20body-loud-color%0D%0A%23ffc%2C%20header-
color%0D%0A%23f5dd5d%2C%20header-branding-color%0D%0A%23fff%2C%20header-
link-color%0D%0A%23fff%2C%20breadcrumbs-link-fg%0D%0A%23c4dce8%2C
%20breadcrumbs-fg%0D%0A%23447e9b%2C%20link-fg%0D%0A%23036%2C%20link-hover-
color%0D%0A%235b80b2%2C%20link-selected-fg%0D%0A%23e8e8e8%2C%20hairline-
color%0D%0A%23ccc%2C%20border-color%0D%0A%23ba2121%2C%20error-
fg%0D%0A%23ffc%2C%20selected-row%0D%0A%23fff%2C%20button-fg&es-color-
form__tile-size=compact&es-color-form__show-contrast=aaa&es-color-
form__show-contrast=aa&es-color-form__show-contrast=aa18&es-color-
form__show-contrast=dnp full contrast grid] of the light theme color
palette for reference.
This can be fixed by changing the one `--close-button-bg` variable I
believe. I would recommend setting it to `#747474`, currently used for
those buttons’ hover state, and switch the hover state to use a much
darker `#333` instead.
--
Ticket URL: <https://code.djangoproject.com/ticket/34037>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
--
You received this message because you are subscribed to the Google Groups
"Django updates" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to django-updates+unsubscr...@googlegroups.com.
To view this discussion on the web visit
https://groups.google.com/d/msgid/django-updates/010701836e70ca0e-7eb5a059-c6d8-40e2-b520-9d9090ef26c1-000000%40eu-central-1.amazonses.com.
