#36513: Background color for admin's m2m multi-select "selected" rows is broken
in
Edge
-------------------------------+------------------------------------
Reporter: cjs59 | Owner: (none)
Type: Bug | Status: new
Component: contrib.admin | Version: 5.2
Severity: Normal | Resolution:
Keywords: accessibility | Triage Stage: Accepted
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------+------------------------------------
Description changed by Antoliny:
Old description:
> The change in https://code.djangoproject.com/ticket/35809 has made the
> selected item hard to read in Microsoft Edge, as it displays as white
> text on a yellow background when the m2m widget is not in focus. Chrome
> and Firefox both display it as black text on a yellow background. When
> the user clicks on the m2m widget, it changes to use the browser's built-
> in colours: white text on dark grey for Edge, and white text on blue for
> Chrome/Firefox.
>
> I am attaching screenshots to show the focused and unfocused colours in
> both Edge and Chrome.
>
> Adding the following to a custom CSS file fixes Edge so the unfocused
> widget renders the same as in Chrome:
>
> {{{
> form .aligned select option:checked {
> color: var(--body-fg);
> }
> }}}
New description:
The change in https://code.djangoproject.com/ticket/35809 has made the
selected item hard to read in Microsoft Edge, as it displays as white text
on a yellow background when the m2m widget is not in focus. Chrome and
Firefox both display it as black text on a yellow background. When the
user clicks on the m2m widget, it changes to use the browser's built-in
colours: white text on dark grey for Edge, and white text on blue for
Chrome/Firefox.
I am attaching screenshots to show the focused and unfocused colours in
both Edge and Chrome.
Adding the following to a custom CSS file fixes Edge so the unfocused
widget renders the same as in Chrome:
{{{
form .aligned select option:checked {
color: var(--body-fg);
}
}}}
** Chrome focused **
[[Image(Chrome-focused.png)]]
** Chrome unfocused **
[[Image(Chrome-unfocused.png)]]
** Edge focused **
[[Image(Edge-focused.png)]]
** Edge unfocused **
[[Image(Edge-unfocused.png)]]
--
--
Ticket URL: <https://code.djangoproject.com/ticket/36513#comment:4>
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 [email protected].
To view this discussion visit
https://groups.google.com/d/msgid/django-updates/010701982a018ac7-1d5e1f80-9ea6-42d7-bc20-5e85a668d854-000000%40eu-central-1.amazonses.com.
