Page MenuHomePhabricator
Create Task
Maniphest T113495

Buttons in ButtonGroupWidget don't have same height/are misaligned
Closed, ResolvedPublic
Actions

Assigned To
Volker_E
Authored By
Esanders
Sep 23 2015, 5:13 PM
Tags
Referenced Files
F6464468: T113495 Button misalignment Screenshot 2017-03-06.png
Mar 12 2017, 4:13 AM
F4223226: Screen Shot 2016-07-02 at 00.30.42.png
Aug 4 2016, 5:28 PM
F3012953: delete-link.png
Nov 26 2015, 2:43 PM
F3016334: Unbenannt.PNG
Nov 26 2015, 2:43 PM
F2968559: Screen Shot 2015-11-16 at 14.59.04.png
Nov 17 2015, 1:24 AM
F2628521: pasted_file
Sep 23 2015, 5:13 PM
Subscribers
Aklapper
• Elitre
Esanders
gerritbot
Jdforrester-WMF
matmarex
Pginer-WMF
View All 11 Subscribers

Description

pasted_file (52×163 px, 1 KB)

delete-link.png (220×510 px, 47 KB)

Screen Shot 2016-07-02 at 00.30.42.png (388×924 px, 44 KB)

Details

SubjectRepoBranchLines +/-
MediaWiki theme: Align “framed” ButtonWidgets cross-browseroojs/uimaster+12 -6
MediaWiki theme: Ensure framed buttons are same heightoojs/uimaster+17 -6
Customize query in gerrit

Related Objects
Search...

Event Timeline

Esanders created this task.Sep 23 2015, 5:13 PM
Esanders raised the priority of this task from to Needs Triage.
Esanders updated the task description. (Show Details)
Esanders added a project: OOUI.
Esanders added subscribers: Esanders, • Prtksxna.
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptSep 23 2015, 5:13 PM
Jdforrester-WMF triaged this task as Medium priority.Sep 23 2015, 6:24 PM
Jdforrester-WMF set Security to None.
Jdforrester-WMF raised the priority of this task from Medium to High.Nov 17 2015, 1:24 AM
Jdforrester-WMF subscribed.

This is pretty high-profile now:

Screen Shot 2015-11-16 at 14.59.04.png (191×429 px, 23 KB)

Can we fix it reasonably?

matmarex mentioned this in T119615: Change the action buttons in context menus to be separate buttons, not a button group.Nov 26 2015, 2:07 PM
Pginer-WMF updated the task description. (Show Details)Nov 26 2015, 2:43 PM
Pginer-WMF added subscribers: matmarex, Pginer-WMF.

I added some of the examples commented at T119615 in the description.
Thanks @matmarex for pointing to this ticket.

Pginer-WMF added a parent task: T119615: Change the action buttons in context menus to be separate buttons, not a button group.Nov 26 2015, 2:45 PM
Tgr subscribed.Nov 26 2015, 10:42 PM

The MediaViewer buttons do not use OOUI; they are constructed manually (processFilePageThumb() in resources/mmv/mmv.bootstrap.js). And they used to be properly aligned, so this seems like a regression in the .mw-ui-button-group CSS class.

matmarex updated the task description. (Show Details)Feb 16 2016, 11:56 AM

Splitting off the MultimediaViewer issue to T127052.

matmarex mentioned this in T127052: MMV buttons on file description page are misaligned.Feb 16 2016, 11:57 AM
Volker_E subscribed.Jul 4 2016, 1:21 PM
gerritbot subscribed.Jul 4 2016, 1:51 PM

Change 297260 had a related patch set uploaded (by VolkerE):
MediaWiki theme: Ensure buttons in ButtonGroupWidget are same height

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

gerritbot added a project: Patch-For-Review.Jul 4 2016, 1:51 PM
Volker_E claimed this task.Jul 4 2016, 1:53 PM
Volker_E moved this task from Backlog to Reviewing on the OOUI board.
Volker_E added a project: UI-Standardization-Kanban.
Restricted Application added a project: UI-Standardization. · View Herald TranscriptJul 4 2016, 1:54 PM
Danny_B moved this task from Unsorted to OOUI on the UI-Standardization board.Jul 4 2016, 10:03 PM
Volker_E moved this task from Backlog to Review on the UI-Standardization-Kanban board.Jul 5 2016, 3:08 PM
Volker_E renamed this task from Buttons in ButtonGroupWidget don't have same height to Buttons in ButtonGroupWidget don't have same height/are misaligned.Aug 4 2016, 5:27 PM
Volker_E merged a task: T139220: Cancel and edit icon misaligned in link inspector.
Volker_E updated the task description. (Show Details)
Volker_E added subscribers: Krinkle, Zppix.
Volker_E added a parent task: T130691: Sub-pixel rendering layout issues with `em` or `%` relative units (tracking).Aug 4 2016, 5:31 PM
Volker_E added a subtask: T142115: Widgets with expected same-height are of different height and misaligned.Aug 4 2016, 6:28 PM
Volker_E removed a parent task: T119615: Change the action buttons in context menus to be separate buttons, not a button group.
Jdforrester-WMF closed this task as Resolved.Nov 29 2016, 11:16 PM
Jdforrester-WMF closed subtask T142115: Widgets with expected same-height are of different height and misaligned as Resolved.
Jdforrester-WMF edited projects, added OOUI (OOjs-UI-0.18.0); removed Patch-For-Review, OOUI.
Volker_E moved this task from Review to Done on the UI-Standardization-Kanban board.Dec 5 2016, 8:08 PM
Volker_E mentioned this in T122503: Edit link panel has uneven height of OOUI buttons in desktop Safari.Mar 9 2017, 5:31 AM
Volker_E mentioned this in T159580: Firefox/Mac vertical alignment in widgets is off.
Volker_E reopened this task as Open.Mar 12 2017, 4:06 AM
Volker_E added a subscriber: • Elitre.EditedMar 12 2017, 4:13 AM

Doesn't seem fully resolved, on certain platforms/browsers we're still running into this.

@Elitre would you please provide as much information as possible from your comment on https://phabricator.wikimedia.org/T159580#3076419?
Given the screenshot

T113495 Button misalignment Screenshot 2017-03-06.png (372×718 px, 110 KB)

Which browser (I guess Chrome), browser version, operating system, which font!? I can help you in finding especially the latter out.

SamanthaNguyen added projects: CSS, Regression.Mar 12 2017, 4:32 AM
gerritbot added a comment.Mar 12 2017, 6:22 AM

Change 341117 had a related patch set uploaded (by VolkerE):
[oojs/ui] MediaWiki theme: Align “framed” ButtonWidgets cross-browser

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

gerritbot added a project: Patch-For-Review.Mar 12 2017, 6:22 AM
gerritbot added a comment.Mar 12 2017, 6:40 AM

Change 297260 abandoned by VolkerE:
MediaWiki theme: Ensure framed buttons are same height

Reason:
Abandoned in favor of Ic2935cb5d9 and I9a2d3975927

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

gerritbot added a comment.Mar 14 2017, 6:07 PM

Change 341117 merged by jenkins-bot:
[oojs/ui] MediaWiki theme: Align “framed” ButtonWidgets cross-browser

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

Krinkle unsubscribed.Mar 18 2017, 3:14 AM
Volker_E closed this task as Resolved.Jun 26 2017, 9:53 PM
Volker_E removed a project: Patch-For-Review.

We've got this somewhat under control. There might be still rare cases of this happening especially under nested inheritance. But for now it's good to be resolved and we might look back at it when a change towards px sizing becomes reality.

Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL · Credits