[meta] Gray text is too light in doorhangers (fails contrast check)

NEW
Unassigned

Status

()

defect
P2
normal
5 months ago
2 months ago

People

(Reporter: shorlander, Unassigned, NeedInfo)

Tracking

({meta, regression})

Trunk
All
macOS
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox64 unaffected, firefox65- fix-optional)

Details

Attachments

(1 attachment)

On Nightly gray text in doorhangers is too light and fails a contrast check (https://contrast-ratio.com/#%23d8d8d8-on-%23ffffff)

You can see this in the Control Center, Library "Recent Highlights" header, or the Application Menu with Keyboard shortcut text.

Dão, can you point this to the regressing bug? Thanks!

Flags: needinfo?(dao+bmo)

graytext is supposed to be used for disabled UI elements, where the lower contrast might be acceptable. The way we use graytext in the Control Center (and other menus) isn't quite in line with that. Given that graytext was wrongly rendered as black on macOS 10.14 until recently and from what I know nobody complained about that text in the Control Center being black, can we scale back on the use of graytext?

Blocks: 1511878
Flags: needinfo?(dao+bmo) → needinfo?(shorlander)
Priority: -- → P2

(In reply to Dão Gottwald [::dao] from comment #2)

graytext is supposed to be used for disabled UI elements, where the lower contrast might be acceptable. The way we use graytext in the Control Center (and other menus) isn't quite in line with that. Given that graytext was wrongly rendered as black on macOS 10.14 until recently and from what I know nobody complained about that text in the Control Center being black, can we scale back on the use of graytext?

I agree that the Control Center text and the keyboard shortcut text should be black (or primary color in the case of dark themes).

There are cases where we are using slightly de-emphasized text to convey status or details. For example: the download status, or content blocking status (Standard, Blocking Tracking Cookies, etc.)

The download status seems to not be affect by this issue. I think it's using opacity and not the graytext keyword?

Flags: needinfo?(shorlander)

(In reply to Stephen Horlander [:shorlander] from comment #3)

The download status seems to not be affect by this issue. I think it's using opacity and not the graytext keyword?

Yes: https://searchfox.org/mozilla-central/rev/bee8cf15c901b9f4b0c074c9977da4bbebc506e3/browser/themes/shared/downloads/downloads.inc.css#136

Note that this is somewhat suboptimal in high-contrast settings.

Depends on: 1521231
Depends on: 1521233
Depends on: 1517480

Given that this is a late-breaking theme discovery and we're days from release, I don't see this being fixed for 65.

No need to track this since it's not on anybody's radar to fix. Leaving it set to fix-optional as a possible dot release ride-along if the fix ends up being simple.

Depends on: 1523392
Summary: Gray text is too light in doorhangers (fails contrast check) → [meta] Gray text is too light in doorhangers (fails contrast check)
Depends on: 1524839
No longer depends on: 1524839

Stephen, now that the bugs blocking this one are fixed, are you happy with the current state? There's still some GrayText used in the identity popup for text that isn't strictly disabled. I think the problem there is that we don't have good ideas how else to de-emphasize that text.

Flags: needinfo?(shorlander)

(In reply to Dão Gottwald [::dao] from comment #7)

Stephen, now that the bugs blocking this one are fixed, are you happy with the current state? There's still some GrayText used in the identity popup for text that isn't strictly disabled. I think the problem there is that we don't have good ideas how else to de-emphasize that text.

The section header text, and panel keyboard shortcuts look good. Thank you!

The keyboard shortcuts in the Bookmarks menu are still grey.

I've asked Bryan to look at the Control Center.

Flags: needinfo?(shorlander) → needinfo?(bbell)
Depends on: 1533286

(In reply to Stephen Horlander [:shorlander] (If you're waiting on a response please ping me on Slack or IRC) from comment #8)

The section header text, and panel keyboard shortcuts look good. Thank you!

By section header you mean "Recent Highlights" and friends? They're still using graytext, afaik...

Flags: needinfo?(shorlander)
Depends on: 1533290
No longer depends on: 1533286

(In reply to Dão Gottwald [::dao] from comment #9)

(In reply to Stephen Horlander [:shorlander] (If you're waiting on a response please ping me on Slack or IRC) from comment #8)

The section header text, and panel keyboard shortcuts look good. Thank you!

By section header you mean "Recent Highlights" and friends? They're still using graytext, afaik...

Yes… weird, they look better than last time I checked.

Flags: needinfo?(shorlander)
See Also: → 1544998
You need to log in before you can comment on or make changes to this bug.