Smooth scrolling browsers (Firefox) use the relative area to determine how much scroll to apply. Because breadcrumbs are short vertically, the scroll amount is minimal (3 units) in the Y direction. On browsers which don't smooth scroll the units are usually much higher (100 in Chrome on Win 10). Users seem to expect the scrolling to be quicker due to the horizontal space on breadcrumbs, so we add a bit more power to their scroll when it looks small.
Fixes https://github.com/vector-im/riot-web/issues/9394
Fixes https://github.com/vector-im/riot-web/issues/8714
Fixes https://github.com/vector-im/riot-web/issues/8890
Fixes https://github.com/vector-im/riot-web/issues/9034
Fixes https://github.com/vector-im/riot-web/issues/8954
This turned out to be much more complicated than it needed to be. We use an IndicatorScrollbar to do all the math for us and some minor changes have been made so it can flag left/right overflow. The complicated part is the css changes which make the gradients work: unlike the RoomSubList, we have to calculate the offset of the indicators (gradients) on our own because position:sticky doesn't work horizontally.
The changes to the css (well, mostly pointer-events:none) make it so the gradient doesn't interfere with the room avatars.
9034 and 8954 are fixed by this because they represent an overflow-x:none style breakage where browsers won't let you scroll without a scrollbar. The gradient offset problem is also demonstrated in 8954.
the overflow/underflow events are not always reliable in nooverlay
browsers (FF), so forward the checkOverflow call we need anyway
for the scroll indicator gradients to see if we need to do the
margin trick for the on-hover scrollbar we use in nooverlay browsers.
this fixes on hover jumping in a subroomlist