Re: [w3ctag/design-reviews] CSS Scrollbars: scrollbar-color, scrollbar-width (#563)

Hi @felipeerias, I've recently joined the OpenUI initiative and my goal is to try and work a bit on how to bring a little more standardization to scroll UI.

My first two goals are the following:

1. Make it easy to get rid of any native chrome while keeping all user interactions. That way devs can easily create their own scroller chrome.
2. Make it easy to style scroller chrome as generated by the browser. I'll call this 'native chrome' for now.

The first point should be fully covered by the `scrollbar-width` property, really great and simple approach. I love it.

The 2nd point is partially handled with `scrollbar-color`, but it isn't really a very granular approach. I think that's it's strength though, because it doesn't go off into the weeds on all the various ways different browsers and OS's implement scroll UI elements.

Personally, I envision a future where OpenUI could define a small range of scroll-ui components. These could be a full scrollbar with buttons, a simple indicator, an arrow button (such as listed here: https://github.com/WICG/open-ui/issues/105), etc.

As far as I can see the current suggested styles that are part of CSS Scrollbars don't clash with this in any way, so that's great. The only thing that might be worth considering is the naming of the `scrollbar-color` property. It might be worth-while to rename it to something like `scroll-ui-color` or `scroller-color`, just so it doesn't sound like it necessarily needs to be limited to scrollbars only.

I find it hard to judge if the naming issue is important or entering into bike-shedding territory, so I'm definitely very open to feedback on that point.

The `scroll-gutter` property is completely new to me, but definitely sounds interesting. I'll have to dive into that before I'm able to give any sensible feedback about it though. I'll do my best to get back on that later today, if time allows.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3ctag/design-reviews/issues/563#issuecomment-785083917