Closed Bug 1694428 Opened 2 months ago Closed 1 month ago

button for unsigned extensions in add-on manager is difficult to read on :hover

Categories

(Toolkit :: Add-ons Manager, defect, P2)

defect

Tracking

()

RESOLVED FIXED
88 Branch
Tracking Status
firefox88 --- fixed

People

(Reporter: soeren.hentzschel, Assigned: mstriemer)

Details

Attachments

(3 files)

Attached image screenshot

If you have an unsigned add-on installed in Firefox the button for more information is difficult to read on :hover. While it's not a new issue (was already present before the latest Proton changes) it would be great if you could adjust the colors while you're at it because black on dark brown is obviously not a perfect choice of colors.

Hey Mark, can you check out if this is by design, or if we need to track this for proton?

Flags: needinfo?(mstriemer)
Attached image warning-message-bar.gif

Looking at the photon style guide [1] this is using the expected colours, but I agree it seems hard to see. That being said, looking at the yellow colours specifically [2] it suggests using white text for the hover and active colours. Reversing the font colour does indeed make this quite a bit more readable in the hover state, but reversing the font colour on hover doesn't seem amazing to me.

The in-content pages aren't in scope for proton, but this does seem like something we should standardize onto the "infobars" styling in the future.

This button also opens a SUMO page, which makes me think it would actually be more fitting to be a "Learn more" link.

I think the quick interim fix here would be to make the font colour white for :hover, :hover:active for these button [3].

[1] https://design.firefox.com/photon/components/message-bars.html
[2] https://design.firefox.com/photon/visuals/color.html#yellow
[3] https://searchfox.org/mozilla-central/rev/3f97afc8db535f9b0232222cb48cc4cbf8334c76/toolkit/mozapps/extensions/content/message-bar.css#27

Flags: needinfo?(mstriemer)
Severity: -- → S3
Priority: -- → P2
Assignee: nobody → mstriemer
Status: NEW → ASSIGNED

but reversing the font colour on hover doesn't seem amazing to me.

Mark, what should we do here? Is this an oversight in the photon design that needs clarification?

Pushed by mstriemer@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/ba5f9b87c441
Make warning button hover text more legible in about:addons r=extension-reviewers,kmag
Status: ASSIGNED → RESOLVED
Closed: 1 month ago
Resolution: --- → FIXED
Target Milestone: --- → 88 Branch
You need to log in before you can comment on or make changes to this bug.