[Django] #32512: autocomplete_fields not displaying correctly in dark theme
Django
------------------------------------------+------------------------
Reporter: Simon Willison | Owner: nobody
Type: Uncategorized | Status: new
Component: contrib.admin | Version: 3.2
Severity: Normal | Keywords:
Triage Stage: Unreviewed | Has patch: 0
Needs documentation: 0 | Needs tests: 0
Patch needs improvement: 0 | Easy pickings: 0
UI/UX: 0 |
------------------------------------------+------------------------
See attached screenshot - the autocomplete_fields option in the Django
admin isn't currently compatible with the new dark mode.
--
Ticket URL: <https://code.djangoproject.com/ticket/32512>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
Django
Reporter: Simon Willison | Owner: nobody
Type: Uncategorized | Status: new
Component: contrib.admin | Version: 3.2
Keywords: | Triage Stage: Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Changes (by Simon Willison):
* Attachment "E7E5D8CF-42D4-49E1-B6AF-155931DD93E1.jpeg" added.
Django
Reporter: Simon Willison | Owner: nobody
Type: Uncategorized | Status: new
Component: contrib.admin | Version: 3.2
Keywords: | Triage Stage: Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Comment (by Simon Willison):
Related recent change:
https://github.com/django/django/commit/0a802233ec1421e5e59a486be69daef9b112fd0d
#diff-e8dc09f76fa6348998f7be2833217b13d1f56d2fbfd067722d9b47cd53363226 for
#32018
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:1>
Django
Reporter: Simon Willison | Owner: nobody
Component: contrib.admin | Version: 3.2
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Changes (by Mariusz Felisiak):
* cc: Michel Le Bihan, Matthias Kestenholz, Tom Carrick, Carlton Gibson
(added)
* type: Uncategorized => Bug
* severity: Normal => Release blocker
Comment:
Thanks for the report. It looks that we missed `autocomplete.css` in
b5cef91a91c9dbb697b65ef978a7de0b2c5cf564.
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:2>
Django
Reporter: Simon Willison | Owner: nobody
Component: contrib.admin | Version: 3.2
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Accepted
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Changes (by Mariusz Felisiak):
* stage: Unreviewed => Accepted
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:3>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Type: Bug | Status: assigned
Component: contrib.admin | Version: 3.2
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Accepted
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Changes (by Michel Le Bihan):
* owner: nobody => Michel Le Bihan
* status: new => assigned
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:4>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Type: Bug | Status: assigned
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Accepted
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Comment (by Matthias Kestenholz):
Something like this fixes it:
{{{
diff --git a/django/contrib/admin/static/admin/css/autocomplete.css
b/django/contrib/admin/static/admin/css/autocomplete.css
index 88e9eacb9a..f1d5f50550 100644
--- a/django/contrib/admin/static/admin/css/autocomplete.css
+++ b/django/contrib/admin/static/admin/css/autocomplete.css
@@ -190,8 +190,15 @@ select.admin-autocomplete {
border-bottom-right-radius: 0;
}
+.select2-container--admin-autocomplete .select2-search--dropdown {
+ background: var(--body-bg);
+ color: var(--body-fg);
+}
+
.select2-container--admin-autocomplete .select2-search--dropdown
.select2-search__field {
border: 1px solid var(--border-color);
+ background: var(--body-bg);
+ color: var(--body-fg);
}
.select2-container--admin-autocomplete .select2-search--inline
.select2-search__field {
@@ -257,7 +264,7 @@ select.admin-autocomplete {
.select2-container--admin-autocomplete .select2-results__option--
highlighted[aria-selected] {
background-color: var(--primary);
- color: var(--body-bg);
+ color: var(--header-link-color);
}
.select2-container--admin-autocomplete .select2-results__group {
}}}
But I think we should introduce a `--primary-fg` variable (or something)
which can be used to make text appearing on a `--primary` background
readable, instead of (ab)using `--header-link-color` outside the header so
much. This also applies to the nav sidebar etc.
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:5>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Type: Bug | Status: assigned
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Accepted
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Comment (by Michel Le Bihan):
@Matthias Kestenholz Should I assign this ticket to you since you are
already working on it?
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:6>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Type: Bug | Status: assigned
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Accepted
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Comment (by Matthias Kestenholz):
No, this was just a quick test; if you're happy with the patch above
please submit it. But I think that another variable should be introduced
and now's probably the best time to do this, before the first stable
release of the theming support. I'd be grateful if you could continue
working on this issue. Thanks!
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:7>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Type: Bug | Status: assigned
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Accepted
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Changes (by Jacob Walls):
* has_patch: 0 => 1
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:8>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Type: Bug | Status: assigned
Severity: Release blocker | Resolution:
Keywords: | Triage Stage: Ready for
| checkin
Has patch: 1 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Changes (by Mariusz Felisiak):
* stage: Accepted => Ready for checkin
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:9>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Component: contrib.admin | Version: 3.2
Severity: Release blocker | Resolution: fixed
Keywords: | Triage Stage: Ready for
| checkin
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Changes (by Mariusz Felisiak <felisiak.mariusz@…>):
* status: assigned => closed
* resolution: => fixed
Comment:
In [changeset:"0df5c8187a9fa9828824ec2b1fdf37d1082d7ebe" 0df5c818]:
{{{
#!CommitTicketReference repository=""
revision="0df5c8187a9fa9828824ec2b1fdf37d1082d7ebe"
Fixed #32512 -- Fixed admin dark theme for autocomplete fields.
}}}
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:10>
Django
Reporter: Simon Willison | Owner: Michel Le
| Bihan
Type: Bug | Status: closed
Severity: Release blocker | Resolution: fixed
Keywords: | Triage Stage: Ready for
| checkin
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
Comment (by Mariusz Felisiak <felisiak.mariusz@…>):
In [changeset:"450330952f4f0171c6755ca632a91664993f0385" 45033095]:
{{{
#!CommitTicketReference repository=""
revision="450330952f4f0171c6755ca632a91664993f0385"
[3.2.x] Fixed #32512 -- Fixed admin dark theme for autocomplete fields.
Backport of 0df5c8187a9fa9828824ec2b1fdf37d1082d7ebe from main
}}}
--
Ticket URL: <https://code.djangoproject.com/ticket/32512#comment:11>