Contents

// ------------------------------------------
// BLOCK GRID
//   Based heavily on ZURB's Foundation
// ------------------------------------------

$block-distance  : em(15px) !default;
$max-blocks      : 12 !default;

@mixin block-grid-calc (
	$per-row  : false,
	$distance : $block-distance,
	$collapse : false,
	$for-base : true ) {

	@if $per-row {
		width   : 100% / $per-row;

		&:nth-of-type(n) {
			clear: none;
		}
		&:nth-of-type(#{$per-row}n+1) {
			clear: both;
		}
	} @else {
		@if $collapse {
			padding : 0;
		} @else {
			padding : 0 ($distance / 2);
		}
	}
}

@mixin block-grid (
	$per-row  : false,
	$distance : $block-distance,
	$collapse : false,
	$for-base : true ) {
	
	// For base class
	@if $for-base {
		display : block;
		padding : 0;

		@if $collapse {
			margin  : 0;
		} @else {
			margin  : 0 (-$distance / 2);
		}
		
		@include clearfix;

		& > li {
			display : block;
			height  : auto;
			float   : $default-float;
			@include block-grid-calc($distance:$distance, $collapse:$collapse);
		}
	}

	@if $per-row {
		& > li {
			@include block-grid-calc($per-row:$per-row);
		}
	}
}

@if $include-block-grid {

/* ---------------
EDGE Block Grid
--------------- */

[class*="block-grid-"] {
	@include block-grid();
	
	&.collapse {
		@include block-grid($collapse:true);
	}
}

@for $i from 1 through $max-blocks {
	.large-block-grid-#{$i} {
		@include block-grid($per-row:$i, $for-base:false );
	}
}

@include small {
	// Make large-block-grid 100% width
	[class*="large-block-grid-"] > li {
		width: 100%;
	}

	// Remove large grid clearing
	@for $i from 1 through $max-blocks {
		.large-block-grid-#{$i} > li:nth-of-type(#{$i}n+1) {
			clear: none;
		}
	}

	@for $i from 1 through $max-blocks {
		.small-block-grid-#{$i} {
			@include block-grid($per-row:$i, $for-base:false );
		}
	}
}




} // include-block-grid

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
edge_framework-0.2.1	assets/sass/edge/components/_block-grid.scss
edge_framework-0.2.0	assets/sass/edge/components/_block-grid.scss