Page MenuHomePhabricator

Allow dropdown menus to autosize to larger than their handles
Closed, ResolvedPublic

Description

Dropdowns currently fix their size to the width of the handle

This is consistent with native dropdowns (<select>), but when the labels are longer than the handle, we start clipping:

whereas a native dropdown would expand the menu until you run of of screen space, similar to how our PopupToolGroups work:

On limited canvas:

BeforeAfter

Event Timeline

Esanders created this task.May 21 2018, 5:53 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMay 21 2018, 5:53 PM

Change 434360 had a related patch set uploaded (by Esanders; owner: Esanders):
[oojs/ui@master] Allow dropdown menus to be larger than their handles

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

With this fixed, an extended dropdown could be the solution to T178387. Also some users are already going to great lengths to mimic this behaviour (https://phabricator.wikimedia.org/diffusion/ECTX/browse/master/modules/ui/widgets/mw.cx.ui.PersonalMenuWidget.js)

Volker_E moved this task from Backlog to Reviewing on the OOUI board.May 22 2018, 6:32 PM

As mentioned on the patch, the idea seems reasonable and good. One limit should be “smartphone” max-width of 320 px and then be cut off with 'ellipsis'
We shouldn't run into issue of one overlength item stretching a menu to 500 pixels.

ClippableElement handles all that for us.

Volker_E updated the task description. (Show Details)May 28 2018, 2:25 PM

In a perfect world, clippable would provide same distance left and right, but it's definitely an improvement (see before/after screens in task)

Volker_E closed this task as Resolved.May 28 2018, 2:38 PM
Volker_E assigned this task to Esanders.
Volker_E triaged this task as Medium priority.
Volker_E moved this task from Reviewing to OOUI-0.27.1 on the OOUI board.
Volker_E edited projects, added OOUI (OOUI-0.27.1); removed OOUI.
Volker_E removed a project: Patch-For-Review.
Volker_E removed a subscriber: gerritbot.

Change 434360 merged by jenkins-bot:
[oojs/ui@master] MenuSelectWidget: Allow dropdown menus to be larger than their handles

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

This will help in nasty combos like

. Great.

Vvjjkkii renamed this task from Allow dropdown menus to autosize to larger than their handles to ijcaaaaaaa.Jul 1 2018, 1:08 AM
Vvjjkkii reopened this task as Open.
Vvjjkkii removed Esanders as the assignee of this task.
Vvjjkkii raised the priority of this task from Medium to High.
Vvjjkkii updated the task description. (Show Details)
Vvjjkkii removed a subscriber: Aklapper.
CommunityTechBot renamed this task from ijcaaaaaaa to Allow dropdown menus to autosize to larger than their handles.Jul 2 2018, 4:43 AM
CommunityTechBot closed this task as Resolved.
CommunityTechBot assigned this task to Esanders.
CommunityTechBot lowered the priority of this task from High to Medium.
CommunityTechBot updated the task description. (Show Details)
CommunityTechBot added a subscriber: Aklapper.