LB-1808: Fix scrollbar glitch #3329
Conversation
There was a problem hiding this comment.
I'm not sure I love the wholesale removal of the scrollbar.
On chrome-based browsers the scrollbar container does not seem overlap the content:
Firefox does not at first, but when hovering it the height of the scrollbar extends:
Hovering:
So I think it might be a question of refining the styles of the scrollbar so that it works a bit better cross-browser. A starting point would be to replicate the issue from the ticket by trying on the same browser the user has.
It might be worth reviewing the scrollbar style we have in frontend/css/sass/scroll-container.scss to see if it improves the situation at all, but I don't have a lot of hope for that.
Another possibility would be to add arrows to the right and left for scrolling, like we do in a couple of places, which uses some javascript to automatically show or hide the arrows (see HorizontalScrollContainer component).
| flexWrap: "nowrap", | ||
| overflowX: "auto", | ||
| paddingRight: "3.5em", | ||
| scrollbarWidth: "none", |
There was a problem hiding this comment.
I think the addition of scrollbarWidth: "thin" is all we would need to resolve the issue for Firefox (reverting the webkit-specific styles)
LB-1808