Sidebar

  • To get the default value of sidebar type or show/hide , sidebar color go to the src/store/pinia/state.js
Sidebar Color
  • Property: "sidebar_color"
  • Choices: "sidebar-white", "sidebar-dark", "sidebar-color"

Example

sidebar_color: {
    value: 'sidebar-white'
}
Sidebar Type
  • Property: "sidebar_type"
  • Choices: "sidebar-hover", "sidebar-mini", "sidebar-soft"
  • Values are in array

Example

sidebar_type: {
    value: []
}
Sidebar Show
  • Property: "sidebar_show"
  • Choices: "sidebar-none", "sidebar"
  • Values are in array

Example

sidebar_show: {
    value: ['sidebar']
}
Sidebar Menu Style
  • Property: "sidebar_menu_style"
  • Choices: "sidebar-default navs-rounded", "sidebar-default navs-rounded-all", "sidebar-default navs-pill", "sidebar-default navs-pill-all", "left-bordered", "sidebar-default navs-full-width"
  • Values are in string

Example

sidebar_menu_style: {
    value: 'left-bordered'
}
To get the current value of the following you can use:
  • first import useSetting store from pinia
  • import the selectors files from src/store/pinia/index.js in your component
  • import this file in your component using following example code in your component
import { useSetting } from '@/store/pinia';
Then use the following code in your component to get the current value
  • accessing the state from the useSetting store
const store = useSetting();
  • creating computed properties to reactively access the store's state
Sidebar Color
const sidebarColor = computed(() => [store.sidebar_color_value])
Sidebar Type
const sidebarType = computed(() => store.sidebar_type_value)
Sidebar Show
const sidebarShow = computed(() => [store.sidebar_show_value])
Sidebar Menu Style
const sidebarMenuStyle = computed(() => [store.sidebar_menu_style_value])