Navbar

Please note

The navbar examples will not toggle on this site when the viewport is less than 1024px. This is done intentionally to prevent the navbar-items from displaying, as when the viewport is less than 1024px, the navigation bar will be fixed and positioned at the top (top-0).

For this reason, we can't display navbar-items to prevent all navbar examples from being displayed at the same position. But the snippets will work as expected when you use it. The navbar items will be displayed as a sidebar with a smooth transition.

Components Props

Navbar

PropTypeDescription
classNamestringSets custom classes

NavbarNav

PropTypeDescription
orientationstringThe orientation of the nav-items. possibles values (start, middle, end)

NavbarLink

PropTypeDescription
activebooleanSets active state of the NavBarLink
activeClassstringSets custom classes when active is true. this is useful when you want to set additional classes on an active-link