SCSS files - top
SASS Files are located under
/sass
folder, and here is the general structure of files of this folder :
- main.scss : the main file
- style-X.scss : sample CSS customization of the template
- _variables.scss : contains variables such as color, font size and font family
- _mixins.scss : mixins, such as buttons behavior and design
- _functions.scss : functions required by this theme
- _components.scss : all available components : buttons, slider, layouts ...
- _sections.scss : section layouts, section cover, default appearance , section header...
- _pages.scss : page layout appearance
- The sub-folder
/components
, contains page components which are- _articles.scss : article layout. Variants are located within the subfolder
article
- _buttons.scss : button layout. Variants are located within the subfolder
button
- _cards.scss : card picture layout. Variants are located within the subfolder
card
- _coveer.scss : the page cover layout
- _forms.scss : input and forms layout. Variants are located within the subfolder
form
- _images.scss : images and picture layout. Variants are located within the subfolder
image
- _media.scss : customization of Bootstrap 4 media object
- _menu-icon.scss : the page menu icon
- _nav-right-dot.scss : the navigation dot at right of the page
- _page-headers.scss : the page header. Variants are located within the subfolder
page-header
- _sliders.scss : gallery sliders
- _articles.scss : article layout. Variants are located within the subfolder
- initialization and utlities helper, located within
init
andutilities
folder
To edit the template theme color, edit the _variable.scss file and replace the following colors by yours
You can add more color variant to $theme-colors
but it may increase the main.css filesize.