Page MenuHomePhabricator

Gallery slideshow controls take up more than one line on narrow displays
Closed, ResolvedPublic

Description

To reproduce: Put a gallery slideshow inside a <div> with max-width set to a value less than approx 270px (and images larger than this in the gallery).
Actual results: The "right arrow" control wraps onto the next line.
Expected results: The gallery controls should have a responsive layout, reducing the spacing between themselves as the available width reduces.

One way to do this would be to specify the ul.gallery.mw-gallery-slideshow .mw-gallery-slideshow-buttons .oo-ui-buttonElement left/right margins in percentage terms (e.g. 5%) rather than a fixed 2em value.

Reported on enwiki's Wikipedia talk:WikiProject portals.

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald Transcript
Vvjjkkii renamed this task from Gallery slideshow controls take up more than one line on narrow displays to tebaaaaaaa.Jul 1 2018, 1:05 AM
Vvjjkkii triaged this task as High priority.
Vvjjkkii updated the task description. (Show Details)
Vvjjkkii removed a subscriber: Aklapper.
AfroThundr3007730 renamed this task from tebaaaaaaa to Gallery slideshow controls take up more than one line on narrow displays.Jul 1 2018, 5:01 AM
AfroThundr3007730 raised the priority of this task from High to Needs Triage.
AfroThundr3007730 updated the task description. (Show Details)
AfroThundr3007730 added a subscriber: Aklapper.

Change 505243 had a related patch set uploaded (by Esanders; owner: Esanders):
[mediawiki/core@master] Gallery slideshow: Remove excess margin on controls

https://gerrit.wikimedia.org/r/505243

Change 505243 merged by jenkins-bot:
[mediawiki/core@master] Gallery slideshow: Remove excess margin on controls

https://gerrit.wikimedia.org/r/505243