neat-compass 1.1.0 → 1.2.0

data/stylesheets/neat/_neat.scss

@@ -9,4 +9,12 @@
 @import "grid/global-variables";
 @import "grid/grid";
 @import "grid/omega";
+@import "grid/outer-container";
+@import "grid/span-columns";
+@import "grid/row";
+@import "grid/shift";
+@import "grid/pad";
+@import "grid/fill-parent";
+@import "grid/media";
+@import "grid/to-deprecate";
 @import "grid/visual-grid";

data/stylesheets/neat/grid/_fill-parent.scss

@@ -0,0 +1,7 @@
+@mixin fill-parent() {
+  width: 100%;
+
+  @if $border-box-sizing == false {
+    @include box-sizing(border-box);
+  }
+}

data/stylesheets/neat/grid/_global-variables.scss

@@ -1 +1,5 @@
 $parent-columns: $grid-columns !default;
+$fg-column: $column;
+$fg-gutter: $gutter;
+$fg-max-columns: $grid-columns;
+$container-display-table: false !default;

data/stylesheets/neat/grid/_grid.scss

@@ -3,208 +3,3 @@
     @include box-sizing(border-box);
   }
 }
-
-$fg-column: $column;
-$fg-gutter: $gutter;
-$fg-max-columns: $grid-columns;
-$fg-max-width: $max-width;
-
-// outer wrapper center container
-@mixin outer-container() {
-  @include clearfix;
-  max-width: $fg-max-width;
-  margin: {
-    left: auto;
-    right: auto;
-  }
-}
-
-// Grid span columns
-@mixin span-columns($span: $columns of $container-columns, $display: block) {
-
-  $columns: nth($span, 1);
-  $container-columns: container-span($span);
-
-  @if $container-columns != $grid-columns {
-    $parent-columns: $container-columns;
-  }
-
-  @else {
-    $parent-columns: $grid-columns;
-  }
-
-  @if $display == table {
-    display: table-cell;
-    padding-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns) + flex-gutter($container-columns);
-
-    &:last-child {
-      width: flex-grid($columns, $container-columns);
-    }
-  }
-
-  @else if $display == inline-block {
-    @include inline-block;
-    margin-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns);
-
-    &:last-child {
-      margin-right: 0;
-    }
-  }
-
-  @else {
-    display: block;
-    float: left;
-    margin-right: flex-gutter($container-columns);
-    width: flex-grid($columns, $container-columns);
-
-    &:last-child {
-      margin-right: 0;
-    }
-  }
-}
-
-// Clearfix / row container
-@mixin row($display: block) {
-  @include clearfix;
-  @if $display == table {
-    display: table;
-  }
-
-  @else {
-    display: block;
-  }
-}
-
-// Shift
-@mixin shift($n-columns: 1) {
-  margin-left: $n-columns * flex-grid(1, $parent-columns) + $n-columns * flex-gutter($parent-columns);
-}
-
-
-// Pad
-@mixin pad($padding: flex-gutter()) {
-  $padding-list: null;
-  @each $value in $padding {
-    $value: if($value == 'default', flex-gutter(), $value);
-    $padding-list: join($padding-list, $value);
-  }
-  padding: $padding-list;
-}
-
-// Fill 100% of parent
-@mixin fill-parent() {
-  width: 100%;
-
-  @if $border-box-sizing == false {
-    @include box-sizing(border-box);
-  }
-}
-
-// Media Queries
-@mixin media($query:$feature $value $columns, $total-columns: $grid-columns) {
-
-  @if length($query) == 1 {
-    @media screen and ($default-feature: nth($query, 1)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 2 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 3 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 3);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 4 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 5 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 5);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else {
-    @warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
-  }
-}
-
-// Legacy Mixins
-@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) {
-  @warn "The breakpoint() mixin was renamed to media() in Neat 1.0. Please update your project with the new syntax before the next version bump.";
-
-  @if length($query) == 1 {
-    @media screen and ($default-feature: nth($query, 1)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 2 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 3 {
-    @media screen and (nth($query, 1): nth($query, 2)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 3);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 4 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: $total-columns;
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else if length($query) == 5 {
-    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
-      $default-grid-columns: $grid-columns;
-      $grid-columns: nth($query, 5);
-      @content;
-      $grid-columns: $default-grid-columns;
-    }
-  }
-
-  @else {
-    @warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
-  }
-}

data/stylesheets/neat/grid/_media.scss

@@ -0,0 +1,51 @@
+@mixin media($query:$feature $value $columns, $total-columns: $grid-columns) {
+
+  @if length($query) == 1 {
+    @media screen and ($default-feature: nth($query, 1)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: $total-columns;
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 2 {
+    @media screen and (nth($query, 1): nth($query, 2)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: $total-columns;
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 3 {
+    @media screen and (nth($query, 1): nth($query, 2)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: nth($query, 3);
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 4 {
+    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: $total-columns;
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 5 {
+    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: nth($query, 5);
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else {
+    @warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
+  }
+}

data/stylesheets/neat/grid/_outer-container.scss

@@ -0,0 +1,8 @@
+@mixin outer-container {
+  @include clearfix;
+  max-width: $max-width;
+  margin: {
+    left: auto;
+    right: auto;
+  }
+}

data/stylesheets/neat/grid/_pad.scss

@@ -0,0 +1,8 @@
+@mixin pad($padding: flex-gutter()) {
+  $padding-list: null;
+  @each $value in $padding {
+    $value: if($value == 'default', flex-gutter(), $value);
+    $padding-list: join($padding-list, $value);
+  }
+  padding: $padding-list;
+}

data/stylesheets/neat/grid/_row.scss

@@ -0,0 +1,16 @@
+@mixin row($display: block) {
+  @include clearfix;
+  @if $display == table {
+    display: table;
+    $container-display-table: true;
+  }
+
+  @else {
+    display: block;
+    $container-display-table: false;
+  }
+}
+
+@mixin reset-display {
+  $container-display-table: false;
+}

data/stylesheets/neat/grid/_shift.scss

@@ -0,0 +1,6 @@
+@mixin shift($n-columns: 1) {
+  margin-left: $n-columns * flex-grid(1, $parent-columns) + $n-columns * flex-gutter($parent-columns);
+
+  // Reset nesting context
+  $parent-columns: $grid-columns;
+}

data/stylesheets/neat/grid/_span-columns.scss

@@ -0,0 +1,58 @@
+@mixin span-columns($span: $columns of $container-columns, $display: block) {
+
+  $columns: nth($span, 1);
+  $container-columns: container-span($span);
+  $display-table: false;
+
+  @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;
+  }
+
+  @if $display-table  {
+    display: table-cell;
+    padding-right: flex-gutter($container-columns);
+    width: flex-grid($columns, $container-columns) + flex-gutter($container-columns);
+
+    &:last-child {
+      width: flex-grid($columns, $container-columns);
+      padding-right: 0;
+    }
+  }
+
+  @else if $display == inline-block {
+    @include inline-block;
+    margin-right: flex-gutter($container-columns);
+    width: flex-grid($columns, $container-columns);
+
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+
+  @else {
+    display: block;
+    float: left;
+    margin-right: flex-gutter($container-columns);
+    width: flex-grid($columns, $container-columns);
+
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+}

data/stylesheets/neat/grid/_to-deprecate.scss

@@ -0,0 +1,52 @@
+@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) {
+  @warn "The breakpoint() mixin was renamed to media() in Neat 1.0. Please update your project with the new syntax before the next version bump.";
+
+  @if length($query) == 1 {
+    @media screen and ($default-feature: nth($query, 1)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: $total-columns;
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 2 {
+    @media screen and (nth($query, 1): nth($query, 2)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: $total-columns;
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 3 {
+    @media screen and (nth($query, 1): nth($query, 2)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: nth($query, 3);
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 4 {
+    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: $total-columns;
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else if length($query) == 5 {
+    @media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
+      $default-grid-columns: $grid-columns;
+      $grid-columns: nth($query, 5);
+      @content;
+      $grid-columns: $default-grid-columns;
+    }
+  }
+
+  @else {
+    @warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
+  }
+}

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: neat-compass
 version: !ruby/object:Gem::Version
-  version: 1.1.0
+  version: 1.2.0
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2013-01-09 00:00:00.000000000 Z
+date: 2013-02-19 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: compass
@@ -71,9 +71,17 @@ files:
 - stylesheets/neat/functions/_new-breakpoint.scss
 - stylesheets/neat/functions/_private.scss
 - stylesheets/neat/functions/_px-to-em.scss
+- stylesheets/neat/grid/_fill-parent.scss
 - stylesheets/neat/grid/_global-variables.scss
 - stylesheets/neat/grid/_grid.scss
+- stylesheets/neat/grid/_media.scss
 - stylesheets/neat/grid/_omega.scss
+- stylesheets/neat/grid/_outer-container.scss
+- stylesheets/neat/grid/_pad.scss
+- stylesheets/neat/grid/_row.scss
+- stylesheets/neat/grid/_shift.scss
+- stylesheets/neat/grid/_span-columns.scss
+- stylesheets/neat/grid/_to-deprecate.scss
 - stylesheets/neat/grid/_visual-grid.scss
 - stylesheets/neat/settings/_grid.scss
 - stylesheets/neat/settings/_visual-grid.scss