Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Merge pull request #136 from u982744/static-columns

$container-style static - makes static columns
  • Loading branch information...
commit d5d73151593b8fbb4cff0035429d81f5ce41bd61 2 parents 67fa348 + 6f18c50
@ericam authored
View
2  sass/susy/_background.scss
@@ -12,7 +12,7 @@
// Uses all your settings to create a grid background for a container element.
// Note: Sub-pixel rounding can lead to several pixels of variation between browsers.
@mixin susy-grid-background(){
- @include column-grid-background($total-columns, column(), gutter(), 0%);
+ @include column-grid-background($total-columns, column(), gutter(), 0);
@include background-origin(content-box);
@include background-clip(content-box);
}
View
26 sass/susy/_functions.scss
@@ -67,30 +67,36 @@ $rem-with-px-fallback : true !default;
// Return the percentage width of a single column in a given 'context'.
//
// $context : The grid context in columns, if nested.
+// $style : The container style to use.
@function column(
- $context : $total-columns
+ $context : $total-columns,
+ $style : $container-style
) {
- @return relative-width($column-width, $context);
+ @return if($style == static, $column-width, relative-width($column-width, $context));
}
// Return the percentage width of multiple 'columns' in a given 'context'.
//
// $columns : The number of columns to get relative width for.
// $context : The grid context in columns, if nested.
+// $style : The container style to use.
@function columns(
$columns,
- $context : $total-columns
+ $context : $total-columns,
+ $style : $container-style
) {
- @return relative-width(columns-width($columns), $context);
+ @return if(($style == static), columns-width($columns), relative-width(columns-width($columns), $context));
}
// Return the percentage width of a single gutter in a given 'context'.
//
// $context : The grid context in columns, if nested.
+// $style : The container style to use.
@function gutter(
- $context : $total-columns
+ $context : $total-columns,
+ $style : $container-style
) {
- @return relative-width($gutter-width, $context);
+ @return if(($style == static), $gutter-width, relative-width($gutter-width, $context));
}
// Return the percentage width of a given value in a given 'context'.
@@ -105,15 +111,17 @@ $rem-with-px-fallback : true !default;
}
// Return the total space occupied by multiple columns and associated gutters.
-// Useful for adding padding or margins (preifx, suffix, push, pull, etc.)
+// Useful for adding padding or margins (prefix, suffix, push, pull, etc.)
//
// $columns : The number of columns to get relative space for.
// $context : The grid context in columns, if nested.
+// $style : The container style to use.
@function space(
$columns,
- $context : $total-columns
+ $context : $total-columns,
+ $style : $container-style
) {
- @return columns($columns, $context) + if($columns >= 1, gutter($context), 0);
+ @return columns($columns, $context, $style) + if($columns >= 1, gutter($context), 0);
}
// Accept a list including column-count and (optional) position.
View
16 sass/susy/_grid.scss
@@ -106,19 +106,21 @@
// : Padding is only output if one or two values are specified (e.g. 1em or 10px 20px)
// : Padding values are applied only on the horizontal axis in from-to order
// $from : The start direction of your layout (e.g. 'left' for ltr languages)
+// $style : The container style to use.
@mixin span-columns(
$columns,
$context : $total-columns,
$padding : false,
- $from : $from-direction
+ $from : $from-direction,
+ $style : $container-style
) {
$from : unquote($from);
$to : opposite-position($from);
$pos : split-columns-value($columns,position);
$cols : split-columns-value($columns,columns);
- $pad-from : relative-width(0 * $gutter-width, $context);
- $pad-to : relative-width(0 * $gutter-width, $context);
+ $pad-from : if($style == static, 0 * $gutter-width, relative-width(0 * $gutter-width, $context));
+ $pad-to : if($style == static, 0 * $gutter-width, relative-width(0 * $gutter-width, $context));
@if $padding != false {
$pad-from : nth($padding, 1);
@@ -129,20 +131,20 @@
$pad-to: $pad-from;
}
- $pad-from : relative-width($pad-from, $context);
- $pad-to : relative-width($pad-to, $context);
+ $pad-from : if($style == static, $pad-from, relative-width($pad-from, $context));
+ $pad-to : if($style == static, $pad-to, relative-width($pad-to, $context));
padding-#{$from}: $pad-from;
padding-#{$to}: $pad-to;
}
- width: columns($cols, $context) - if($border-box-sizing, 0, $pad-to + $pad-from);
+ width: columns($cols, $context, $style) - if($border-box-sizing, 0, $pad-to + $pad-from);
@if ($pos == 'omega') {
@include omega($from);
} @else {
float: $from;
- margin-#{$to}: gutter($context);
+ margin-#{$to}: gutter($context, $style);
@if $legacy-support-for-ie6 {
display: inline;
}
View
18 sass/susy/_margin.scss
@@ -8,13 +8,15 @@
// : Context is required on any nested elements.
// : Context MUST NOT be declared on a root element.
// $from : The start direction of your layout (e.g. 'left' for ltr languages)
+// $style : The container style to use.
@mixin pre(
$columns,
$context : $total-columns,
- $from : $from-direction
+ $from : $from-direction,
+ $style : $container-style
) {
$from : unquote($from);
- margin-#{$from}: space($columns,$context);
+ margin-#{$from}: space($columns, $context, $style);
}
// 'push' is a synonymn for 'pre'
@@ -34,13 +36,15 @@
// : Context is required on any nested elements.
// : Context MUST NOT be declared on a root element.
// $from : The start direction of your layout (e.g. 'left' for ltr languages)
+// $style : The container style to use.
@mixin pull(
$columns,
$context : $total-columns,
- $from : $from-direction
+ $from : $from-direction,
+ $style : $container-style
) {
$from : unquote($from);
- margin-#{$from}: 0 - space($columns, $context);
+ margin-#{$from}: 0 - space($columns, $context, $style);
}
// Apply 'columns' margin after an element to contain it in a grid.
@@ -50,14 +54,16 @@
// : Context is required on any nested elements.
// : Context MUST NOT be declared on a root element.
// $from : The start direction of your layout (e.g. 'left' for ltr languages)
+// $style : The container style to use.
@mixin post(
$columns,
$context : $total-columns,
- $from : $from-direction
+ $from : $from-direction,
+ $style : $container-style
) {
$from : unquote($from);
$to : opposite-position($from);
- margin-#{$to}: space($columns,$context);
+ margin-#{$to}: space($columns, $context, $style);
}
// Apply 'columns' before and/or after an element to contain it on a grid.
View
12 sass/susy/_padding.scss
@@ -7,13 +7,15 @@
// : Context is required on any nested elements.
// : Context MUST NOT be declared on a root element.
// $from : The start direction of your layout (e.g. 'left' for ltr languages)
+// $style : The container style to use.
@mixin prefix(
$columns,
$context : $total-columns,
- $from : $from-direction
+ $from : $from-direction,
+ $style : $container-style
) {
$from : unquote($from);
- padding-#{$from}: space($columns, $context);
+ padding-#{$from}: space($columns, $context, $style);
}
// add empty colums as padding after an element.
@@ -22,14 +24,16 @@
// : Context is required on any nested elements.
// : Context MUST NOT be declared on a root element.
// $from : The start direction of your layout (e.g. 'left' for ltr languages)
+// $style : The container style to use.
@mixin suffix(
$columns,
$context : $total-columns,
- $from : $from-direction
+ $from : $from-direction,
+ $style : $container-style
) {
$from : unquote($from);
$to : opposite-position($from);
- padding-#{$to}: space($columns, $context);
+ padding-#{$to}: space($columns, $context, $style);
}
// add empty colums as padding before and after an element.
Please sign in to comment.
Something went wrong with that request. Please try again.