Closed Bug 1591063 Opened 5 years ago Closed 4 years ago

[Dark Theme] The colors from the "See All" button on the Celebration Toast banner creates a big contrast with the background of the banner

Categories

(Firefox :: Protections UI, enhancement, P3)

enhancement

Tracking

()

VERIFIED FIXED
Firefox 72
Tracking Status
firefox71 --- wontfix
firefox72 --- verified

People

(Reporter: obotisan, Assigned: ewright)

References

Details

Attachments

(2 files)

Attached image contrast.png

Affected versions

  • Firefox 72.0a1
  • Firefox 71.0b3

Affected platforms

  • Windows 10x64
  • Ubuntu 18.04 x64
  • macOS 10.13

Prerequisites

  • Set "browser.newtabpage.activity-stream.asrouter.devtoolsEnabled" pref to "true"
  • Set "browser.contentblocking.cfr-milestone.milestone-achieved" to "1000"
  • Set "browser.newtabpage.activity-stream.asrouter.providers.cfr" to {"id":"cfr","enabled":true,"type":"local","localProvider":"CFRMessageProvider","frequency":{"custom":[{"period":"daily","cap":10}]},"categories":["cfrAddons","cfrFeatures"],"updateCycleInMs":3600000}
  • Restart Firefox.

Steps to reproduce

  1. Change the browser theme to Dark Theme.
  2. Open Firefox and go to "about:newtab#devtools" page.
  3. Scroll down and click on the “show” button from the “MILESTONE_MESSAGE” section in order to force the popup to appear.

Expected result

  • The "See All" button is subtly incorporated in the background of the panel (like with the Light and Default Themes, it creates an ombre effect with the background).

Actual result

  • The button keeps the colors from the Light Theme and creates a strong contrast with the background from the banner.

Regression range

  • This is not a regression.

Additional notes

  • Please look at the attached jpg.

epang, do you have thoughts on this?

Flags: needinfo?(epang)

ewright, can we update to #D8D8D8 @20% opacity?
This should fix the ombre effect that's occuring.

Flags: needinfo?(epang) → needinfo?(ewright)
Assignee: nobody → ewright
Status: NEW → ASSIGNED
Flags: needinfo?(ewright)
Priority: -- → P3
Pushed by ewright@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/ce84bd67150d
Celebration milestone banner colors on dark theme match light themes. r=johannh
Status: ASSIGNED → RESOLVED
Closed: 4 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 72

I verified the fix on latest Nightly 72.0a1 on Windows 10 x64 and I can still see the strong contrast.

Flags: needinfo?(ewright)

Thank you, it seems the old styling is still applying, I've asked some folks about it, will get back to you.

Flags: needinfo?(ewright)

Oana, I tested this with a fresh profile and saw the correct styles, it seems that the CSS is caching on an old profile. Could you look at this again?

Flags: needinfo?(oana.botisan)

I verified it again with a clean profile on Windows 10 x64 using Firefox 71.0b7, but the issue is still reproducing. I can still see a strong contrast.

Flags: needinfo?(oana.botisan)
Flags: qe-verify+

I have reproduced this issue using Firefox 72.0a1 (2019.10.24) on Windows 8.1 x64.
I can confirm this issue is fixed, I verified using Firefox 72.0 on Ubuntu 18.04 x64, Windows 8.1 x64 and macOS X 10.15.1.

Status: RESOLVED → VERIFIED
Flags: qe-verify+
You need to log in before you can comment on or make changes to this bug.