Can I disable the blue light when a pinned tab updates?
When I receive a message in Slack or Messenger or Gmail, my pinned tab shows a cute blue dot to let me know that something happened. However, these sites' favicons already change to show the notification—and, in the case of Gmail, it's especially distracting because I don't *want* my immediately eye drawn to every single new email I get.
I'd like to be able to disable this light, or maybe have it only appear when the site doesn't change its own favicon.
Chosen solution
You can use custom style rules to modify many aspects of Firefox's interface. To do that, you'll need to create a file named userChrome.css in a folder named chrome in a particular place. It should only take a few minutes, but you will need to quit/restart Firefox at least once, so you might not want to interrupt what you're doing right now.
The dot effect is added using a background image on the pinned tab. You can shrink the dot or hide it completely. Here are custom style rules for each of those possibilities:
/* Make the "title changed" notification dot on pinned tabs tiny */
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged] {
background-position: center bottom !important;
background-size: 4px !important;
}
/* Completely hide the "title changed" notification dot on pinned tabs */
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged] {
background-image: none !important;
}
I've got the steps for creating a userChrome.css file on Windows in another thread, but I think Finder works a bit differently, so you might need to improvise a bit. cor-el also posted useful information:
https://support.mozilla.org/questions/1180489
Read this answer in context 👍 6All Replies (4)
Chosen Solution
You can use custom style rules to modify many aspects of Firefox's interface. To do that, you'll need to create a file named userChrome.css in a folder named chrome in a particular place. It should only take a few minutes, but you will need to quit/restart Firefox at least once, so you might not want to interrupt what you're doing right now.
The dot effect is added using a background image on the pinned tab. You can shrink the dot or hide it completely. Here are custom style rules for each of those possibilities:
/* Make the "title changed" notification dot on pinned tabs tiny */
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged] {
background-position: center bottom !important;
background-size: 4px !important;
}
/* Completely hide the "title changed" notification dot on pinned tabs */
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged] {
background-image: none !important;
}
I've got the steps for creating a userChrome.css file on Windows in another thread, but I think Finder works a bit differently, so you might need to improvise a bit. cor-el also posted useful information:
I should note that those examples are global. If you want to create a rule specific to a particular website, you can create a separate rule for it, and include an unchanging and relatively unique part of its title (the one that appears when you hover the tab) in the selector as illustrated here:
.tabbrowser-tab[label*="gmail.com"] > .tab-stack > .tab-content[pinned][titlechanged] {
So for example if you wanted a tiny dot on sites other than Gmail:
/* Make the "title changed" notification dot on pinned tabs tiny */
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged] {
background-position: center bottom !important;
background-size: 4px !important;
}
/* Completely hide the "title changed" notification dot on pinned Gmail tabs */
.tabbrowser-tab[label*="gmail.com"] > .tab-stack > .tab-content[pinned][titlechanged] {
background-image: none !important;
}
Yay, thank you! It looks like this selector is a bit out of date (there's some additional conditions on it now), so I added a `!important` and everything worked great :)
I didn't realize there was this much customization power in Firefox! Today I learned how to use the Browser Toolbox to inspect things myself, which opens up some really neat possibilities :) Thanks for your help!!