material-components / material-components/material-web
Menu does not have space between container and viewport when overflowing
Nobody has claimed this yet.
- Dominant language
- SCSS
- Stars
- 11.3k
- Forks
- 1.1k
- Avg merge
- 20h 28m
- Merged PRs (30d)
- 13
Description
Description
Hi!
Love the new material components!
Runs nicely alongside Vue3, without the need for any complicated adapters.
I've got a slight issue with the menu though.
A menu with lots of menu-items run of page.
It suggests that the user has to scroll the viewport to view all of the available options (as seen below)
Creating an extra margin between the menu and the border of the viewport would imho help the user experience. This would indicate that the user should scroll the menu instead of the viewport.
kind regards,
Marco
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the menu overflow with enough menu items to extend beyond the viewport, using the screenshots as the expected behavior reference. Inspect the menu component's overflow and positioning entry points, then verify that the menu scrolls internally and retains visible space from the viewport edge.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- scss
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100