Make a span() function for blueprint that returns the width in pixels of $n columns.

This commit is contained in:
Chris Eppstein 2011-01-02 10:43:59 -08:00
parent 068ee421f1
commit d67a43ad4b

View File

@ -108,16 +108,20 @@ $blueprint-container-size: $blueprint-grid-outer-width * $blueprint-grid-columns
@include column-base($last); @include column-base($last);
@include span($n); } @include span($n); }
// Return the width of `$n` columns.
@function span($n) {
@return $blueprint-grid-width * $n + $blueprint-grid-margin * ($n - 1);
}
// Set only the width of an element to align it with the grid. // Set only the width of an element to align it with the grid.
// Most of the time you'll want to use `+column` instead. // Most of the time you'll want to use `+column` instead.
// //
// This mixin is especially useful for aligning tables to the grid. // This mixin is especially useful for aligning tables to the grid.
@mixin span($n, $override: false) { @mixin span($n, $important: false) {
$width: $blueprint-grid-width * $n + $blueprint-grid-margin * ($n - 1); @if $important {
@if $override { width: span($n) !important; }
width: $width !important; }
@else { @else {
width: $width; } } width: span($n); } }
// The basic set of styles needed to make an element // The basic set of styles needed to make an element
// behave like a column: // behave like a column: