sass-boilerplate

A Sass Boilerplate directory structure that helps guide in a SMACSS influenced SASS architecture, with no dependencies

Installation

This command will install the folder structure directly into your project.

mkdir sass && cd sass && npx degit --force https://github.com/sayhelloelijah/sass-boilerplate.git

base

The base directory's purpose is to contain all default styles related to base elements (body, p, a, input, etc...) and browser resets.

Note: This directory should not contain any classes or ids.

body {
    margin: 0;
    padding: 0;
}

p {
    font: {
        size: 16px;
        weight: 400;
    }
}

dependencies

The dependencies directory is used primarily for importing various dependency files. (ie. Bootstrap, normalize, modernizer, etc...)

modules

The modules directory contains all styles related to the site's various modules. (navigation, cards, header, footer, sidebar, etc...)

.nav {
    /* Code here */

    &__list {
        /* Code here */
    }
}

utilities

The utilities directory is used to contain all mixins, functions, variables, or other things that are SASS based and would be useful for you in other areas of your project.