bloc icon indicating copy to clipboard operation
bloc copied to clipboard

fix(docs): desktop sidebar toggle overlaps menu

Open alestiago opened this issue 3 years ago • 0 comments

Description The sidebar toggle (hamburger menu) has too much width on desktop devices and overlaps with the actual menu. This causes the user to accidentally collapse the menu when wishing to navigate to a new section.

Steps To Reproduce

  1. Go to the bloclibrary.dev.
  2. Click on the last visible menu item next to the sidebar toggle "icon".
GIF showing issue

Expected Behavior I would expect the sidebar toggle to action only when the "icon" is clicked.

GIF showing expected behaviour

Additional Context Although having the width larger than the actual icon might benefit mobile users with big fingers, I think it hinders desktop users since the mouse pointer is very precise in comparison to a finger tap.

The "sidebar toggle" seems to be implemented by docsify. When visiting their website they include a gradient to avoid this behaviour.

docsify screenshot Screenshot 2022-02-01 at 11 50 42

alestiago avatar Feb 01 '22 11:02 alestiago