Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Automatically close mobile menu when clicking outside #26

Open
MikaBerglund opened this issue Feb 17, 2020 · 3 comments
Open

Automatically close mobile menu when clicking outside #26

MikaBerglund opened this issue Feb 17, 2020 · 3 comments
Labels
enhancement New feature or request
Milestone

Comments

@MikaBerglund
Copy link
Contributor

By default, the Bootstrap Navbar does not close the mobile menu when clicking or tapping outside of the menu.

This should be implemented as a boolean parameter in Navbar so that developers could just turn it on. By default, the behaviour should be as the default Bootstrap Navbar works, meaning that it won't close automatically.

Since Navbar internally uses the Collapse component, the functionality should be implemented in that component, and then just reused in the Navbar component.

@MikaBerglund MikaBerglund added this to the vNext milestone Feb 17, 2020
@MikaBerglund MikaBerglund added enhancement New feature or request and removed vNext labels Feb 17, 2020
@MikaBerglund MikaBerglund modified the milestones: vNext, v1.1 Feb 27, 2020
@EvanWeeks
Copy link
Contributor

This will require attaching an event to the <body> or <app> element and bubbling that up to the Navbar component, as well as then using @onclick:stopPropagation in the Navbar to stop it from closing itself when it's clicked on.

I did it in my personal site by using a site-wide, full-height container in MainLayout.razor and attaching the event directly to that. By doing so I was able to avoid using javascript events, and kept everything inside of Blazor. But, if we're going to handle this at the library level, there's really no alternative to using javascript. Not that I can see.

@MikaBerglund
Copy link
Contributor Author

No problem in using JavaScript. That works in every browser out there, except for those very rare guys who have locked their browsers down to a point where no typical modern website can work properly.

@MikaBerglund
Copy link
Contributor Author

But remember, this is now scheduled for v1.1. I don't think we need it earlier.

@MikaBerglund MikaBerglund modified the milestones: v1.1, vNext May 9, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants