Page MenuHomePhabricator

Issue with filter menu width on mobile (OOUI menuSelectWidget)
Open, LowPublicBUG REPORT

Description

Highlighting can be enabled if following a URL e.g. https://en.m.wikipedia.beta.wmflabs.org/wiki/Special:RecentChanges?hidebots=1&hidecategorization=1&limit=50&days=7&enhanced=1&damaging__likelygood_color=c2&urlversion=2

Visit this page in a mobile resolution (320x568).

expected: The menu width should match the width of the Filter button
actual:

Developer notes

The element with the problem has the classes: oo-ui-widget oo-ui-widget-enabled oo-ui-selectWidget oo-ui-selectWidget-unpressed oo-ui-clippableElement-clippable oo-ui-floatableElement-floatable oo-ui-menuSelectWidget mw-rcfilters-ui-menuSelectWidget mw-rcfilters-ui-menuSelectWidget-view-namespaces

It has an inline style set including a width. The calculated width appears to be 10px too big.

Likely an issue with OOUI - "mw-rcfilters-ui-menuSelectWidget-view-namespaces" - the OOUI library sets the width and it's setting it larger than it should be. Looks like it's border box related and will likely need help from @Volker_E to fix this one.

Actual Results:

Expected Results:

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptAug 22 2019, 10:50 PM
Jdlrobson added a subscriber: ovasileva.

Ready for discussion @ovasileva but I think this might be a tricky one and might not be worth the effort right now.

ovasileva triaged this task as Low priority.Aug 23 2019, 3:54 PM
ovasileva moved this task from Incoming to Triaged but Future on the Readers-Web-Backlog board.
Jdlrobson moved this task from Needs triage to Triaged on the Mobile board.Aug 23 2019, 4:08 PM
Restricted Application added a project: Growth-Team. · View Herald TranscriptOct 15 2019, 4:23 PM