Early Bird Registration for DrupalCon Portland 2024 is open! Register by 23:59 PST on 31 March 2024, to get $100 off your ticket.
Long page titles in the overlay make the overlay-content too wide, causing a horizontal scroll bar. The attached patch fixes the issue by allowing the title to wrap onto multiple lines, pushing the overlay-title down the page.
See the attached before and after screenshots.
The screenshots are from Google Chrome. The bug occurs in Google Chrome and I expect also exists in all other compliant browsers. The patch has been tested in Chrom only, but should fix the issue in all compliant browsers. Other browsers need further testing.
Comment | File | Size | Author |
---|---|---|---|
#2 | custom.zip | 2.44 KB | Bevan |
#2 | custom-overlay-child.css_.txt | 564 bytes | Bevan |
After wide.png | 166.84 KB | Bevan | |
Before wide.png | 186.75 KB | Bevan | |
Before-1.png | 114.5 KB | Bevan |
Comments
Comment #1
Bevan CreditAttribution: Bevan commentedThe bug was introduced in #668640: Overlay shouldn't be based on jQuery UI Dialog or in the code it was refactoring.
Related; #724562: Overlay title gets covered up by tabs.
Comment #2
Bevan CreditAttribution: Bevan commentedThe attached CSS file is a shim to fix the issue without needing to modify core, by extending & overriding overlay module's CSS styles. Add it to a custom module or theme.
The attached zip file is a micro-module that adds the CSS shim file to all pages. It includes the CSS shim file. It is not tested. Install it as per usual.
Comment #4
Bevan CreditAttribution: Bevan commentedoverlay-title-wrap.patch queued for re-testing.
Comment #5
AaronBaumanThis issue persists.
Comment #6
Bevan CreditAttribution: Bevan commentedoverlay-title-wrap.patch queued for re-testing.
Comment #7
digitgopher CreditAttribution: digitgopher commentedThanks, this works for me on initial page load. However, as soon as you resize the browser it reverts to the previous behavior. Is there a quick fix?