Sass

This extension allows you to parse your CSS through Sass before it is cached. It uses the sass command line tool to parse your CSS. This means you’ll need to have the haml gem installed on the server running Scaffold, or at least on the development machine. See the Sass site for instructions.

This allows you to bypass the need to touch the command line to use Sass, which is something a lot of designers might avoid. Rather than using a program to check if a file has changed and recompile the Sass file or recompiling it manually in the command line, Scaffold allows you to test it in the browser as you normally would. Just refresh the page.

See the Sass documentation to learn about all of it’s super awesome features.

To use this extension, you should make sure you don’t have the Mixins or Nested Selectors extensions enabled.

Usage

You write your CSS using either standard Sass syntax, or the SCSS syntax:

$blue: #3bbfce
$margin: 16px

.content-navigation
  border-color: $blue
  color: darken($blue, 9%)

.border
  padding: $margin / 2
  margin: $margin / 2
  border-color: $blue

And Scaffold will take care of the rest:

.content-navigation {
  border-color: #3bbfce;
  color: #2b9eab;
}

.border {
  padding: 8px;
  margin: 8px;
  border-color: #3bbfce;
}

Settings

Scaffold lets you access some of Sass’ options.

$config['params'] (array)

This is an array of params that will be passed to Sass. It has a number of sub-options.

$config['params']['scss'] = true

Use the CSS-superset SCSS syntax.

$config['params']['style'] = 'compressed'

Output style. Can be nested (default), compact, compressed, or expanded.

$config['command'] = 'sass'

The system command to use Sass.

Hooks

This extension has no hooks :(