Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
#1870944: [Meta] Mobile friendly admin pages
Problem/Motivation
All single column admin pages with field set have a scroll in smaller screens.
Admin URL examples:
- admin/appearance/settings/global
- admin/appearance/settings/seven
- admin/config/development/performance
- admin/config/regional/settings
Proposed resolution
To be determined.
Remaining tasks
To be determined.
Comment | File | Size | Author |
---|---|---|---|
#7 | details-summary-scrollbar-1872606-7.patch | 374 bytes | echoz |
#6 | details-summary-scrollbar-1872606-6.patch | 439 bytes | echoz |
#3 | seven-theme-scroll-600px&less.png | 457.46 KB | Shyamala |
Comments
Comment #1
vijay.cgs CreditAttribution: vijay.cgs commentedProposed resolution
Remove min-width for id #overlay in core/modules/overlay/overlay-child.css file
Old Css
New Css
Add width for class .element-invisible in core/modules/system/system.base.css file
Old Css
New Css
Comment #2
Bojhan CreditAttribution: Bojhan commentedCould this get more context? I dont have a scrollbar? Atleast not an unexpected one?
Comment #2.0
Bojhan CreditAttribution: Bojhan commentedAdd link to meta
Comment #3
Shyamala CreditAttribution: Shyamala commentedadmin/structure: works fine, unable to replicate scroll on this page.
admin/appearance/settings/global & admin/appearance/settings/seven: Pages with field set have a very small scroll below 600px. Refer attached image.
Comment #4
vijay.cgs CreditAttribution: vijay.cgs commentedProposed resolution
Please ignore the Comment #1
Replace width and padding
Old
New
Comment #4.0
vijay.cgs CreditAttribution: vijay.cgs commentedRemoved admin/structure - works fine
Comment #4.1
Shyamala CreditAttribution: Shyamala commentedadded admin/config/development/performance +
changed to All single column admin pages with field set
Comment #5
Shyamala CreditAttribution: Shyamala commentedchanged title
Comment #6
echoz CreditAttribution: echoz commentedThey are no longer fieldsets, this is caused by the details summary needing box-sizing: border-box;
Here's a patch.
Comment #7
echoz CreditAttribution: echoz commentedbox-sizing: border-box; did solve the issue, but not needed if the 100% width is not explicitly declared.
details summary does not need 100% width, this was a throwback from fieldset .fieldset-legend which was a span.
Here's the simpler patch.
Comment #8
rteijeiro CreditAttribution: rteijeiro commentedHi.
Tested the following pages with Chrome and iPhone and all of them are ok:
admin/appearance/settings/global
admin/appearance/settings/seven
admin/config/development/performance
admin/config/regional/settings
No horizontal scroll found on them.
Are there more pages to be tested?
I found some of them with horizontal scroll but it's due a content table, for example: admin/config/people/accounts/fields
Comment #9
moshe weitzman CreditAttribution: moshe weitzman commentedThe tiny scrollbar is indeed gone after this patch.
Comment #10
Dries CreditAttribution: Dries commentedCommitted to 8.x. Thanks.
Comment #11.0
(not verified) CreditAttribution: commentedadded admin/config/regional/settings