Xceptor 4.0 CSS
If you're new to large CSS projects we'd recommend that you take a look at the following resources before delving into any specifics:
The project uses a variant of OOCSS so it's worth getting your head around this for starters. If you're new to object orientated programming it's also worth exploring the Single Responsibility Principle when applied to CSS.
Although we're not explicitly using the Atomic Web Design terminology, the principles are the same.
The methodology we use throughout the project is based on ITCSS. This video will provide a good introduction.
If you're unsure how to write something (comments, selectors, etc), take a look at CSS Guidelines. The last section also explains important OO princples further.
On larger projects, naming conventions is vital. We're using BEM.
The SCSS folder includes the following subfolder. This is very important for dealing with CSS dependencies when using the ITCSS css way of thinking (see ITCSS section above).
Global variables, config switches.
Default mixins and functions.
Ground-zero styles (Normalize.css, resets, box-sizing).
Unclassed HTML elements (type selectors).
Cosmetic-free design patterns.
Designed components, chunks of UI.
Helpers and overrides.
For more information on the contents of each folder checkout the table of contents at the top of style.scss