File Construction

CSS File Creation

In order to create a project up or work on an existing one, there is some preliminary set up that needs to be completed. Follow the steps to install and run UX with the UX CLI (UX Command Line Interface).

General

• Add a @charset declaration to the beginning of the main stylesheet:

  @charset 'utf-8'; 
                                  

CSS Preprocessing

SASS

SASS is currently being used to minify and construct our stylesheets.

CSS Methodologies

We Refer to BEM for most SCSS/CSS selector structure. This allows us to style in a component-based method instead of based on content.

SCSS Standard Project Folder Structure

• The standard project structure should mirror this standard project structure located in Github.
  1. Only have one .css file in the root (minified).
  2. Only have one .scss file in the root.

SCSS Standard Partial Structure

• All sass partials should be prefixed with an underscore and use the .scss file extension:

  _banner.scss