Open Bug 1702771 Opened 4 years ago Updated 1 year ago

Infobars - text is not vertically centered on macOS

Categories

(Firefox :: Theme, defect, P3)

All
macOS
defect

Tracking

()

Tracking Status
firefox-esr78 --- unaffected
firefox87 --- unaffected
firefox88 --- unaffected
firefox89 --- affected

People

(Reporter: sbadau, Unassigned)

References

(Depends on 1 open bug, Blocks 2 open bugs)

Details

(Whiteboard: [proton-infobars] [priority:2c] [fidefe-reusable-components])

Attachments

(1 file)

Attached image Infobar.png (deleted) —

Affected platforms:
Mac OS X 10.15
macOS Big Sur 11.1

Affected versions:
Nightly 89.0a1

Pre-requisites:
browser.proton.enabled=true
browser.proton.infobars.enabled=true
accessibility.blockautorefresh=true

Steps to reproduce:

  1. Launch Firefox.
  2. Paste the following into the URL bar: data:text/html,<meta http-equiv="refresh" content="0; url=https://example.com/">
  3. Observe the Infobar displayed under the URL bar (text string and button)

Expected Result:
The text in the Infobar should be properly centered.

Actual Results:
The Text in the Infobar is not vertically centered (it's a little too high) - both in the Infobar as well as in the "Allow" button.

Notes:
The issue is not reproducible on the latest Nightly 89.0a1 when Proton is not enabled (the preferences browser.proton.enabled and browser.proton.infobars.enabled are set to false).
The issue is reproducible on all the Info bars.
The issue is not reproducible on Windows7 nor on Ubuntu 20.04.

Priority: -- → P2
Whiteboard: [proton-infobars] → [proton-infobars] [priority:2c]
Priority: P2 → P3

I know that it's only a small cosmetic issue and nothing critical but since it's noticeable, it also affects Thunderbird where you see these kind of infobar very often and bug 1775641 was closed as duplicate of this one because it's a platform widget - could this Proton regression maybe re-triaged after this long time to get someone's attention as it's hopefully nothing too complicated [1]? Thanks!

[1] Removing the min-height: 16px; for .notification-message fixes the issue for me. But I don't know if it has any side effects.

(needinfo?ed Dão as triage owner)

Flags: needinfo?(dao+bmo)

Maybe something to consider when moving this to a lit-based widget?

Flags: needinfo?(dao+bmo) → needinfo?(mstriemer)

Here's what we have in storybook for this widget so far: https://firefoxux.github.io/firefox-desktop-components/?path=/story/ui-widgets-message-bar--basic

Mark, is there a bug for the message bar work we can dupe this to?

This could be fixed here if we want, it looks like the padding on .notification-message is knocking it out of alignment [1] (although I don't know what ramifications that might have)

I don't think we have the message-bar updates filed yet, Jules is looking at the component on the design side and we have an outreachy intern starting in a few weeks who should be able to take a look at it. Adding this to the ReComp backlog so we can link/dupe them later

[1] https://searchfox.org/mozilla-central/rev/45b20d00311bc2170dfbdae8a91bc4dca29717d8/toolkit/content/widgets/message-bar.css#209

Flags: needinfo?(mstriemer)
Whiteboard: [proton-infobars] [priority:2c] → [proton-infobars] [priority:2c] [fidefe-reusable-components]
Depends on: 1845150
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: