Hello!

I'm having a few issues—they're quite minor, but I can't seem to figure them out on my own.

1. When a download starts, the download icon displays a (fairly fast) animation; the same happens when the download finishes. Is there a way to disable these animations, or at least shorten the duration of the finish animation?

2. When the Firefox window is maximized, the margin above the tab bar (between the tab bar and the top edge of the window) is narrower than when the window is not maximized (a difference of about 2 pixels). Is there a way to make this margin consistent regardless of the window’s state? Or at least change this margin when the window is maximized?

3. When the Firefox window is not maximized, it is bordered by an outer edge. But there is a 1-pixel margin between this edge and the window itself, which did not exist in previous versions of Firefox. Is there a way to remove this outer margin?

1. Finally, this isn’t directly related to userChrome.css, but I’d appreciate it if someone had the answer: when I start a download, it begins immediately, even before I’ve had a chance to specify where to save the file. Is it possible to start the download only after clicking the "Save As…" button?

I don't know if this matters, but just in case: I'm using Firefox 151 on Arch Linux, and the userChrome.css file I'm using can be viewed here.

Thank you very much in advance for any help you can provide!

Edit: I deleted questions 2 and 3; it was an issue with my GTK+ theme, not a problem related to the Firefox theme.

Hello!

In my userChrome.css file, I use the following code to hide the search engine selection button (circled in red in my image):

#urlbar-searchmode-switcher { #urlbar:not([searchmode]) & {
    margin: 0 !important;
    padding: 0 !important;
    width: 8px;
    overflow: hidden;
    opacity: 0;
} }

But in Firefox 151, this code no longer works. Is it possible to remove this button when there is only one (or no) search engine in the submenu? For example, here there is only “Startpage,” so the button to change the search engine serves no purpose. How can I adapt the code above so that it continues to work in Firefox 151?

Also, the “This time search with” menu shown here doesn't respect my usual margins between an element and a separator; for example, in the image, the margin between the "Startpage" search engine name and the separators above and below it should be smaller. How can I modify these elements?

Thank you very much in advance for your help!

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!

Hello!

I'd like to add a border to the Picture-in-Picture window; so I've added the following code to my userChrome.css file:

html[windowtype="Toolkit:PictureInPicture"] { border: 2px solid red !important; }

But the border doesn't appear at the bottom; only on the left/top/right sides. How could I fix this?

If I set the border to more than 2px, then I can see it; but if I hover over the PiP window, the shadow of the control buttons cover the borders; is there also a way to change that shadow (without removing it) so that it doesn't cover the borders?

Thank you very much for any help!