Theme Customization

How to customize an existing theme of Drift Angular

All the layouts have the pre-generated CSS files at the following path:

src / assets / css / {layout} / {theme_name}.css
src / assets / css / {layout} / {theme_name}.min.css

Customizing SCSS Files

The SCSS files are organized in two folders mentioned below:

• core/

• layouts/

The core/ folder contains sub-folders which further contains all the SCSS styling code which is common for all the layouts. So, if you are interested in changing the global styling, you can customize the SCSS files given inside the core/ folder at the following path:

src / scss / core / 

The layouts/ folder contains all the layouts by default. Now, for your project specific, you can choose the layout which fits into your need and can remove all the rest layouts.

Then inside this specific layout, you can find all the SCSS files available for the customization. Here is a path structure to access these layout specific files:

src / scss / layouts / {layout} /

Generate CSS files after customization

In order to generate the CSS files after the customization done in SCSS. You need to run the following Gulp commands:

$ gulp style-{layout}-{theme_name}

/* For example: $ gulp style-crm-main */

To generate a minified version, use the following command

$ gulp min-style-{layout}-{theme_name}

/* For example: $ gulp style-crm-main */