CSS Styling

The 'Public' Directory

• CSS

  • Sass

    • partials

      • _carousel.scss

      • _overrides.scss

      • _variables.scss

  • main.css

• img

• render

Sass directory

This directory contains the sass code for scss which can be used to generate css using sass compiler.

_carousel.scss

This contains the styling properties for the main slider on the homepage of the website.

You can easily change some quick settings of the main slider from here. For example, to change the background color of the carousel, set the background-color property to your desired valuebackground-color: $secondary-color; . You must note that $secondary-color is being picked from _variables.scss file by import method.

_variables.scss

Changing theme colors

$primary-color: #1abc9c;
$secondary-color: #27ae60;

$heading-size-h0: 44px;
$heading-size-h1: 27px;

$border-radius: 3px;
$font: 'Lato', sans-serif;

You can see that this file contains the main styling scheme of the theme. you can play with these variables to come up with your own set of theme. We use these variables on global scope to style all the web pages of the theme.