"Learn more" links in arrow panels have very low contrast on dark themes

VERIFIED FIXED in Firefox 61

Status

()

defect
P2
normal
VERIFIED FIXED
Last year
Last year

People

(Reporter: ntim, Assigned: harry)

Tracking

({regression})

unspecified
Firefox 62
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(firefox-esr52 unaffected, firefox-esr60 unaffected, firefox59 unaffected, firefox60 unaffected, firefox61 verified, firefox62 verified)

Details

(Whiteboard: regression)

Attachments

(2 attachments, 1 obsolete attachment)

Reporter

Description

Last year
No description provided.
Reporter

Updated

Last year
Blocks: 1408121
Priority: -- → P2
Is this a result of the work the students?
Flags: needinfo?(mscster)
Yes, I suspect so - Connor (MSU student) worked on bug 1408121, which I believe causes this behaviour.
Flags: needinfo?(mscster)
See Also: → 1451827
Comment hidden (mozreview-request)
Assignee

Comment 4

Last year
Pushed small fix that improves Learn More... and other UI text links on dark theme. I'll address related Bug 1451827 when addressing Bug 1453722.
Reporter

Comment 5

Last year
mozreview-review
Comment on attachment 8976704 [details]
Bug 1455950 - Increased contrast on dark theme UI text links.

https://reviewboard.mozilla.org/r/244802/#review251576

::: browser/themes/shared/compacttheme.inc.css:35
(Diff revision 1)
> +:root:-moz-lwtheme-brighttext .text-link {
> +  color: #45a1ff;
> +}

Other dark themes are also affected. This shouldn't be specific to compacttheme.css
Duplicate of this bug: 1461502
Comment hidden (mozreview-request)

Comment 8

Last year
mozreview-review
Comment on attachment 8979687 [details]
Bug 1455950 - Increased contrast on dark theme UI text links.

https://reviewboard.mozilla.org/r/245830/#review252056

::: browser/themes/shared/customizableui/panelUI.inc.css:753
(Diff revision 1)
>    background-color: rgba(48,230,11,.2);
>  }
>  
> +:root[lwt-popup-brighttext] .text-link {
> +  color: #45a1ff;
> +}

Please fold both patches into one, and move this to browser.inc.css rather than panelUI.inc.css.

Comment 9

Last year
mozreview-review
Comment on attachment 8976704 [details]
Bug 1455950 - Increased contrast on dark theme UI text links.

https://reviewboard.mozilla.org/r/244802/#review252060
Attachment #8976704 - Flags: review?(dao+bmo)
Comment hidden (mozreview-request)
Assignee

Updated

Last year
Attachment #8979687 - Attachment is obsolete: true
Attachment #8979687 - Flags: review?(ntim.bugs)

Comment 11

Last year
mozreview-review
Comment on attachment 8976704 [details]
Bug 1455950 - Increased contrast on dark theme UI text links.

https://reviewboard.mozilla.org/r/244802/#review252244

::: browser/themes/shared/browser.inc.css:26
(Diff revision 2)
>  :root[sessionrestored]:-moz-lwtheme {
>    transition: @themeTransition@;
>  }
>  
> +/* Increase contrast of UI links on dark themes */
> +:root[lwt-popup-brighttext] .text-link {

This is a bit fragile as it assumes that all text-links are inside popups, or that UI surfaces outside of popups use a similar background. Let's instead use this selector for now:

:root[lwt-popup-brighttext] panel .text-link
Attachment #8976704 - Flags: review?(dao+bmo) → review+
Comment hidden (mozreview-request)
Assignee: nobody → htwyford
Assignee

Updated

Last year
Keywords: checkin-needed

Comment 13

Last year
Pushed by dgottwald@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/8579efe6135a
Increased contrast on dark theme UI text links. r=dao
Keywords: checkin-needed
https://hg.mozilla.org/mozilla-central/rev/8579efe6135a
Status: NEW → RESOLVED
Closed: Last year
Resolution: --- → FIXED
Target Milestone: --- → Firefox 62
Please request Beta approval on this patch when you get a chance.
Flags: needinfo?(htwyford)
Assignee

Comment 16

Last year
Comment on attachment 8976704 [details]
Bug 1455950 - Increased contrast on dark theme UI text links.

This is a small CSS fix to improve the contrast of UI text links on dark theme. 

[Feature/Bug causing the regression]: 
https://bugzilla.mozilla.org/show_bug.cgi?id=1408121

[User impact if declined]:
Users may be unable to make out some UI links on the new dark theme. This should be in the Beta stream since dark theme is currently in Beta, and this should be a part of the initial release launch of dark theme.

[Is this code covered by automated tests?]:
N/A

[Has the fix been verified in Nightly?]:
Yes

[Needs manual test from QE? If yes, steps to reproduce]:
No, although if you want to reproduce it, you can visit a site that requires DRM (open.spotify.com) and click the DRM icon to the left of the address bar to see the "Learn More..." link.

[List of other uplifts needed for the feature/fix]:
N/A

[Is the change risky?]:
No.

[Why is the change risky/not risky?]:
It's a small CSS fix and does not impact performance. There are also relatively few text UI links affected by this bug, in the event that there is some unforeseen side effect.

[String changes made/needed]:
Flags: needinfo?(htwyford)
Attachment #8976704 - Flags: approval-mozilla-beta?
Comment on attachment 8976704 [details]
Bug 1455950 - Increased contrast on dark theme UI text links.

Trivial fix to improve dark theme support. Approved for 61.0b9.
Attachment #8976704 - Flags: approval-mozilla-beta? → approval-mozilla-beta+
Blocks: 1451827
See Also: 1451827
Blocks: 1459480
I managed to reproduce the issue using an older version of Nightly (2018-04-22) on Windows 10 x64.
I retested everything on latest Nightly 62.0a1 and beta 61.0b9 using Windows 10 x64, macOS 10.13 and Ubuntu 16.04 x64, but the bug is not reproducing anymore. The text can be seen clearly.
Status: RESOLVED → VERIFIED
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.