[Django] #35008: Minifiers break django contrib admins UI
Django
-------------------------------------+-------------------------------------
Reporter: Raphaël | Owner: nobody
Stefanini |
Type: | Status: new
Cleanup/optimization |
Component: | Version: 4.2
contrib.admin | Keywords: UI admin minified
Severity: Normal | css
Triage Stage: | Has patch: 0
Unreviewed |
Needs documentation: 0 | Needs tests: 0
Patch needs improvement: 0 | Easy pickings: 1
UI/UX: 1 |
-------------------------------------+-------------------------------------
I have been using a HTML minifier on django's output and it breaks some UI
elements in django's shipped admin by stripping some default attributes,
mainly by removing `type="text"` on inputs, since it is a default html
input attribute.
This affect anyone who would use a minifier either as middleware or as CDN
feature, and the logic is clear, you don't have to keep default html
attribute.
The problem is that django repo CSS rules don't take that in account and
it assume for all attributes to be present.
Django would need to have a CSS rule stating `input:not([type]),
input[type=text]` instead of just `input[type=text]` for the minified
version to match the original UI.
I have found only three places in django.contrib.admin that would need a
CSS update, so I believe it is an easy fix:
{{{
// base.css:485
input:not([type]),
...
{
border: 1px solid var(--border-color);
border-radius: 4px;
padding: 5px 6px;
margin-top: 0;
color: var(--body-fg);
background-color: var(--body-bg);
}
// base.css:495
input:not([type]):focus,
...
{
border-color: var(--body-quiet-color);
}
// responsive.css:177
.form-row input:not([type]),
...
{
box-sizing: border-box;
margin: 0;
padding: 6px 8px;
min-height: 2.25rem;
font-size: 0.875rem;
}
}}}
I create this ticket after having discussed the issue here
https://github.com/adamchainz/django-minify-html/issues/165
--
Ticket URL: <https://code.djangoproject.com/ticket/35008>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
Django
-------------------------------------+-------------------------------------
Type: | Status: new
Cleanup/optimization |
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage:
css | Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
Comment (by Mariusz Felisiak):
It was already proposed, check out
[https://github.com/django/django/pull/17183#issuecomment-1688888212
comment]. I'm pretty sure that we will remove them in some cleanup PR
titled ''"Removed unused CSS rules ...'"'. We normally don't add CSS rules
not used by Django itself.
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:1>
Django
-------------------------------------+-------------------------------------
Type: | Status: assigned
Cleanup/optimization |
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage:
css | Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
* owner: nobody => aman0408
* status: new => assigned
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:2>
Django
-------------------------------------+-------------------------------------
Type: | Status: assigned
Cleanup/optimization |
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
css |
Has patch: 1 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
* owner: Aman Agrawal => monosans
* has_patch: 0 => 1
* stage: Unreviewed => Accepted
Comment:
Tentatively accepted.
[https://github.com/django/django/pull/17183/ PR]
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:3>
Django
-------------------------------------+-------------------------------------
Type: | Agrawal
Cleanup/optimization | Status: assigned
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage: Accepted
css |
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
Changes (by Mariusz Felisiak):
* stage: Unreviewed => Accepted
Comment:
Tentatively accepted.
--
Django
-------------------------------------+-------------------------------------
Reporter: Raphaël Stefanini | Owner: Aman
Type: | Agrawal
Cleanup/optimization | Status: assigned
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage: Accepted
css |
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
Comment (by Raphaël Stefanini):
What about re-opening this PR then?
https://github.com/django/django/pull/17183
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:4>
Django
-------------------------------------+-------------------------------------
Reporter: Raphaël Stefanini | Owner: Aman
Type: | Agrawal
Cleanup/optimization | Status: assigned
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage: Accepted
css |
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
Comment (by Mariusz Felisiak):
Raphaël, feel-free to send a new PR (based on PR17183). We need to at
least add a comment to the CSS files.
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:5>
Django
-------------------------------------+-------------------------------------
Reporter: Raphaël Stefanini | Owner: Aman
Type: | Agrawal
Cleanup/optimization | Status: assigned
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage: Accepted
css |
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
Comment (by Raphaël Stefanini):
New PR with added comments https://github.com/django/django/pull/17631
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:6>
Django
-------------------------------------+-------------------------------------
Reporter: Raphaël Stefanini | Owner: Aman
Type: | Agrawal
Cleanup/optimization | Status: assigned
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
css | checkin
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
* stage: Accepted => Ready for checkin
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:7>
Django
-------------------------------------+-------------------------------------
Type: | Stefanini
Cleanup/optimization | Status: assigned
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage: Ready for
css | checkin
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
Changes (by Mariusz Felisiak):
* owner: Aman Agrawal => Raphaël Stefanini
* has_patch: 0 => 1
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:8>
Django
-------------------------------------+-------------------------------------
Type: | Felisiak
Cleanup/optimization | Status: assigned
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution:
Keywords: UI admin minified | Triage Stage: Ready for
css | checkin
Has patch: 1 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
* owner: Raphaël Stefanini => Mariusz Felisiak
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:9>
Django
-------------------------------------+-------------------------------------
Reporter: Raphaël Stefanini | Owner: Mariusz
Type: | Felisiak
Component: contrib.admin | Version: 4.2
Severity: Normal | Resolution: fixed
Keywords: UI admin minified | Triage Stage: Ready for
css | checkin
Has patch: 1 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 1 | UI/UX: 1
-------------------------------------+-------------------------------------
* status: assigned => closed
* resolution: => fixed
Comment:
In [changeset:"5c6906cef4d4858bfe8d00de94eb797aa40b31fd" 5c6906c]:
{{{
#!CommitTicketReference repository=""
revision="5c6906cef4d4858bfe8d00de94eb797aa40b31fd"
Fixed #35008 -- Added CSS rule for <input> HTML tags with no type.
Minifiers remove the default (text) "type" attribute from "input" HTML
tags. This adds input:not([type]) to make the CSS stylesheet work the
same.
}}}
--
Ticket URL: <https://code.djangoproject.com/ticket/35008#comment:10>