Spyke
FirefoxCSS·Firefox CustomsbyPleaseBeKindPlease

[SOLVED] Remove the download animation

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.

View original on lemmy.world
lemmy.world

Like this maybe? Setting short duration should be safe so that if there is logic that waits for animation to end then this (probably) won't break it:

:is(#downloads-indicator-start-box, #downloads-indicator-finish-box) > .toolbarbutton-animatable-image{
  animation-duration: 1ms !important;
} 
1
lemmy.world

Thank you very much! It seems to be working perfectly.

If I may ask, I'd have two more requests:

  1. In the Library, is it possible to reduce the space between the toolbar (#placesToolbar) and the search fields ("Search History", "Search Downloads", or "Search Bookmarks")? Actually, since I wanted to add a margin to the left of #placesToolbar (#placesToolbar { margin-left: 16px; }), the width of the search fields becomes very narrow when the Library window isn’t maximized...

  2. I removed the border from most tooltips to match those in my GTK+ theme: tooltip { border: 0 !important; }. However, the Library’s tooltips still have a border. Is it possible to remove it?

Thanks again for your help!

1
MrOtherGuyreply
lemmy.world

In the Library, is it possible to reduce the space between the toolbar

I think what you want to do for the Library toolbar is to make the search input box flex more that the spacer space:

#searchFilter{ flex: 1000 !important }

However, the Library’s tooltips still have a border. Is it possible to remove it?

You can, but not by using userChrome.css. Tooltips in Linbrary window, as well as some within main browser window are using native anonymous content which userChrome.css doesn't apply to. You need to have some way to load a style sheet as user agent sheet - which is only really possible by building Firefox yourself or injecting the style using autoconfig feature.

1
lemmy.world

I think what you want to do for the Library toolbar is to make the search input box flex more that the spacer space:

#searchFilter{ flex: 1000 !important }

I don't quite understand. The CSS for the Library seems more complex (to a novice like me) than that of other parts of Firefox. Is the "flex" property a multiplier? Adding "flex: 1.4" is enough to get what I want... so why should I choose a large number like 1000?

which is only really possible by building Firefox yourself or injecting the style using autoconfig feature.

I've used an autoconfig before... but in this particular case, it's really not worth the trouble for such a small thing. Still, thank you very much for your explanations, which always help me understand a little better how all this works.

1
MrOtherGuyreply
lemmy.world

The flex value is a "factor" in a sense that it governs how much the available space is distributed for each element in a container. In the library toolbar there is normally only one item with flex - the spacer. In that case it doesn't matter how large its flex factor is, because every non-zero number is "all there is". If the filter input-box gets flex of 1 then the available space gets distributed evenly for the input-box and the spacer because now they both have flex factor of 1. But if the input-box has flex factor of 1000, then 1000/1001 of the space is distributed for input-box and only 1/1001 for the spacer, effectively making it so that the spacer shouldn't appear to grow at all - not until the input-box reaches its maximum width if it has any.

1

That's a very clear and detailed explanation. I had skimmed through a few pages about the flex property, but I didn't really understand much of it. Thank you for taking the time to explain all this to me! It makes a lot more sense to me now.

1

You reached the end

[SOLVED] Remove the download animation | Spyke