darren131

// Opacity
// usage @include opacity(50);
@mixin opacity($opacity) {
  opacity: $opacity / 100;
  filter: alpha(opacity=$opacity);
}

darren131

// CSS3 PROPERTIES
// --------------------------------------------------

// Border Radius
@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
          border-radius: $radius;
}

darren131

// you can pass it only the following direction keywords: 
// up, down, left, right
//
// HOW TO USE
//
// $direction: up;
// $color: #c00;
// $size: 20px;
// .class {
//    $include arrow($direction, $color, $size);

darren131

// Reset filters for IE
// especially useful when you're using something like CSS3 Pie
@mixin gradient-reset-filter() {
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

darren131

// Opacity
@mixin opacity($opacity) {
  opacity: $opacity / 100;
  filter: alpha(opacity=$opacity);
}

darren131

// fixes inline-block bug in ie7
// example usage
// .element {
//   display: inline-block;
//   .lt-ie8 & {
//     @include ie7-inline-block();
//   }
// }

@mixin ie7-inline-block() {

darren131

// variables and mixins
@import "variables"; 
@import "mixins";

// Reset
@import "reset";

// Page structure, etc
@import "scaffolding";
@import "grid";

darren131

gem install sass 
mv style.css style.scss 
sass --watch style.scss:style.css

darren131

var gistPrefix = 'http://gist.github.com/',
    // Cache document.write so that it can be restored once all Gists have been
    // embedded.
    cachedWrite = document.write,
    body = jQuery('body'),
    // Map each p.gist to an object that contains the paragraph to be replaced
    // and the Gist's identifier.
    gists = jQuery('p.gist').map(function(n, p) {
        p = jQuery(p);

darren131

<link rel="stylesheet/less" href="/path/to/style.less">
<script src="/path/to/less.js"></script>