Simple and fast multi-level sidebar menu built on Bootstrap 5.
npm install sidebar-menu-compostrap
Simple and fast multi-level sidebar menu built on Bootstrap 5. So you should be aware of how Bootstrap itself is used. The advantage is also knowledge of sass, npm.
The sidebar menu is built on the sidebar skeleton. I recommend you look at it.
See the menu in the template.
| Description | Class |
|---|---|
| Marks the active item | link-current |
| Icon animation | bell |
| Marks the drop-down menu icon | link-arrow |
| Marks the hidden drop-down menu | list-hidden |
The sidebar natively supports Light and Dark themes. You can easily switch between them by using the data-sidebar-theme attribute on the sidebar element.
| Theme | Attribute |
|---|---|
| Light | data-sidebar-theme="light" |
| Dark | data-sidebar-theme="dark" |
If you need to further customize the visual appearance (e.g., custom background colors for menu items, specific icon colors, or unique border radius), we recommend using the sidebar-menu-custom package.
The custom package is designed for easy modification of:
- Backgrounds: Subtle tints for first-level menu items.
- Icons: Custom coloring for active or hovered states.
- Layout: Precise alignment of menu elements (like rotating arrows).
- Variables: Global CSS variables for consistent styling (e.g.,
--sm-modern-border-radius).