Sidebar
Use the sidebar component to show a list of menu items and multi-level menu items to navigate on your website
Default sidebar
html
typescript
<flowbite-sidebar [isOpen]="true">
<flowbite-sidebar-menu>
<flowbite-sidebar-item>Dashboard</flowbite-sidebar-item>
<flowbite-sidebar-item>Kanban</flowbite-sidebar-item>
<flowbite-sidebar-item>Inbox</flowbite-sidebar-item>
<flowbite-sidebar-item>Users</flowbite-sidebar-item>
<flowbite-sidebar-item>Products</flowbite-sidebar-item>
</flowbite-sidebar-menu>
<flowbite-sidebar-page-content>Hello world !</flowbite-sidebar-page-content>
</flowbite-sidebar>
Multi-level menu
E-commerce
html
typescript
<flowbite-sidebar [isOpen]="true">
<flowbite-sidebar-menu>
<flowbite-sidebar-item>Dashboard</flowbite-sidebar-item>
<flowbite-sidebar-item-group title="E-commerce">
<flowbite-sidebar-item>Products</flowbite-sidebar-item>
<flowbite-sidebar-item>Billing</flowbite-sidebar-item>
<flowbite-sidebar-item>Invoice</flowbite-sidebar-item>
</flowbite-sidebar-item-group>
<flowbite-sidebar-item>Kanban</flowbite-sidebar-item>
<flowbite-sidebar-item>Inbox</flowbite-sidebar-item>
<flowbite-sidebar-item>Users</flowbite-sidebar-item>
<flowbite-sidebar-item>Products</flowbite-sidebar-item>
</flowbite-sidebar-menu>
<flowbite-sidebar-page-content>Hello world !</flowbite-sidebar-page-content>
</flowbite-sidebar>