A starter toolkit based on SMACSS for Sass (SCSS) projects, with optional support for Compass.
SCSS Toolkit uses a combination of recommendations from:
Styles are broken down into the following groups: Base, Layout, Module, State
Clone the git repo - git clone git://github.com/davidrapson/scss-toolkit.git
or download it
As this project uses Sass it assumes you already have Ruby and Sass setup.
This project requires Sass 3.2 alpha, you should be able to run bundle install
in terminal to get everthing setup.
To watch the files for changes, either run sass --watch style/scss:style
or use the watch.sh
script.
I use Compass for all my projects so I've included a Compass config.rb
file, but it's completely optional. SCSS Toolkit does not rely on Compass.
This project attempts to follow the Semantic Versioning Specification.
- 1.2.2 - Add a couple of example modules, articles, navigation, and a basic media object implementation.
- 1.2.0
- Add more common colour scheme variables
- Rename style.css to main.css to match HTML5 Boilerplate
- 1.1.1 - Fix load path error in ie.scss
- 1.1.0
- Standardise variable names
- Added Gemfile, .editorconfig and watch.sh (sass --watch script)
- 1.0.0 Yay!
- Support for Media Queries with IE fallback, based on http://jakearchibald.github.com/sass-ie/
- Functions and mixins moved into dedicated directories
- Modules moved into a dedicated directory
- 0.9.3 Don't wrap layout styles in @media screen { } call. Causes issues with inline media queries.
- 0.9.2 relative-size function now uses $base-fs as a default value for $context so it can be used with a single argument
- 0.9.1 Reset styles in sync with HTML5 Boilerplate 3. Including removal of hot pink.
- 0.9.0 Added base font-size and line-height variables to help when defining a baseline rhythm
- 0.8.1 Minor bugfix, borked comment stopping styles from compiling
- 0.8.0 Colour style merged into main styles.
- 0.7.0 Made Compass optional
- 0.6.1 Moved
@media screen
declaration into main style.scss - 0.6.0 Added default form styles from HTML5 Boilerplate
- 0.5.1 Demo moved to a separate Github repo
- 0.5.0 Full expansion of SMACSS concept plus quality check of all current styles
- 0.4.5 SMACSS inspired file structure added to the README
- 0.4.0 Big changes to the directory structure, SMACSS terminology; see "Thanks & Resources"
- 0.3.0 First fully working toolkit
- 0.2.0 Basic file and directory structure
- 0.1.0 Initial commit
- Normalize.css: Public Domain
The Unlicense (aka: public domain)
This toolkit is based on the work of the following fine people & projects.
- HTML5 Boilerplate
- Normalise.css
- Scalable and Modular Architecture for CSS (SMACSS)
- Adaptive Web Design (book)
- Jake Archibald for the Sass IE implementation
- Ben Bodien for his advice and feedback