Page MenuHomePhabricator

DropdownWidget is misaligned due to missing `vertical-align` property
Closed, ResolvedPublic

Description

DropdownWidget and other widgets, like ButtonWidget or TextInputWidget are vertically misaligned, when put into layouts like ActionFieldLayout.

Examples:

  • API Sandbox has checkboxes next to the inputs, which should be centered and is centered for text inputs, but not for dropdowns:
  • MediaWiki-extensions-TemplateWizard

Event Timeline

Schnark created this task.Nov 4 2017, 9:28 AM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptNov 4 2017, 9:28 AM

By the way, this doesn't occur with DropdownInputWidget.

Volker_E renamed this task from DropdownWidget and TextInputWidget have different vertical align to DropdownWidget is misaligned due to missing `vertical-align` property.Oct 19 2018, 4:31 PM
Volker_E updated the task description. (Show Details)

Change 468597 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[oojs/ui@master] demos: Add ActionLayout with DropdownWidget demo

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

@Schnark, you were correct. It is the same underlying issue and it's a pity that it seemed obscure to me at first and therefore has been hibernating. :/
[[ https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align | baseline is the default value ]], but as we're going to implement values like middle everywhere else, widgets without middle applied are suddenly misaligned.

Volker_E triaged this task as Medium priority.Oct 19 2018, 4:37 PM

Change 468616 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[oojs/ui@master] DropdownWidget: Fix vertical alignment with other widgets in some layouts

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

Volker_E moved this task from Backlog to Reviewing on the OOUI board.Oct 19 2018, 5:12 PM

Change 468597 merged by jenkins-bot:
[oojs/ui@master] demos: Add ActionLayout with DropdownWidget demo

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

Volker_E closed this task as Resolved.Oct 19 2018, 7:32 PM
Volker_E claimed this task.
Volker_E moved this task from Reviewing to OOUI-0.29.3 on the OOUI board.
Volker_E edited projects, added OOUI (OOUI-0.29.3); removed OOUI.
Volker_E removed a project: Patch-For-Review.

Change 468616 merged by jenkins-bot:
[oojs/ui@master] DropdownWidget: Fix vertical alignment with other widgets in some layouts

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

Change 470967 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[mediawiki/core@master] Update OOUI to v0.29.3

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

Change 470967 merged by jenkins-bot:
[mediawiki/core@master] Update OOUI to v0.29.3

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

Volker_E removed a subscriber: gerritbot.