Alignment of update text in hamburger menu is slightly off in Photon

VERIFIED FIXED in Firefox 57

Status

()

defect
P1
normal
VERIFIED FIXED
2 years ago
2 years ago

People

(Reporter: dthayer, Assigned: sfoster)

Tracking

Trunk
Firefox 57
Points:
---

Firefox Tracking Flags

(firefox57 verified)

Details

(Whiteboard: [reserve-photon-structure])

Attachments

(2 attachments)

When an update is available, the "Restart to update Nightly" text is slightly left of where it should be with the new photon hamburger menu.
Priority: -- → P2
Whiteboard: [photon-visual][p2]
Whiteboard: [photon-visual][p2] → [photon-visual][p2] [triage]
Priority: P2 → --
Whiteboard: [photon-visual][p2] [triage] → [photon-structure][triage]
Component: Application Update → Theme
Product: Toolkit → Firefox
Version: 55 Branch → Trunk
Flags: qe-verify+
Priority: -- → P4
QA Contact: gwimberly
Whiteboard: [photon-structure][triage] → [reserve-photon-structure]
Can you still reproduce this? I looked a minute ago and the text looked aligned correctly to me (Linux/Nightly).
Flags: needinfo?(dothayer)
Posted image alignment.png
Yup - see attached.
Flags: needinfo?(dothayer)
Duplicate of this bug: 1390483
Assignee: nobody → sfoster
Looks like the padding we're seeing on the other items is defined here: http://searchfox.org/mozilla-central/source/browser/themes/shared/customizableui/panelUI.inc.css#1208, so this patch just matches that value of 12px for the start padding.
Status: NEW → ASSIGNED
Priority: P4 → P1
Comment on attachment 8909545 [details]
Bug 1386726 - Fix alignment of banner item labels in the hamburger menu.

https://reviewboard.mozilla.org/r/181022/#review186436

::: browser/themes/shared/customizableui/panelUI.inc.css:780
(Diff revision 1)
>  /* in Photon, we have a bottom border as well. Reconcile with the above rule
>   * after photon launch. */
>  #appMenu-mainView > .panel-subview-body > .panel-banner-item {
>    border-bottom: 1px solid var(--panel-separator-color);
>    margin-bottom: 3px;
> -  padding-inline-start: 10px;
> +  padding-inline-start: 12px;

This doesn't look right on OS X. I think it needs to be 18px to match http://searchfox.org/mozilla-central/source/browser/themes/osx/customizableui/panelUI.css#15-17 there.

It also looks to me like the ::after update icon needs adjusting (this rule: http://searchfox.org/mozilla-central/source/browser/themes/shared/customizableui/panelUI.inc.css#1373-1376 ) on both Windows and OS X.
Attachment #8909545 - Flags: review?(gijskruitbosch+bugs)
(In reply to :Gijs from comment #6)
> This doesn't look right on OS X. I think it needs to be 18px to match
> http://searchfox.org/mozilla-central/source/browser/themes/osx/
> customizableui/panelUI.css#15-17 there.

I added an override, not sure if using #appMenu-mainView > ... is overly specific?
Comment on attachment 8909545 [details]
Bug 1386726 - Fix alignment of banner item labels in the hamburger menu.

https://reviewboard.mozilla.org/r/181022/#review186690

LGTM. I think that selector is fine like this. Thanks!
Attachment #8909545 - Flags: review?(gijskruitbosch+bugs) → review+
Pushed by sfoster@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/2bd5e6f26886
Fix alignment of banner item labels in the hamburger menu. r=Gijs
https://hg.mozilla.org/mozilla-central/rev/2bd5e6f26886
Status: ASSIGNED → RESOLVED
Closed: 2 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 57
Iteration: --- → 57.3 - Sep 19
I have reproduced this bug with Nightly 57.0a1 (2017-08-02) on Windows 8.1, 64 Bit!

This bug's fix is verified on Latest Nightly 57.0a1.

Build ID : 20170920100426
User Agent : Mozilla/5.0 (Windows NT 6.3; WOW64; rv:57.0) Gecko/20100101 Firefox/57.0
QA Whiteboard: [bugday-20170920]
Status: RESOLVED → VERIFIED
I have reproduced this issue using Firefox  57.0a1 (2017.08.02) on Win 8.1 x64.
I can confirm this issue is fixed, I verified using Firefox 58.0a1 (2017.10.01) on Win 8.1 x64, Mac OS X 10.11 and Ubuntu 14.04 x64.
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.