[ic-side-navigation] only one navigation item is viewable at 400% page zoom
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 53
- Forks
- 63
- Avg merge
- 2d 4h
- Merged PRs (30d)
- 15
Description
## Summary of the bug
When a page is zoomed to 400%, the side nav goes to top bar behaviour. When you open the menu of the top bar, only one navigation is viewable and any attempt to scroll or tab won't let you see any more navigation items.
Tabbing does tab through the items and then eventually you see the navigation item shown getting focus. But scrolling just seems to scroll the content behind the side nav and not the navigation items within.
## 🪜 How to reproduce
Tell us the steps to reproduce the problem:
1. Go to any side nav example
2. Zoom to 400%
3. Open menu
4. See the error
## 🧐 Expected behaviour
Maybe need some design input and investigation, but should the navigation items be displayed in a completely different way when it's this zoomed in? Could just show a row of icons under the top bar?
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
Start with any side nav example and reproduce the issue at 400% zoom, then inspect the side-navigation component that switches to top-bar behaviour. Verify how the opened menu handles scrolling and focus. Done means all navigation items can be viewed and reached by scrolling or tabbing without the page content scrolling instead.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100