Appearance
Sidebar
Import
jsx
import Sidebar from "@components/Layout/Sidebar";Sidebar Types
Onomis dashboard comes with three types of sidebars: default, compact, and detached giving you the flexibility to customize the style, feel, and functionality of your website to suit your specific preferences.
Default (classic)
If you prefer the classic look for your sidebar navigation you can go for this type. The sidebar stays fixed on the screen, making it convenient and effortless for the user to navigate through the tool.
Compact
Onomis Dashboard provides the ability to minimize the sidebar and maximize the displayed information on the main panel.
This feature enables users to focus more easily on the data presented on the screen.
To switch between classic and compact sidebar, click on the hamburger menu icon on the top right. In compact mode, the title of sidebar items are hidden, Move your cursor to the left of the workspace to quickly expand the sidebar and make them appear.
Detached
If you appreciate a clean and structured workspace, detached is the right setting for you. This sidebar provides users with a cleaner and more organized layout, improving overall productivity and efficiency.
Settings
As you modify the default layout, the design of the sidebar adjusts accordingly. If you wish to change your sidebar type to fit your preference please visit this page
Props
For Sidebar component, the following props are available:
| Prop | Type | Default | Note |
|---|---|---|---|
| navigation | Array | - | Specifies navigation items. for more information please refer to Navigation Menu |
| className | String | - | Overrides or extends the component's styles. |
Children
The Sidebar component provides a children props that enable you to customize the content.
| Children | Description |
|---|---|
| ✔️ | Add content to the start of the sidebar. |