mirisuzanne

// ----
// libsass (v3.2.2)
// ----

@import "susy";

$susy:(
	container:1200px,
	math:fluid,
	output:isolate,

mirisuzanne

// ----
// libsass (v3.1.0)
// ----

// uncomment the fraction line to break libsass...

$numbers: (
  integer: 4,
  decimal: .25,
  // fraction: 1/4, 

mirisuzanne

# install the requirements
npm install gulp
npm install gulp-sass
npm install susy

# compile your sass
gulp sass

mirisuzanne

// ----
// libsass (v3.1.0)
// ----

@import "susy";

.pad {
  @include pad(1 of 12);
}

mirisuzanne

// ----
// Sass (v3.4.11)
// Compass (v1.0.3)
// Breakpoint (v2.5.0)
// Susy (v2.2.2)
// ----

@import "breakpoint";
@import "susy";

mirisuzanne

<article class="block">1</article>
<article class="block">2</article>
<article class="block">3</article>
<article class="block">4</article>
<article class="block">5</article>
<article class="block">6</article>
<article class="block">7</article>

mirisuzanne

// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// Susy (v2.1.3)
// ----

@import 'susy';

$my-layout: (gutters: 0);

mirisuzanne

<main>
  <article>
    <h2>article</h2>
    <div class="wide">
      <h2>WIDE</h2>
    </div>  
  </article>
  <aside>
    <h2>aside</h2>
  </aside>

mirisuzanne

// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----

$ww_blue: blue;
$contribute: 'contrib';

##{$contribute} {
  ul{

mirisuzanne

<div>
  <span></span><span></span><span></span>
  <span></span><span></span><span></span>  
</div>
<div>
  <span></span><span></span><span></span>
  <span></span><span></span><span></span>  
</div>
<div>
  <span></span><span></span><span></span>