rafaelmardojai / firefox-gnome-theme

A GNOME👣 theme for Firefox🔥
The Unlicense
3.32k stars 153 forks source link

[Feature] Theme support #799

Open gaussandhisgun opened 1 month ago

gaussandhisgun commented 1 month ago

Is your feature request related to a problem? Please describe.

Firefox, as any browser with customization options, has themes. Some of them are definitely worse than others, but they are there. And Gnome Theme does not support them, to the point of even breaking should a theme be applied to Firefox. But what if it did?

Describe the solution you'd like

A few tweaks might be applied to Firefox Gnome Theme to detect if a Firefox theme is applied and change the colors accordingly. Actually, here's one way to do that: whenever any theme except for "System (Auto)" is applied, the <html> that the entire browser is encased into gets a new attribute, lwtheme="true".

Describe alternatives you've considered

I tried to do this myself, by applying this piece of CSS:

#navigator-toolbox {
  &:-moz-window-inactive {
    background-color: InactiveCaption !important;
    color: InactiveCaptionText !important;
  }
}

#navigator-toolbox {
  :root[lwtheme] & {
    &:-moz-window-inactive {
      background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color)) !important;
    }
  }
}

#navigator-toolbox {
  :root[lwtheme] & {
    background-image: var(--lwt-additional-images) !important;
    background-repeat: var(--lwt-background-tiling) !important;
    background-position: var(--lwt-background-alignment) !important;
    background-color: var(--lwt-accent-color) !important;
    color: inherit !important;
  }
}

:root[lwtheme] {
  --gnome-headerbar-background: transparent;
  --gnome-tabbar-background: transparent;
}

#nav-bar {
  background-color: var(--toolbar-bgcolor);
}

But I suck at CSS and this breaks every theme that does not have a full-headerbar background. Still, this is a point to start more than anything actually usable.

Additional context

Implementing this will close #792, #690 and probably something else that I haven't seen yet.

And this is what my proof-of-concept piece of code looks like in person: изображение (the cat theme)