Scss folder Structure
We have used scss for styling the website, as it makes the development process fast and convenient for the developers. Below given is a detailed explanation of the scss folder structure, so that if you want to make any changes in your personal theme then you can make changes easily.
You can find scss folder on the following path: public > assets > scss
- public
- assets
- scss
- base
- chartist
- component
- feather-icon
- flag-icon
- font-awesome
- ico-icon
- layout
- pages
- themes
- ultils
- vendors
- base
- scss
- assets
Tips
If you want to add new scss so you can add in _custom.scss file
because we are update template in future at that time you can
take
update template easily and use it
only one custom scss file you need to put from your side
Intelligent customization using scss
You can change in assets/scss/utils/_variables.scss file
Common settings
| Variables set | Content |
|---|---|
$theme-body-font-color: #171829; |
whole themplate body font color set here |
For main color settings
$primary-color: #5C61F2; |
All color template settings |
$secondary-color: #FF9766; |
|
$success-color: #61AE41; |
|
$info-color: #44A8D7; |
|
$warning-color: #E7AE2F; |
|
$danger-color: #F81F58; |
|
$light-color: #F2F5FA; |
|
For sidebar settings
$sidebar-width: 253px; |
set sidebar width |
$sidebar-shadow: 0 0 11px rgba(69, 110, 243, 0.13) |
set sidebar shadow color |
For card settings
$card-padding: 18px; |
set common card spacing |
$card-border: none |
set card border |
$card-border-radius: 15px; |
set card border radius |