Opened 3 years ago

Closed 3 years ago

#33833 closed Bug (fixed)

Close button styling issues in admin forms’ submit row

Reported by: Thibaud Colas Owned by: Leonid Podriz
Component: contrib.admin Version: 4.0
Severity: Normal Keywords: button, focus
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 Thibaud Colas)

Picked up as part of reviewing #33728 / ​PR #15734 – in the admin’s submit_line.html / submit-row, the Close button is misaligned:

https://code.djangoproject.com/raw-attachment/ticket/33833/close-button-admin.png

And it has an unexpected underline on focus:

https://code.djangoproject.com/raw-attachment/ticket/33833/close-button-focus.png

The misalignment & other spacing issues are particularly visible when there are multiple buttons displayed, though it’s not clear to me whether this actually happens in practice:

https://code.djangoproject.com/raw-attachment/ticket/33833/close-button-group.png

This is also the case when buttons are displayed vertically in the "mobile" viewports.

---

To reproduce this, access a model form with a user who only has "View" permissions.

Attachments (3)

close-button-admin.png​ (3.2 KB ) - added by Thibaud Colas 3 years ago.
close-button-focus.png​ (8.5 KB ) - added by Thibaud Colas 3 years ago.
close-button-group.png​ (10.3 KB ) - added by Thibaud Colas 3 years ago.

Download all attachments as: .zip

Change History (9)

by Thibaud Colas, 3 years ago

Attachment: close-button-admin.png​ added

by Thibaud Colas, 3 years ago

Attachment: close-button-focus.png​ added

by Thibaud Colas, 3 years ago

Attachment: close-button-group.png​ added

comment:1 by Thibaud Colas, 3 years ago

Description: modified (diff)

comment:2 by Mariusz Felisiak, 3 years ago

Triage Stage: Unreviewed → Accepted

Thanks for the report.

comment:3 by Leonid Podriz, 3 years ago

Easy pickings: set
Owner: changed from nobody to Leonid Podriz
Status: new → assigned

comment:4 by Mariusz Felisiak, 3 years ago

Has patch: set
Patch needs improvement: set

​PR

comment:5 by Mariusz Felisiak, 3 years ago

Patch needs improvement: unset
Triage Stage: Accepted → Ready for checkin

comment:6 by GitHub <noreply@…>, 3 years ago

Resolution: → fixed
Status: assigned → closed

In eae973df:

Fixed #33833 -- Corrected .closelink admin CSS.

Co-authored-by: Leonid Podriz <leonidpodriz@…>

Note: See TracTickets for help on using tickets.
Back to Top