2044711 - Clean up lwtheme and lwtheme-image-y-align attributes on body and #navigator-toolbox

Status: RESOLVED FIXED

(Firefox :: Toolbars and Customization, enhancement)

Description

[Nikki Sharpley (:nikkis) (she/her)]

In bug 2027859, we introduced some complexity with adding a gradient to the toolbar in dark/light mode and transparency for overlaying background images in themes for Nova. We should clean up this portion which should land with this bug, perhaps by introducing an attribute to determine whether the image is on the toolbox or body:

/* Images go on the body by default, unless they are aligned in the y axis in
 * which case they go on the toolbox for backwards compatibility */
@media not -moz-pref("browser.nova.enabled") {
  :root:not([lwtheme-image-y-align]) body,
  :root[lwtheme-image-y-align] #navigator-toolbox {
    background-image: var(--toolbox-background-image);
    background-repeat: var(--toolbox-background-repeat);
    background-position: var(--toolbox-background-position);
    background-size: var(--toolbox-background-size);
  }
}

@media -moz-pref("browser.nova.enabled") {
  :root[lwtheme]:not([lwtheme-image-y-align]) #navigator-toolbox {
    color: inherit;
    /* stylelint-disable-next-line stylelint-plugin-mozilla/use-design-tokens */
    background-color: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
  }

  :root[lwtheme]:not([lwtheme-image-y-align]) body,
  :root:is([lwtheme-image-y-align], :not([lwtheme])) #navigator-toolbox {
    background-image: var(--toolbox-background-image);
    background-repeat: var(--toolbox-background-repeat);
    background-position: var(--toolbox-background-position);
    background-size: var(--toolbox-background-size);
  }
  ...
}

Comment 1

[Emilio Cobos Álvarez [:emilio]]

Attachment: Bug 2044711 - Centralize theme background-image location decision. r=#theme!

This makes the CSS less confusing, your call on whether it's worth it.

Comment 2

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/c42bded1da71
https://hg.mozilla.org/integration/autoland/rev/a0344ed052e3
Centralize theme background-image location decision. r=desktop-theme-reviewers,dao

Comment 3

[Norisz Fay [:noriszfay]]

https://hg.mozilla.org/mozilla-central/rev/a0344ed052e3