We have provided multiple colors sidebar options and which seems very easy to have it. You need to change the below attribute from the yiii2\views\domiex\partials\body.php
.
data-sidebar="default"
data-sidebar="dark"
data-sidebar="brand"
data-sidebar="purple"
data-sidebar="sky"
To display sidebar content in dark mode, you can use the data-sidebar-colors="dark"
attribute. You can also create your own sidebar colors by clone brand or dark or any other object from the below code and provide custom name and use the same name in the attribute i.e. data-sidebar-colors="red"
.
plugins/theme-colors/sidebarColors.js
const colors = require('tailwindcss/colors'); module.exports = { brand: { sidebar: '#477eef', menuTitle: '#b1c1fd', text: '#bdcbff', textHover: '#ffffff', textActive: '#ffffff', sidebarBgActive: '228, 245, 251' }, dark: { sidebar: colors.slate[800], menuTitle: colors.slate[400], text: colors.slate[400], textHover: colors.slate[50], textActive: colors.slate[50], sidebarBgActive: '224, 242, 254' }, purple: { sidebar: colors.purple[950], menuTitle: '#b98fd7', text: '#b98fd7', textHover: '#dfd3eb', textActive: '#dfd3eb', sidebarBgActive: '216, 180, 254' }, sky: { sidebar: colors.sky[900], menuTitle: '#8ea2b5', text: '#8ea2b5', textHover: colors.sky[50], textActive: colors.sky[50], sidebarBgActive: '125, 211, 252' } };
Create your own sidebar colors by cloning brand or dark or any other object from the below code and provide custom name and use the same name in the attribute i.e. data-sidebar-colors="red"
.
plugins/theme-colors/sidebarColors.js
const colors = require('tailwindcss/colors'); module.exports = { brand: { sidebar: '#477eef', menuTitle: '#b1c1fd', text: '#bdcbff', textHover: '#ffffff', textActive: '#ffffff', sidebarBgActive: '228, 245, 251' }, dark: { sidebar: colors.slate[800], menuTitle: colors.slate[400], text: colors.slate[400], textHover: colors.slate[50], textActive: colors.slate[50], sidebarBgActive: '224, 242, 254' }, purple: { sidebar: colors.purple[950], menuTitle: '#b98fd7', text: '#b98fd7', textHover: '#dfd3eb', textActive: '#dfd3eb', sidebarBgActive: '216, 180, 254' }, sky: { sidebar: colors.sky[900], menuTitle: '#8ea2b5', text: '#8ea2b5', textHover: colors.sky[50], textActive: colors.sky[50], sidebarBgActive: '125, 211, 252' }, red: { sidebar: colors.red[900], menuTitle: '#8ea2b5', text: '#8ea2b5', textHover: colors.red[50], textActive: colors.red[50], sidebarBgActive: '255, 0, 0' } };
Be the first to know about new updates and exclusive discounts. No spam, just great offers!
How about
With over 7 years of experienced team, we specialize in delivering custom projects for startups, blue-chip companies, and government agencies. We have successfully completed over 250+ projects, providing tailored solutions that meet the unique needs of each client.
Hire Us© Domiex Created & Crafted by SRBThemes.