neat 1.3.0 → 1.4.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 5bdefb64cec2e270e681c122c86cb3c428b93ae3
-  data.tar.gz: 23f6315428bb85162b9ed54f7b96b95e16f659a6
+  metadata.gz: b1791bf7c055a1329480da34064aaf4e16d91ea4
+  data.tar.gz: 57900e1f7741a736869c07a076685f88643e88a0
 SHA512:
-  metadata.gz: 4f18d2d97a9b7ccb34366f6d6af3defacbcc1df94602f62c70db60ec26498636939e2d9a28fd7289b5906437b96d8712ced5ccf5d4c58a1d0e9c8b5fe20f4b69
-  data.tar.gz: 88ece79f10a6a0a72daabdce203ac49bf930706b5abf92afd087313468b8e41e6ed83ae3f6425ef2a47aace49bf87f866d7a839e78c35bd0c6c76843ede5ad5f
+  metadata.gz: d80a94016fbb0777ec115d2aef9389b6504cc8cdf5e2c43358f563365dc13596f9128e2cb83a2ba43994d7d757cf18fa3cfeaa10a8f93ac9113fb5cc1579f2a9
+  data.tar.gz: c7723d03cea1726e6f2f50d8d0478065f55eae232dfe3743b21ba5cd235aa5fd58b5fc8775f83ac876cd052798a1b724eb1315d4a4699bfacea93f701e04d96e

data/NEWS.md

@@ -3,6 +3,7 @@
   * New: Add global RTL layout support
   * New: Add row-specific RTL layout support
   * New: Add auto-clearing for elements using `omega(nth-child)` (works only with simple nth-child arguments due to limited string operations in Sass)
+  * New: `reset-display`, `reset-layout-direction`, and `reset-all` for all your reset needs!
   * Fix: The visual grid no longer blocks user interactions
   * Deprecate: `omega()` will no longer take `$direction` in favor of `row($direction)` or `$default-layout-direction`
 

data/README.md

@@ -1,5 +1,7 @@
 [![Bourbon Neat](http://neat.bourbon.io/images/logotype.svg)](http://thoughtbot.com/neat)
 
+[![Gem Version](https://badge.fury.io/rb/neat.png)](http://badge.fury.io/rb/neat) [![Code Climate](https://codeclimate.com/github/thoughtbot/neat.png)](https://codeclimate.com/github/thoughtbot/neat)
+
 **Neat** is an open source fluid grid framework built on top of [Bourbon](http://bourbon.io) with the aim of being easy enough to use out of the box and flexible enough to customize down the road.
 
 
@@ -94,8 +96,8 @@ $grid-columns: 10;
 $max-width: em(1088);
 
 // Define your breakpoints
-$mobile: new-breakpoint(max-width 480px 4);
 $tablet: new-breakpoint(max-width 768px 8);
+$mobile: new-breakpoint(max-width 480px 4);
 ```
 
 See the [docs](http://neat.bourbon.io/docs/#variables) for a full list of settings.

data/app/assets/stylesheets/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;
     }
   }

data/app/assets/stylesheets/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;
+}

data/app/assets/stylesheets/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);
 

data/app/assets/stylesheets/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;
+      }
     }
   }
 }

data/lib/neat/version.rb

@@ -1,3 +1,3 @@
 module Neat
-  VERSION = '1.3.0'
+  VERSION = '1.4.0'
 end

data/spec/neat/columns_spec.rb

@@ -42,12 +42,22 @@ describe "@include span-columns()" do
       expect('.span-columns-table').to have_rule('display: table-cell')
     end
 
-    it "sets padding in percentage" do
-      expect('.span-columns-table').to have_rule('padding-right: 2.35765%')
+    it "sets padding evenly between table cells" do
+      expect('.span-columns-table').to have_rule('padding-right: 1.17883%')
+    end
+  end
+
+  context "with argument (collapse)" do
+    it "appends gutter width to column width" do
+      expect('.span-columns-collapse').to have_rule('width: 51.17883%')
+    end
+
+    it "removes the next gutter" do
+      expect('.span-columns-collapse').to_not have_rule('margin-right')
     end
 
-    it "substracts gutter from width of last element" do
-      expect('.span-columns-table:last-child').to have_rule('width: 48.82117%')
+    it "removes gutter percentage from the width of the last child" do
+      expect('.span-columns-collapse:last-child').to have_rule('width: 48.82117%')
     end
   end
 end

data/test/span-columns.scss

@@ -9,9 +9,13 @@
 }
 
 .span-columns-table {
-  @include span-columns(6, table);
+  @include span-columns(2, table);
 }
 
 .span-columns-inline-block {
   @include span-columns(6, inline-block);
 }
+
+.span-columns-collapse {
+  @include span-columns(6, collapse);
+}

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: neat
 version: !ruby/object:Gem::Version
-  version: 1.3.0
+  version: 1.4.0
 platform: ruby
 authors:
 - Kyle Fiedler
@@ -10,7 +10,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-05-08 00:00:00.000000000 Z
+date: 2013-08-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass