This template power packed by various color scheme and awesome layout option like: Mini Sidebar, Iconic Sidebar, etc... Using that you can get your perfect template

We have provided a bunch of page layouts and menu layouts that can be implemented with just a class change to body! Please refer the below table for corresponding classes.

---

Customize Template using Options

Layouts

Layout	Options
Iconic Sidebar	Add .iconic-sidebar in body tag.

Colors

Info	Classes
Dark Theme	.theme-dark add to body
Header Colors	.bg-*(primary, info, success, danger, warning, dark, brand) add to #header
Sidebar Colors	.sidebar-*(primary, info, success, danger, warning, dark, brand) add to #sidebar
Audio Player Colors	.player-*(primary, info, success, danger, warning, dark, brand) add to #audioPlayer

You can seen above that you are able to add some class on particular element manually. But we are provide javascript options also please see code below:

Javascript

                    
    $('body').themeSettings({
        darkTheme: true // true is used for Dark Theme by default it's false.

        // There are seven header color scheme option 0 to 6 code.
        // 0: Primary Header, 1: Danger Header, 2: Success Header, 3: Warning Header,
        // 4: Info Header, 5: Brand Header, 6: Dark Header.
        header: 0 // 0 is a code for primary header.
        
        // There are seven header color scheme option 0 to 6 code.
        // 0: Primary Sidebar, 1: Danger Sidebar, 2: Success Sidebar, 3: Warning Sidebar,
        // 4: Info Sidebar, 5: Brand Sidebar, 6: Dark Sidebar.
        sidebar: 0 // 0 is a code for primary sidebar.
        
        // There are seven header color scheme option 0 to 6 code.
        // 0: Primary Player, 1: Danger Player, 2: Success Player, 3: Warning Player,
        // 4: Info Player, 5: Brand Player, 6: Dark Player.
        player: 0 // 0 is a code for primary header.
    });
                    
                

*Note: We are add new layout options in future

Remove Customize Template Options

1. Open app.js from src/assets/js/app.js

2. Find AppConfig.initTheme(); and remove this code

3. Delete theme.settings.js from src/assets/js/theme.settings.js