Vertical menu configuration

How to change width?

In order to change the width of left side navigation bar, open a file src/assets/scss/_variables.scss and change the value of variable $sidebar-width. The default value is set to 250px.

How to use pre-built layouts?

Each of the layout options is provided below with steps you would need to perform in src/store/layout/reducer.js in INIT_STATE object:

image
Light Sidebar & Topbar Dark
leftSideBarTheme : leftSideBarThemeTypes.LIGHT and topbarTheme : topBarThemeTypes.DARK
image
Compact Sidebar
leftSideBarType: leftSidebarTypes.COMPACT
image
Icon Sidebar
leftSideBarType: leftSidebarTypes.ICON
image
Boxed Layout
layoutWidth: layoutWidthTypes.BOXED
image
Light color Sidebar
leftSideBarTheme : leftSideBarThemeTypes.LIGHT
image
Dark Sidebar
leftSideBarTheme: leftSideBarThemeTypes.DARK
image
Colored Sidebar
leftSideBarTheme: leftSideBarThemeTypes.COLORED
image
Scrollable
layoutWidth: layoutWidthTypes.SCROLLABLE
© Themesbrand.
Crafted with by Themesbrand