[Suggestion] Improve anchor link support on mobile in `SubdomainNavBar`
Problem
Currently you can use an "anchor/deep" link (e.g. /#agenda) with SubdomainNavBar. But since the "hamburger menu" takes up almost the full width/height (we customized it a bit to add a gap), you can't really see that clicking the link changed anything and you have to click on the close "X" button to close the menu.
Steps to reproduce:
- Resize browser to mobile
- Go to this preview. (Internal)
- Click on the "hamburger" menu button
- Click on "Agenda" or "Pricing"
- Notice that the menu still stays open.
https://github.com/user-attachments/assets/b2e856f8-96f4-48db-8e90-34d7cf9ea5c4
Possible solution
When clicking an "anchor/deep" link, the menu on mobile should close.
Urgency
This came up in this project (internal link). We found a workaround by programmatically trigger a close() on the close "X" button.
https://github.com/user-attachments/assets/7893c57b-63c8-40f6-b699-466639d9e664
So not too urgent, but might still be nice to support "anchor/deep" links with SubdomainNavBar so we don't have to rely on the [aria-controls="menu-navigation"] selector. 🙈
Update from planning: Waiting on Site Design to confirm this is the correct solution before triaging further.
cc. @nsolerieu (Site FR)
@rezrah just check in with @jesussandreas - we approve @simurai thoughtful fix suggestion