Hello!

I use Firefox on Arch Linux, with Openbox as my window manager. I’ve been experiencing several issues since the release of Firefox 143.0.3, which I didn’t have with the previous minor version 143.0.2. However, I haven’t made any changes to my Firefox theme for several months; nor have I modified my GTK-4 theme.

First of all, in my custom CSS file (userChrome.css), I defined a section for light themes and a section for dark themes, like this:

@media (prefers-color-scheme: light) {
    ... (some CSS tags are here)...
}
@media (prefers-color-scheme: dark) {
    ... (some CSS tags are here)...
}

My full CSS is available here.

But now, only the light theme is applied. My Firefox theme is the “Systeme theme - auto”; I haven’t changed it. I can force the display of dark theme CSS tags by changing the theme in the Firefox settings and selecting the Dark theme, but why has this changed? My GTK-4 theme is still a dark theme, so why does the default theme only apply light theme tags?

On the other hand, the code in my userChrome.css file that relates to the address bar no longer works. This code is as follows:

#urlbar[breakout][breakout-extend] {
    margin-left: 0 !important;
    width: var(--urlbar-width) !important;
    margin-top: calc((var(--urlbar-container-height) - var(--urlbar-height)) / 2) !important;
}
.urlbarView-row { padding: 2px 1px !important; }
#urlbar-background { animation: none !important; }
.urlbar-input-container {
    padding: 1px !important;
    height: var(--urlbar-height) !important;
}
#identity-icon { margin-block: var(--urlbar-icon-padding); }
.urlbarView > .search-one-offs:not([hidden]) { padding-block: 0 !important; }
#urlbar-background, #searchbar, .findbar-textbox { box-shadow: none !important; }
.urlbar-input::placeholder, .searchbar-textbox::placeholder, .findbar-textbox::placeholder { color: color-mix(in srgb, currentColor 70%, transparent) !important; }
#urlbar[open] > #urlbar-background { border-color: Highlight !important; }
#urlbar-results {
    max-height: 239px;
    overflow-y: auto;
    scrollbar-color: color-mix(in srgb, currentColor 26%, transparent) transparent;
    scrollbar-width: thin;
    padding: 0 !important;
    margin: 4px 0 5px 0;
}
.urlbarView-row-inner { padding-block: 1px !important; }
.urlbarView-no-wrap { position: relative; }
#urlbar[searchmode] > .urlbarView { display: none !important; }
.urlbarView-row-inner { flex-wrap: wrap !important; }
.urlbarView-no-wrap {
    max-width: 100% !important;
    flex-basis: 100%;
}
.urlbarView-row[has-url]:not([type="switchtab"]) .urlbarView-title-separator { display: none; }
.urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-url:-moz-locale-dir(ltr) { margin-left: var(--urlbarView-second-line-indent); }
.urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-url:-moz-locale-dir(rtl) { margin-right: var(--urlbarView-second-line-indent); }

How can I fix it?

Many thanks in advance for your help!

  • MrOtherGuy@lemmy.worldM
    link
    fedilink
    arrow-up
    1
    ·
    4 months ago

    Sorry, but I don’t quite understand what you mean. You don’t know what kind of changes are going to happen in the future - and neither do I, so we can’t future-proof any rules too much. The selector :where(#urlbar) > only means that the selector coming after it must also match the element that is a child of urlbar even if the selector would also match something else in the document. I suppose it would be somewhat relevant currrently, since similar class names are also used in the searchbar popup now or soon (depending on what Firefox version you are using) and you might only want to affect things inside urlbar but not inside searchbar.

    • PleaseBeKindPlease@lemmy.worldOP
      link
      fedilink
      arrow-up
      1
      ·
      4 months ago

      Indeed, my message wasn’t very clear. While trying to keep my userChrome.css file up to date, I found this first commit and this second commit in your repository; I deduced that certain elements needed to be updated… but I was wondering which ones. I thought this was due to upcoming changes in Firefox, but I was probably mistaken…

      • MrOtherGuy@lemmy.worldM
        link
        fedilink
        arrow-up
        1
        ·
        4 months ago

        Sorry, I couldn’t reply earlier. Yeah, so indeed searchbar is getting an update where it would use same kind of structure that urlbar is using - not sure in what version it will land in release Firefox though. The point of those extra :where(#urlbar) selectors in those commits is that some of the rules in the affected sites should only apply to things which are inside urlbar.

        If you don’t have a separate searchbar enabled then you don’t necessarily do anything. Also, if you do use separate searchbar you might actually want to apply some of the rules also to it as well to have it styled consistently to urlbar. It all depends on what you want do achieve, really.