From 5bbe330c0cbfa521a3b2618ff72c50e26a3d9bfd Mon Sep 17 00:00:00 2001 From: Brian Talbot Date: Wed, 9 Oct 2013 12:23:40 -0400 Subject: [PATCH 1/2] updating to Sass 3.2.12 and Neat 1.4.0 --- Gemfile | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Gemfile b/Gemfile index 329f289d79..7f9d08da29 100644 --- a/Gemfile +++ b/Gemfile @@ -1,8 +1,8 @@ source 'https://rubygems.org' gem 'rake', '~> 10.0.3' -gem 'sass', '3.2.9' +gem 'sass', '3.2.12' gem 'bourbon', '~> 3.1.8' -gem 'neat', '~> 1.3.0' +gem 'neat', '~> 1.4.0' gem 'colorize', '~> 0.5.8' gem 'launchy', '~> 2.1.2' gem 'sys-proctable', '~> 0.9.3' From 3a639ece1f3881dc3c9397fb076825cb2307896a Mon Sep 17 00:00:00 2001 From: Brian Talbot Date: Thu, 10 Oct 2013 07:15:32 -0400 Subject: [PATCH 2/2] updating Neat generated utility files --- .../static/sass/neat/functions/_private.scss | 8 +-- common/static/sass/neat/grid/_private.scss | 29 +++++++++++ common/static/sass/neat/grid/_shift.scss | 1 - .../static/sass/neat/grid/_span-columns.scss | 51 ++++++++----------- 4 files changed, 55 insertions(+), 34 deletions(-) diff --git a/common/static/sass/neat/functions/_private.scss b/common/static/sass/neat/functions/_private.scss index 136a6ff3a1..49683d7db5 100644 --- a/common/static/sass/neat/functions/_private.scss +++ b/common/static/sass/neat/functions/_private.scss @@ -56,14 +56,14 @@ @for $i from 1 to $grid-columns*2 { @if is-even($i) { - $values: append($values, $transparent $column-offset); - $values: append($values, $color $column-offset); + $values: append($values, $transparent $column-offset, comma); + $values: append($values, $color $column-offset, comma); $column-offset: $column-offset + $column-width; } @else { - $values: append($values, $color $column-offset); - $values: append($values, $transparent $column-offset); + $values: append($values, $color $column-offset, comma); + $values: append($values, $transparent $column-offset, comma); $column-offset: $column-offset + $gutter-width; } } diff --git a/common/static/sass/neat/grid/_private.scss b/common/static/sass/neat/grid/_private.scss index acd1b5b74d..38d3fcef38 100644 --- a/common/static/sass/neat/grid/_private.scss +++ b/common/static/sass/neat/grid/_private.scss @@ -19,3 +19,32 @@ $layout-direction: nil !default; @function grid-width($n) { @return $n * $gw-column + ($n - 1) * $gw-gutter; } + +@function get-parent-columns($columns) { + @if $columns != $grid-columns { + $parent-columns: $columns; + } @else { + $parent-columns: $grid-columns; + } + + @return $parent-columns; +} + +@function is-display-table($container-is-display-table, $display) { + $display-table: false; + + @if $container-is-display-table == true { + $display-table: true; + } @else if $display == table { + $display-table: true; + } + + @return $display-table; +} + +@function get-padding-for-table-layout($columns, $total-columns) { + $total-padding: flex-gutter($total-columns) * ($columns - 1); + $padding: $total-padding / $columns; + + @return $padding; +} diff --git a/common/static/sass/neat/grid/_shift.scss b/common/static/sass/neat/grid/_shift.scss index e39208ef0d..b3cb503f66 100644 --- a/common/static/sass/neat/grid/_shift.scss +++ b/common/static/sass/neat/grid/_shift.scss @@ -1,5 +1,4 @@ @mixin shift($n-columns: 1) { - $direction: get-direction($layout-direction, $default-layout-direction); $opposite-direction: get-opposite-direction($direction); diff --git a/common/static/sass/neat/grid/_span-columns.scss b/common/static/sass/neat/grid/_span-columns.scss index 97902d62c4..609c3490d7 100644 --- a/common/static/sass/neat/grid/_span-columns.scss +++ b/common/static/sass/neat/grid/_span-columns.scss @@ -1,45 +1,38 @@ @mixin span-columns($span: $columns of $container-columns, $display: block) { - $columns: nth($span, 1); $container-columns: container-span($span); - $display-table: false; + + // Set nesting context (used by shift()) + $parent-columns: get-parent-columns($container-columns); $direction: get-direction($layout-direction, $default-layout-direction); $opposite-direction: get-opposite-direction($direction); - @if $container-columns != $grid-columns { - $parent-columns: $container-columns; - } @else { - $parent-columns: $grid-columns; - } - - @if $container-display-table == true { - $display-table: true; - } @else if $display == table { - $display-table: true; - } @else { - $display-table: false; - } + $display-table: is-display-table($container-display-table, $display); @if $display-table { + $padding: get-padding-for-table-layout($columns, $container-columns); display: table-cell; - padding-#{$direction}: flex-gutter($container-columns); - width: flex-grid($columns, $container-columns) + flex-gutter($container-columns); - - &:last-child { - width: flex-grid($columns, $container-columns); - padding-#{$direction}: 0; - } - } - - @else { + padding-#{$direction}: $padding; + width: flex-grid($columns, $container-columns) + $padding; + } @else { display: block; float: #{$opposite-direction}; - margin-#{$direction}: flex-gutter($container-columns); - width: flex-grid($columns, $container-columns); - &:last-child { - margin-#{$direction}: 0; + @if $display == collapse { + width: flex-grid($columns, $container-columns) + flex-gutter($container-columns); + + &:last-child { + width: flex-grid($columns, $container-columns); + } + + } @else { + margin-#{$direction}: flex-gutter($container-columns); + width: flex-grid($columns, $container-columns); + + &:last-child { + margin-#{$direction}: 0; + } } } }