darren131

@spritePath: '../images/sprite.png';
.sprite(@url: @spritePath, @xpos: 0, @ypos: 0) {
  background-image: url(@url);
  background-repeat: none;
  background-position: @xpos @ypos;
}

darren131

// HOW TO USE
//
// @direction: up;
// .class {
//    .arrow(@direction, #c00, 20px);
// }
//

.arrow(up, @color, @size) {
  width: 0;

darren131

// ----------------------------------------------------------
// A short snippet for detecting versions of IE in JavaScript
// without resorting to user-agent sniffing
// ----------------------------------------------------------
// If you're not in IE (or IE version is less than 5) then:
//     ie === undefined
// If you're in IE (>=5) then you can determine which version:
//     ie === 7; // IE7
// Thus, to detect IE:
//     if (ie) {}

darren131

.ir {
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

darren131

(function( $ ){
  // set up global variables
  var ObjectName;

  // Navigation object
  ObjectName = {

    method: function() {

    },

darren131

.product {
  
  h1 {
    color: #c00;
  }

  .image {
    float: left;
  }

darren131

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

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

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

darren131

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

// Reset
@import "reset";

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