Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Why I <3 SASS & Compass ...and you should too

Julie Pagano
February 08, 2013

Why I <3 SASS & Compass ...and you should too

Lightning talk about why I love SASS and Compass.

Julie Pagano

February 08, 2013
Tweet

More Decks by Julie Pagano

Other Decks in Technology

Transcript

  1. +

  2. 3 uses 1. Command-line tool 2. Standalone Ruby module 3.

    Plugin for any Rack-enabled framework, including Ruby on Rails*
  3. 3 uses 1. Command-line tool 2. Standalone Ruby module 3.

    Plugin for any Rack-enabled framework, including Ruby on Rails* * included in the asset pipeline in Rails 3.1+
  4. Mixins Reusable chunks of CSS that take arguments @mixin fn($arg1,

    $arg1) { ... } div { @include fn(1, 2); } Functions in your CSS!
  5. Math Operations +        -­‐      

     *        /        % yay, arithmetic!
  6. Loops @for $i from 1 through 6 { ... }

    @each $item in $list { ... } @while $i > 0 { ... $i: $i - 1; }
  7. Nesting nav  {      margin:  20px;   }  

    nav  ul  {      width:  100%;   }   nav  ul  li  {      float:  left;   }   nav  ul  li  a  {      padding:  1em;   }  
  8. Nesting nav  {      margin:  20px;      

     ul  {          width:  100%;            li  {              float:  left;                a  {                  padding:  1em;              }          }      }   }  
  9. and even more... • More useful helper functions • Inheritance

    • Output formatting • Extensions in Ruby