bloqhead of Big Sea
6/13/2014 - 2:38 PM

Reset Columns mixin... Used in combination with Bourbon Neat, especially with span-columns, to get the columns changing dynamically without

Reset Columns mixin... Used in combination with Bourbon Neat, especially with span-columns, to get the columns changing dynamically without having to wrap each row in a span-12. Assumes span-12 is the maximum, though. Assumes you know what the previous column layout was, too, though I guess we can rework this to reset margins for ALL possibilities, before moving forward.

usage.scss
content_copyfile_download
.brewery {
	@include span-columns(2);
	@include reset-columns(2, 3);
}
reset-columns.scss
content_copyfile_download
@mixin reset-columns($new_span: 3, $old_span: 4) {
	$old_nth: 12 / $old_span;
	$new_nth: 12 / $new_span;

	// Reset the old nth child
	&:nth-child(#{$old_nth}n) {
		margin-right: flex-gutter(container-span(#{$old_span}));
	}

	// Set up the new one
	&:nth-child(#{$new_nth}n) {
		margin-right: 0;
	}
} // end reset-columns