Scroll bar is located behind right-hand side menu

tomidire commented 7 months ago

Description

While using the mouse pad on laptop, the end-user has very limited ability to scroll up and down because the scroll bar is located behind the right-hand side menu.

Screenshots

Version

2.3.0-pre.0

What browser are you seeing the problem on? What version are you running?

Chrome v124.0

The OS you're using

win

Steps to reproduce

Open any menu item on the right-hand side. ex: backgrounds
Try to scroll up or down using the scroll bar to view content all the content
Side menu blocks end user from grabbing the scroll bar to move up or down with ease

The browser URL at the time you encountered the bug

https://rapideditor.org/canary#map=2.00/0.0/0.0&background=EsriWorldImageryClarity&datasets=fbRoads,msBuildings&disable_features=boundaries

The auto-detected useragent string for your browser (leave blank if you're manually filling this form out)

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0.0.0 Safari/537.36

bhousel commented 7 months ago

Thanks for reporting! Yes this is something that I (and others) have found frustrating since the iD days. https://github.com/openstreetmap/iD/issues/4599#issuecomment-377207313 (the problem is worse on smaller screens where the side buttons cover up everything)

I think we should reconsider the design of some of these components, maybe pulling inspiration from other popular drawing tools like tldraw or figma.

eneerhut commented 2 months ago

It sounds like this relates to #1499 and a broader effort to resize elements for different devices.

facebook / Rapid