main.scss

////
/// Stylesheet: Main Frontend
/// ************************************************************
///
/// This stylesheet is loaded in the frontend.
///
///     >------------------>
///
///     1 Globals & Dependencies
///
///     2 Libs
///
///         Functions
///         Mixins
///         Variables
///         Symbols
///         Palettes
///         Typography
///         Accesibility
///         Admin Bar
///
///     3 Modules
///
///     4 Frontend Styles
///
///     5 Vendor Frontend Styles
///
///     <------------------<
///
/// @link http://thesassway.com/advanced/modular-css-naming-conventions
/// @link http://www.sitepoint.com/architecture-sass-project/
////


///
/// 1 GLOBALS & DEPENDENCIES
///
/// Configure your theme includes & paths in these files
///
@import "globals";
@import "vendor/front_deps";


///
/// 2 LIBS
///
/// Note: the order of imports is important
///

// Functions
@import "lib/util/functions";

// Mixins
@import "lib/util/mixins";

// Palettes
@import "lib/palettes/main";

// Variables
@import "lib/variables";

// Symbols
@import "lib/symbols";

// Typography
@import "lib/typography";

// Accesibility Style
@import "lib/accessibility";

// Admin bar
@import "lib/admin_bar";


///
/// 3 /MODULES
///
/// This directory contains partials and placeholders, and is reserved for reusable UI patterns.
///
/// As a general rule of thumb, anytime you anticipate needing the same CSS more than once,
/// you should modularize it. The more your project matures, the more CSS you should be able
/// to compartmentalize into modules. Preferably, each module contains a mixin at the top
/// with corresponding declarations at the bottom for including that mixin.
///
/// Crafting your modules in this fashion helps you start thinking about CSS in a more
/// modular way. They are also easier to expand upon and/or extend in the future.
///

@import "lib/modules/main";


///
/// 4 FRONTEND STYLES
///

@import "front/main";


///
/// 5 VENDOR
///
/// Vendor specific styles, for WordPress plugins,
/// js libraries, or other third party libraries.
///

@import "vendor/front/main";