Configurable breakpoint to switch between wide and narrow.
Menus specified by array of menu items passed as an attribute to MainMenu component.
Easy formatting of menu CSS with settings object passed as an attribute to MainMenu and Hamburger components.
Flexible formatting of menu CSS with access to scoped classes within menu HTML.
Menu Item can also run JavaScript or TypeScript code (instead of navigating).
Separate MainMenu and Hamburger components to provide flexibility in setting up navigation UI.
Demo
This website uses Astro Main Menu. If you are viewing this in a desktop browser, you can get an indication of how Main Menu works in mobile by either making the browser window narrow, or by using its Dev tools to simulate a mobile device (if available).