Opened 2 years ago
Closed 2 years ago
#34095 closed Bug (fixed)
Form controls in admin should use heights in relative units
Reported by: | Thibaud Colas | Owned by: | SwastikTripathi |
---|---|---|---|
Component: | contrib.admin | Version: | 4.1 |
Severity: | Normal | Keywords: | accessibility |
Cc: | Triage Stage: | Ready for checkin | |
Has patch: | yes | Needs documentation: | no |
Needs tests: | no | Patch needs improvement: | no |
Easy pickings: | yes | UI/UX: | yes |
Description (last modified by )
There are a lot of form controls in the admin that use hard-coded heights in pixels. This is problematic for users which change the font size, as the text then overflows / the UI looks broken.
Here are three in particular that fit neatly in a screenshot: https://code.djangoproject.com/raw-attachment/ticket/34095/Screenshot%202022-10-13%20at%2017.58.12.png
- The search field’s input height
- The actions’ select
- The "Go" button
In all three cases, the fix is as simple as converting the height from pixels to rem (divide by 16).
Attachments (1)
Change History (12)
by , 2 years ago
Attachment: | Screenshot 2022-10-13 at 17.58.12.png added |
---|
comment:1 by , 2 years ago
Description: | modified (diff) |
---|
comment:2 by , 2 years ago
Owner: | changed from | to
---|---|
Status: | new → assigned |
comment:3 by , 2 years ago
Triage Stage: | Unreviewed → Accepted |
---|
comment:4 by , 2 years ago
Has patch: | set |
---|
comment:5 by , 2 years ago
Patch needs improvement: | set |
---|
comment:7 by , 2 years ago
Has patch: | unset |
---|---|
Patch needs improvement: | unset |
There are still more cases to fix, see Thibaud's comment:
"Basically anything that contains text and has a height, max-height or line-height set in pixels is suspect."
"Here is a regex that identifies what to review: (max-height|height|line-height):.+px. Then for each of the definitions this identifies, we need to find the corresponding part of the UI, and check whether it makes sense for it to scale with the font size (if so – convert to `rem). Or whether it better stay at the fixed size."
comment:8 by , 2 years ago
Owner: | changed from | to
---|
comment:11 by , 2 years ago
Resolution: | → fixed |
---|---|
Status: | assigned → closed |
IMO we can consider this ticket as generally fixed. Small related cleanups are of course still welcome.
PR