Main features:

* Create rich CSS files using:
* ERB templates
* Server-side constants
* Server-side classes (preliminary)
* Process DCSS files off-line using command line executable
* Also available as a rails plugin

=== ERB templates

Example

  <% template_color = "#000"
     template_background = "#fff"
     template_highlight = "#fa3"
  %> 
  body {
  	color: <%= template_color %>;
  	background-color: <%= template_background %>;  	
  }
  
  h1 {
  	color: <%= template_background %>;
  	background-color: <%= template_highlight %>;
  }

=== Server-side Constants

Server-side Constants were originally developed by Shaun Inman in PHP. SSC extends CSS syntax in a simple way. SCC is cross-platform and easy to use.

DCSS uses the constants implementation from RCSS[http://rcss.rubyforge.org/] which also allows constants to include spaces and commas.

Example

  @server constants {
    template_color: #000;
    template_background: #fff;
    template_highlight: #fa3;

    // Rcss specific (note spaces and commas)
    template_font: "Trebuchet MS", "Bitstream Vera Sans", helvetica, sans-serif;
  }

  body {
  	color: template_color;
  	background-color: template_background;
  	font-family: template_font;
  }
  
  h1 {
  	color: template_background;
  	background-color: template_highlight;
  	font-family: template_font;
  }

There might be several constants/variables blocks in the same file. It does not matter where in CSS file they appear, their contents are still applied to whole file.

When a constant is redefined only later occurrence is taken into account so:

  template_color: #fff;
  ...
  template_color: #000;

...will result in template_color having value #000 in all places.

To use constant's value simply type it's name anywhere in the code:

  body {
    color: constant_name;
  }

*Note* that since anything can be constant's value it is also possible to use it to hold attribute or even selector:

  @server constants {
  	body: #fff;
  }

  body {
  	color: body;
  }

This will be evaluated to

  #fff {
    color: #fff;
  }

..which probably is not what one might expect. For that reason avoid using CSS selector and attribute names as constant names.

=== Nested Descendant Selectors

DCSS introduces the following {{ }} syntax:

  #someid { color: blue } {{
    a { color: green; }
  }}

Which renders to:

  #someid { color: blue }
   #someid a { color: green; }

Leaving out the parent properties is ok:

  #someid {{
    a { color: green; }
  }}

becomes:

  #someid a { color: green; }

Nested and comma separated selectors also work:

  body.home, #specialpage { margin: 10px auto; width: 700px; } {{
    h1 { font-family: Arial, sans-serif; } 
    a, a:visited { color: blue; }
    p > span { font-size: 1.2em; }
    #someid { background: red; } {{
      h1 { font-family: Georgia, serif; }
    }}
  }}

renders to:

  body.home, #specialpage { margin: 10px auto; width: 700px; }
  body.home h1, #specialpage h1 { font-family: Arial, sans-serif; }
  body.home a, body.home a:visited, #specialpage a, #specialpage a:visited { color: blue; }
  body.home p > span, #specialpage p > span { font-size: 1.2em; }
  body.home #someid, #specialpage #someid { background: red; }
  body.home #someid h1, #specialpage #someid h1 { font-family: Georgia, serif; }