SCSS/CSS Files Usage & Customization

TPro admin manages all theme css files in src/css/ folder and users css files inside assets/css/ folder. Both src/css/ and assets/ folders can be found in root of the downloaded package.

CSS files structure of src/css/ folder


                
                app-assets/
				|   ├── css/
				|   |   ├── core/
				|   |   ├── pages/
				|   |   ├── plugins/
				|   |   ├── themes/
				|   ├── bootstrap-extended.css
				|   ├── bootstrap.css
				|   ├── colors.css
				|   ├── components.css
                
            

Folder/Files Details
core core/ folder contain colors, layouts, menu, mixins and variables folder.
pages pages/ folder contains all pages specific css files.
plugins plugins/ folder contains all vendors css files.
themes themes/ folder contains template layouts specific scss files.
bootstrap-extended.css bootstrap-extended.css file is for those bootstrap components which are customized for this theme.
bootstrap.css bootstrap.css file is bootstrap
colors.css colors.css file includes all colors palette.
components.css components.scss file includes all theme components files
Info

If you are not familiar with CSS, you can write your own css in assets/css/style.css file, it will overrides theme default css.

CSS files structure for assets/ folder.


                
                    TPro-html-bootstrap-admin-template/
                    ├── assets/
                    |   ├── css/
                    |   |   ├── style.css
                    |   ├── js/
                    |   |   ├── scripts.js
                
            

If you are not familiar with CSS, Use assets/css folder's style.css file to write your custom css.

You can add your new files or folder in assets/ folder to avoid any future conflicts or merge.