SASS (Syntactically Awesome StyleSheets) is a meta-language on top of CSS that‘s used to describe the style of a document cleanly and structurally, with more power than flat CSS allows. Sass both provides a simpler, more elegant syntax for CSS and implements various features that are useful for creating manageable stylesheets.
Features
- Whitespace active
- Well-formatted output
- Elegant input
- Feature-rich
Examples of SASS
Similar to flat CSS, selecting elements are done by the elements ID and or class name(s). Here is an example of SASS written with nested rules.
#main p
:color #00ff00
:width 97%
.redbox
:background-color #ff0000
:color #000000
Compiles to:
#main p {
color: #00ff00;
width: 97%; }
#main p .redbox {
background-color: #ff0000;
color: #000000; }
For additional documentation on SASS, please visit The SASS Homepage.
Notes
- To my knowledge, there currently are no themes on Drupal.org supporting this technology. I intend to release a SASS compatible version of Basic.
- SASS requires the HAML RubyGem plugin to be installed. Mac OSX Leopard has native support for SASS (otherwise run $: gem install haml)
- For installation instructions on installing Ruby/Haml on Mac OSX Tiger, please read: Building Ruby, Rails, LightTPD, and MySQL on Tiger
This module was created by and maintained by Steve Krueger.