Customization

Customizing the Qoduby template is extremely simple. You can develop the template by following the steps below.

Preparation For Customization.

Inside all demo folders, there is a specially prepared src/ folder for that demo.

There are js and scss/ folders in this src/ folder. The folder we should use to customize the appearance (css) of our template is scss/.

We use a method to separate custom typed scss codes from bootstrap. All files in scss/ folder are bootstap default files and folders. Inside this folder, there are two folders named layout/ and plugins/. These folders are scheduled to override bootsrap files. The reason we do this; to be able to do this easily when we need to update the bootstrap at a future date.

We can describe these folders as follows.

layout folder

All scss codes specially written for the template are located in this folder.

plugins folder

All scss files of 3rd party plugins used in the template are located in this folder.

Also, you need to use the demo[x]/assets/js/pages folder to manage Javascript operations on demo pages.

The Javascript files in this folder are organized according to the demo html page names and can be edited very easily.

Customize Colors

You can use src/scss/layout/_variables.scss to customize the colors of the whole template.

									
// scss-docs-start color-variables
$blue:    #5151F9 !default;
$indigo:  #6610f2 !default;
$purple:  #6f42c1 !default;
$pink:    #d63384 !default;
$red:     #E11D48 !default;
$orange:  #fd7e14 !default;
$yellow:  #FFBB2A !default;
$green:   #11B981 !default;
$teal:    #20c997 !default;
$cyan:    #0EA5E9 !default;
// scss-docs-end color-variables