Jeremy Caldwell jeremycaldwell

Advanced SCSS

Or, 16 cool things you may not have known your stylesheets could do. I'd rather have kept it to a nice round number like 10, but they just kept coming. Sorry.

I've been using SCSS/SASS for most of my styling work since 2009, and I'm a huge fan of Compass (by the great @chriseppstein). It really helped many of us through the darkest cross-browser crap. Even though browsers are increasingly playing nice with CSS, another problem has become very topical: managing the complexity in stylesheets as our in-browser apps get larger and larger. SCSS is an indispensable tool for dealing with this.

This isn't an introduction to the language by a long shot; many things probably won't make sense unless you have some SCSS under your belt already. That said, if you're not yet comfy with the basics, check out the aweso

	# Install SassC Interpreter
	$ cd /usr/local/src
	$ curl -kL https://github.com/hcatlin/libsass/archive/master.zip > libsass.zip
	$ unzip libsass.zip

	# Install LibSass Library
	$ cd /usr/local/src
	$ curl -kL https://github.com/sass/sassc/archive/master.zip > sassc.zip
	$ unzip sassc.zip

	// Initialize the Sass variables and partials used in this project.

	// Set the legacy IE support variables. We override the default values set by
	// the compass/support partial, but let styles-ie8.scss override these values.
	$legacy-support-for-ie6 : false !default;
	$legacy-support-for-ie7 : false !default; // Note the use of !default.
	$legacy-support-for-ie8 : false !default;


	// Partials to be shared with all .scss files.