[ENH] Option to disable scrollbar theming (::-webkit-scrollbar css)

[grahamgower]

Would it be possible to have a config option to skip all ::-webkit-scrollbar css?

I'm using jupyter-book for my docs in multiple projects. And I love it. But recently the default sphinx-book-theme became dependent on pydata-sphinx-theme, and with this change, all of the scrollbars have been themed. I personally don't like thin scrollbars and would like to use my browser's default scrollbar (I mostly use Chromium). I use a mouse, never a trackpad. I do use the scrollwheel on my mouse, but tend to grab the scrollbar a lot anyhow, particularly for the body css element. I never read API docs on a phone or tablet, so I'm not at all concerned with wasting an extra 16 pixels or whatever. Maybe I'm in the minority here.

Unfortunately, the ::-webkit-scrollbar family of css elements seem to be impossible to override (e.g. in a _static/custom.css file) in such a way that reverts things back to the default scrollbar---one must manually recreate each part of the scollbar (I tried variants based off https://www.reddit.com/r/userstyles/comments/qjwlet/how_to_reset_scrollbar_styles/hiz7d2c/?context=8&depth=9). My browser (Chromium) provides no user-configurable way to ignore ::-webkit-scrollbar and friends, and I daresay other browsers are equally hostile to user preference.

Finally, I'll leave you with some quotes regarding the webkit-scrollbar elements...

https://developer.mozilla.org/en-US/docs/Web/CSS/::-webkit-scrollbar

Non-standard: This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

https://www.w3.org/TR/css-scrollbars-1/#out-of-scope

Exposing the scrollbar-related ::-webkit- prefixed pseudo-elements to the Web is considered a mistake by both the CSS Working Group and Webkit.

[12rambau]

Some history on this very one.

We decided to go with customized scrollbar when this theme started to support dark and light modes. As one could request a dark website in a light themed browser we wanted to ensure some compatibility. that being said and as you mentioned the theme needs to remain compatible with multiple browser and devices, reason why we prefered thin scrollbar to save the extra pixels for phones and tablets.

Lookin at your problem, I guess you are in the minority but that does not mean your problem is irrelevant.

I rappidely checked and the custom scrollbar is applied as a mixin in scss so. Few chances you can change it from your side (custom.css) appart by resetting all element using it. From our side I don't see any easy way to do it with a parameter either as the mixin is applied when the css file is build.

I also found this article: https://ericwbailey.website/published/dont-use-custom-css-scrollbars/ which is also advocating against customized scrollbars.

It seems customizing scrollbars is not a thing anymore so let me ping other active maintainers to see how we should proceed.
The question is extremely simple: should we continue to customize the scrollbars ?

@choldgraf, @drammock, @trallard

[trallard]

Linking here to another blog post from Adrian Rosellini https://adrianroselli.com/2019/01/baseline-rules-for-scrollbar-usability.html

Which points in the same direction as Eric Bailey's one - not customising the scrollbar.
Mostly due to the cost of making it accessible and weighing in users' customisation.
Both these folks are extremely knowledgeable in the accessibility space so I'd be +1 on following their advice and removing the customisation.

[drammock]

+1 for removing scrollbar customization.

[choldgraf]

+1 from me if it harms accessibility and is complex

[12rambau]

ok it looks like unanimity to me. I'll prepare a PR soon