Scroll bar color should follow either OS or Firefox theme rather than page element background
Categories
(Core :: Widget, enhancement)
Tracking
()
People
(Reporter: billdillensrevenge, Unassigned)
References
Details
Attachments
(1 file)
|
3.26 MB,
image/png
|
Details |
scrollbartheme.png
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:73.0) Gecko/20100101 Firefox/73.0
Steps to reproduce:
I have both Windows 10 and Firefox set to "Light" mode/theme, but the scrollbars aren't Light on some websites (such as https://www.theverge.com ). Scrollbars should respect the theme/mode the user has chosen.
Expected results:
please see attached screenshot
|
||
Updated•5 years ago
|
|
||
Comment 1•5 years ago
|
||
This is expected and intended. Scrollbars are generally considered part of the content, not the chrome (browser UI).
I would say this bug is invalid, unless Firefox's product team doesn't agree with that, in which case they could simply revert the changes in bug 1578377.
I filed this in case Firefox devs weren't aware of this scenario (scrollbars being dark on some websites even though Firefox and Windows are in Light mode/theme), they can factor this type of scenario in their decision making. It really does look/feel wrong and weird. Can you please re-open so all the relevant team members can see this and then make a decision?
|
|
||
Comment 3•5 years ago
|
||
Sure.
This IS a bug in my "duplicate" case (https://bugzilla.mozilla.org/show_bug.cgi?id=1612889) speaking as a web content developer and website maintainer.
This is a defect. My site doesn't consider the <body> scrollbar part of the webpage and it has a fixed background that uses JavaScript to put up iframe overlays which use the main site's background but need to be scrolled independently, in which case FF is manically changing the scrollbar's color... and anyway, it looks like bad design. So saying its part of my website (not chrome) means the website should be in control of its appearance...
Presently the only chaotic lever I have is to make a dummy background to workaround this ill-conceived design. This needs to shake out ASAP.
|
||
Comment 6•5 years ago
|
||
Since we seem to be able to render a dark as well as a light native-looking scrollbar on any site, I think being able to choose which of the two to use (in addition to being able to choose a custom one) makes sense.
Mick: Once that’s possible, you can just use prefers-color-scheme to make the scrollbar match the browser color:
@media(prefers-color-scheme: dark ) { body { scrollbar-color: dark } }
@media(prefers-color-scheme: light) { body { scrollbar-color: light } }
Flying sheep: Thank you for getting me closer to a solution (once implemented) but since all of this is Mozilla extensions why not add to dark/light a "chrome" value that is I guess equivalent to "no-preference" but expressly says to use whatever is the OS default look or the browser's UI package's look, since "light" and "dark" don't really apply if a window-manager is using gray or green or whatever for example. A neutral option is needed to not force a choice. I mean, unless a site has a CSS system that reflects a light and dark mode then they don't care and neither fits them.
Is there a consensus on this feature/behaviour? Chrome and the new Chromium-based Edge do not do this (and I can't find anything about Chromium intending to support this feature/behaviour, but if you can please post the link here). And how about Safari for macOS? I don't have access to a Mac to check what Safari does
|
||
Comment 9•5 years ago
|
||
since all of this is Mozilla extensions
scrollbar-color and the light and dark keyword values are a draft CSS spec:
https://drafts.csswg.org/css-scrollbars-1/#scrollbar-color
|
||
Comment 10•5 years ago
|
||
"scrollbar-color and the light and dark keyword values are a draft CSS spec"
Meaning before/if publishing (there's time to) add some sanity to it by providing an option that matches the historical scenario of using the applications default scrollbar.
The problem with Mozilla's implementation (like I've said) is the spec has a "no-preference" option that leaves the CSS developer no mechanism but to choose a light or dark themed scrollbar for their user.
They should have introspection to choose a scrollbar that matches the legacy case, the intelligent case of matching the browser's theme, which ideally should match/inherit the OS's theme.
(I could write some expletives about how programmers--my own profession--are on whole more long term mistake prone than your average person, for which this is but one example... the fact this is even a discussion... but I will settle for this no-comment parenthetical... echoing the case of this bug--not enhancement. If it's not a bug in Firefox it's a bug in Mozilla.)
|
||
Comment 11•5 years ago
|
||
I would like to have an option to force a black scrollbar which follows the firefox-theme. Just as we have an option to disable it.
|
||
Updated•2 years ago
|
Description
•