Welcome on CaCSScade

The best OVCSS managing system

Discover

The OVCSS working system is just a way to organise your css to get a better and faster workflow.

You will maintain your CSS projects much easier, by using the power of the SASS, your css will get superpowers.

So basically, your output code will be clean & pure CSS.

Addons Base Components Core Theme Utils
index.html
|
|_ ovcss.css
  |
  |_ ovcss/
         |
  |_ addons/ | |_debug.scss | |_shame.scss
  |_ base/
| |_ core/ | | |_variables.scss | | |_functions.scss | | |_mixins.scss
| | | |_base.scss | |_colors.scss | |_form.scss | |_normalize.scss | |_typography.scss
|_ components/ | |_buttons.scss | |_icons.scss | |_images.scss
|_ theme/ | |_over-bootstrap.scss
|_ utils/ | |_animations.scss | |_classes.scss | |_responsive.scss
|_ normalize.css |_ global.scss |_ settings.scss

Here is the settings.scss file.

/* BASE
---------------------------------------------------------------------------*/
@import 'base/_normalize.scss';         // Import the mixins.
@import 'base/core/_variables.scss';    // Import the mixins.
@import 'base/core/_functions.scss';    // Import the mixins.
@import 'base/core/_mixins.scss';       // Import the mixins.
@import 'base/_typography.scss';        // Import your typography stylesheet.
@import 'base/_base.scss';              // Import your Base Stylesheet.
@import 'base/_colors.scss';            // Import your colorscheme first.
@import 'base/_form.scss';              // Import the form stylesheet.

@import 'components/_icons.scss';       // Import the icon fonts.
@import 'components/_buttons.scss';     // Import the Buttons stylesheet ( After the colors, the typograhy).

@import 'theme/_over-bootstrap.scss';   // Rerwite over bootstrap style



/* GLOBAL STYLESHEET
---------------------------------------------------------------------------*/
@import '_global.scss' ;                // Global stylesheet


/* ADDONS
---------------------------------------------------------------------------*/
@import 'utils/_classes.scss';          // Import the Classes file.
@import 'utils/_animations.scss';       // Import the keyframes animations stylesheet.
@import 'utils/_responsive.scss';       // Responsive stylesheet, for media-queries

@import 'addons/_shame.scss';           // If it's a hack, it goes in shame.css .

There is already a cool frameworks that comes with CaCSScade, it's called EfficaCSS, and it's like steroid for CSS

Discover EfficaCSS