Susy Grid

Responsive Design using Breakpoint

• Breakpoint needs to be installed
• gem install breakpoint
• @ require 'breakpoint'; // in the config.rb file

To use breakpoint, wrap your code into a breakpoint function

 $small: 500px;
 $large: 1200px;
 

breakpoint($small)

 {
 	main { @include span(8);
 }
 
 aside {
 	@include span(4 at 9);
 }
 
 @include breakpoint($large){

@include layout(24);

main { @include span(21); .col1, .col2, .col3 { @include span(8); } }

aside { @include span(3 at 21); }

Breakpoint mixin

susy-breakpoint($large, 24) // if you use this you dont have to @include layout(24)

 @include pad(10px)