Layouts
Default settings
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "full", // full | mini-sidebar
BoxedLayout: true, // true | false
Direction: "ltr", // ltr | rtl
Theme: "light", // light | dark
ColorTheme: "Blue_Theme", // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme
cardBorder: false, // true | false
};
How to configure Theme Color ?
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "full", // full | mini-sidebar
BoxedLayout: true, // true | false
Direction: "ltr", // ltr | rtl
Theme: "light", // light | dark
ColorTheme: "Aqua_Theme", // Change is here // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme /
cardBorder: false, // true | false
};
How to configure Minisidebar ?
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "mini-sidebar", // full | mini-sidebar // Change is here
BoxedLayout: true, // true | false
Direction: "ltr", // ltr | rtl
Theme: "light", // light | dark
ColorTheme: "Blue_Theme", // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme
cardBorder: false, // true | false
};
How to configure Full Sidebar ?
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "full", // full | mini-sidebar // Change is here
BoxedLayout: true, // true | false
Direction: "ltr", // ltr | rtl
Theme: "light", // light | dark
ColorTheme: "Blue_Theme", // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme
cardBorder: false, // true | false
};
How to configure Fullwidth Layout ?
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "full", // full | mini-sidebar
BoxedLayout: false, // true | false // Change is here
Direction: "ltr", // ltr | rtl
Theme: "light", // light | dark
ColorTheme: "Blue_Theme", // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme
cardBorder: false, // true | false
};
How to configure Card with Border ?
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "full", // full | mini-sidebar
BoxedLayout: true, // true | false
Direction: "ltr", // ltr | rtl
Theme: "light", // light | dark
ColorTheme: "Blue_Theme", // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme
cardBorder: true, // true | false // Change is here
};
How to configure Card with Shadow ?
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "full", // full | mini-sidebar
BoxedLayout: true, // true | false
Direction: "ltr", // ltr | rtl
Theme: "light", // light | dark
ColorTheme: "Blue_Theme", // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme
cardBorder: false, // true | false // Change is here
};
How to configure Dark Theme ?
// ----------------------------------------------------
// File: package/demos/src/assets/js/theme/app.init.js
// ----------------------------------------------------
var userSettings = {
Layout: "vertical", // vertical | horizontal
SidebarType: "full", // full | mini-sidebar
BoxedLayout: true, // true | false
Direction: "ltr", // ltr | rtl
Theme: "dark", // light | dark // Change is here
ColorTheme: "Blue_Theme", // Blue_Theme | Aqua_Theme | Purple_Theme | Green_Theme | Cyan_Theme | Orange_Theme
cardBorder: false, // true | false
};