singularitygs 1.4.0 → 1.5.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: abb9b77eb89564812ea18968e3d9845d394843de
-  data.tar.gz: 31191e29db09bf70faa60e326e50ef4894ad4ae6
+  metadata.gz: 13d24083bfaf80520aa48a26f7dee312d3efdd00
+  data.tar.gz: 812438c2a6fd732eb1bb06d026b3a9a6513656c9
 SHA512:
-  metadata.gz: 89e8cbecaa1780b586c876573d0780a401b7f527559e966c728444247a0df838f32d73eb6ae52d712fee059fc6c45376d344fffa1e5f7d7bf764eaa0033848bb
-  data.tar.gz: b0facd16278b69eb818105f900d4330fa2b561868c68950504db428d1d79e6dfc0dbe5f080b692e621915abdb0e39a01033dc9c3cc0b354b70de9a5c061db6e3
+  metadata.gz: fa7793a362cb1c5e078c2aa50a32cc57fddbb0db08588845c317e94aafc3b6ef58f9fce315023250e566946c2565184f6c26548ad4f4bf9edfed72e72d902cf2
+  data.tar.gz: c536c6256fbe591e0175ddabf1092ad80d6ec6db0688539b0d5af81a85755fe600a7c8b8132fcd8ff406fbd277690f5cbb371f7cf28c4a25aabdc97f5bb11c25

data/lib/singularitygs.rb

@@ -12,6 +12,6 @@ else
 end
 
 module SingularityGS
-  VERSION = "1.4.0"
-  DATE = "2014-08-23"
+  VERSION = "1.5.0"
+  DATE = "2015-01-17"
 end

data/stylesheets/_singularitygs.scss

@@ -12,6 +12,7 @@ $Singularity-Settings: (
   'include clearfix': false,
   'background grid color': chocolate,
   'asymmetric output': 'isolation',
+  'calc include min-width': true,
   'debug': false
 );
 

data/stylesheets/singularitygs/_api.scss

@@ -1,5 +1,6 @@
 @import "api/float";
 @import "api/isolation";
+@import "api/calc";
 
 //////////////////////////////
 // Master Grid Span mixin

data/stylesheets/singularitygs/api/_calc.scss

@@ -0,0 +1,201 @@
+@function output-calc($Span-Map) {
+  // Set up Left/Right maps
+  $Return: ();
+
+  $Span: map-get($Span-Map, 'span');
+  $Location: map-get($Span-Map, 'location');
+
+  $Grid: map-get($Span-Map, 'grid');
+  $Gutter: map-get($Span-Map, 'gutter');
+  $Style: map-get($Span-Map, 'style');
+
+  @if unitless($Gutter) {
+    @error "Calc output style uses fixed gutters (gutters with units). Please define fixed gutters to use calc";
+    @return $Return;
+  }
+
+  @if type-of($Grid) == 'number' {
+    @error "Calc output style is designed to be used with asymmetric grids, especially with a mix of fixed and fluid columns. Please define an asymmetric grid or use another output style.";
+  }
+
+  $Start-Row: map-get($Span-Map, 'start row');
+  $End-Row: map-get($Span-Map, 'end row');
+
+  $Split-Gutter: map-get($Span-Map, 'split gutter');
+
+  $Direction: map-get($Span-Map, 'direction');
+  $Options: map-get($Span-Map, 'options');
+
+  $Dir: $Direction;
+  $Opp: opposite-direction($Dir);
+
+  $Width: '';
+  $Margin: null;
+  $Min-Width: '(';
+
+  $Fixed: ();
+  $Fluid: ();
+  $Fixed-Totals: ('px': 0, 'em': 0, '%': 0);
+  $Gutter-Totals: if(str-index($Style, 'split'), $Gutter * length($Grid), $Gutter * (length($Grid) - 1));
+  $Fluid-Totals: 0;
+  $Fluid-Fixed-Sum: '';
+  $Single-Fluid: '';
+
+  @for $i from 1 through length($Grid) {
+    $Item: nth($Grid, $i);
+    @if not unitless($Item) {
+      $Fixed: map-merge($Fixed, ($i: $Item));
+    }
+    @else {
+      $Fluid: map-merge($Fluid, ($i: $Item));
+    }
+  }
+
+  @each $k, $v in $Fixed {
+    $Unit: unit($v);
+    $Running: map-get($Fixed-Totals, $Unit) + $v;
+    $Fixed-Totals: map-merge($Fixed-Totals, ($Unit: $Running));
+  }
+
+  @each $k, $v in $Fluid {
+    $Fluid-Totals: $Fluid-Totals + $v;
+  }
+
+  @each $k, $v in $Fixed-Totals {
+
+    @if $v != 0 {
+      $Fluid-Fixed-Sum: '#{$Fluid-Fixed-Sum}#{$v} + ';
+    }
+  }
+
+  // Width of a single fluid item, for calc()
+  $Single-Fluid: '((100% - (#{$Fluid-Fixed-Sum}#{$Gutter-Totals})) / (#{$Fluid-Totals}))';
+
+  // Margin Calculation
+  @if not $Start-Row or not $End-Row {
+    @if $Split-Gutter {
+      $Margin: '#{$Gutter / 2} + ';
+    }
+
+    @for $i from 1 to $Location {
+      @if unitless(nth($Grid, $i)) {
+        $Margin: '#{$Margin}(#{$Single-Fluid} * #{nth($Grid, $i)} + #{$Gutter}) + ';
+      }
+      @else {
+        $Margin: '#{$Margin}(#{nth($Grid, $i)} + #{$Gutter}) + ';
+      }
+    }
+  }
+  @if $Margin != null {
+    $Margin: str-slice($Margin, 0, -4);
+  }
+
+
+  // Width Calculation
+  @if $Span == 1 {
+    @if map-has-key($Fixed, $Location) {
+      $Return: map-merge($Return, ('width': map-get($Fixed, $Location)));
+    }
+    @else if map-has-key($Fluid, $Location) {
+      $Math: '(#{$Single-Fluid}) * #{nth($Grid, $Location)}';
+      $Span-Map: ('width': ('webkit': -webkit-calc(#{unquote($Math)}), 'standard': calc(#{unquote($Math)})));
+      $Return: map-merge($Return, $Span-Map);
+    }
+  }
+  @else {
+    $Location-End: $Location + ($Span - 1);
+    $Fixed-Counter: 0;
+    @for $i from $Location through $Location-End {
+      @if unitless(nth($Grid, $i)) {
+        $Width: '#{$Width}(#{$Single-Fluid} * #{nth($Grid, $i)}';
+      }
+      @else {
+        $Fixed-Counter: $Fixed-Counter + 1;
+        $Min-Width: '#{$Min-Width}#{nth($Grid, $i)} + #{$Gutter} + ';
+        $Width: '#{$Width}(#{nth($Grid, $i)}';
+      }
+
+
+      @if $i != $Location-End {
+        $Width: '#{$Width} + #{$Gutter}) + ';
+      }
+      @else {
+        $Min-Width: str-slice($Min-Width, 0, -4);
+        @if $Fixed-Counter == 1 {
+          $Min-Width: '#{$Min-Width} - #{$Gutter}';
+        }
+        $Min-Width: '#{$Min-Width})';
+        $Width: '#{$Width})';
+      }
+    }
+
+    $Min-Map: ('min-width': ('webkit' : -webkit-calc(#{unquote($Min-Width)}), 'standard': calc(#{unquote($Min-Width)}) ));
+    $Span-Map: ('width': ('webkit': -webkit-calc(#{unquote($Width)}), 'standard': calc(#{unquote($Width)}) ) );
+
+    @if sgs-get('calc include min-width') {
+      $Return: map-merge($Return, $Min-Map);
+    }
+    $Return: map-merge($Return, $Span-Map);
+  }
+
+  // Build margins and Floats
+  @if ($End-Row) {
+    $Return: map-merge($Return, ('float': $Opp));
+    $Return: map-merge($Return, ('margin-#{$Dir}': 0));
+
+    @if $Split-Gutter {
+      $Return: map-merge($Return, ('margin-#{$Opp}': $Gutter / 2));
+    }
+    @else {
+      $Return: map-merge($Return, ('margin-#{$Opp}': 0));
+    }
+  }
+  @else {
+    $Return: map-merge($Return, ('float': $Dir));
+    $Return: map-merge($Return, ('margin-#{$Opp}': -100%));
+
+    @if $Start-Row {
+      @if $Split-Gutter {
+        $Return: map-merge($Return, ('margin-#{$Dir}': $Gutter / 2));
+      }
+      @else {
+        $Return: map-merge($Return, ('margin-#{$Dir}': 0));
+      }
+    }
+    @else {
+      $Margin-Map: ('margin-#{$Dir}': ('webkit': -webkit-calc(#{unquote($Margin)}), 'standard': calc(#{unquote($Margin)})));
+      $Return: map-merge($Return, $Margin-Map);
+    }
+  }
+
+  @return $Return;
+}
+
+
+
+//////////////////////////////
+// Happy Syntax for Calc
+//
+// Makes working with Calc easier, as it moves Clear to a 1st class citizen of the mixin, and automatically builds the verbose grid-span mixin call
+//////////////////////////////
+@mixin calc-span($Span, $Location, $clear: false, $grid: false, $gutter: false, $gutter-style: false, $from: false) {
+
+  @if $gutter != false and unitless($gutter) {
+    @warn "Calc output style uses fixed gutters (gutters with units). Please define fixed gutters to use calc";
+  }
+
+  @if $grid != false and type-of($grid) == 'number' {
+    @warn "Calc output style is designed to be used with asymmetric grids, especially with a mix of fixed and fluid columns. Please define an asymmetric grid.";
+  }
+
+  $Options: ();
+  @if $clear {
+    $Options: map-merge($Options, ('clear': $clear));
+  }
+  @if $from {
+    $Options: map-merge($Options, ('from': $from));
+  }
+
+  $Options: if(length($Options) > 0, $Options, null);
+  @include grid-span($Span, $Location, $grid, $gutter, 'calc', $gutter-style, $Options);
+}

data/stylesheets/singularitygs/helpers/_background-grid.scss

@@ -158,6 +158,7 @@
 
 @mixin background-build($columns, $gutters, $gutter-styles, $color) {
   $Background-Map: background-map($columns, $gutters, $gutter-styles);
+  $Display: true;
 
   $Column-Color: $color;
   $Inverse-Column-Color: mix(black, $color, 15%);
@@ -199,32 +200,54 @@
       }
 
       @if $i != $Grid-Count {
-        $Gradient: append($Gradient, ($Loop-Color $Counter-Width, $Loop-Color ($Counter-Width + $Loop-Width)), 'comma');
-        $Counter-Width: $Counter-Width + $Loop-Width;
-        $Gradient: append($Gradient, ($Gutter-Color $Counter-Width, $Gutter-Color ($Counter-Width + $Gutter-Width)), 'comma');
-        $Counter-Width: $Counter-Width + $Gutter-Width;
+        @if unit($Counter-Width) == unit($Loop-Width) {
+          $Gradient: append($Gradient, ($Loop-Color $Counter-Width, $Loop-Color ($Counter-Width + $Loop-Width)), 'comma');
+          $Counter-Width: $Counter-Width + $Loop-Width;
+          $Gradient: append($Gradient, ($Gutter-Color $Counter-Width, $Gutter-Color ($Counter-Width + $Gutter-Width)), 'comma');
+          $Counter-Width: $Counter-Width + $Gutter-Width;
+        }
+        @else {
+          $Display: false;
+        }
+
       }
       @else if $i == 1 {
-        $Gradient: append($Gradient, ($Loop-Color, $Loop-Color $Counter-Width, $Gutter-Color $Counter-Width, $Gutter-Color ($Counter-Width + $Gutter-Width)), 'comma');
-        $Counter-Width: $Counter-Width + $Loop-Width + $Gutter-Width;
+        @if unit($Counter-Width) == unit($Loop-Width) {
+          $Gradient: append($Gradient, ($Loop-Color, $Loop-Color $Counter-Width, $Gutter-Color $Counter-Width, $Gutter-Color ($Counter-Width + $Gutter-Width)), 'comma');
+          $Counter-Width: $Counter-Width + $Loop-Width + $Gutter-Width;
+        }
+        @else {
+          $Display: false;
+        }
+
       }
       @else if $i == $Grid-Count and index($Style, 'split') {
-        $Gradient: append($Gradient, ($Loop-Color $Counter-Width, $Loop-Color ($Counter-Width + $Loop-Width)), 'comma');
-        $Counter-Width: $Counter-Width + $Loop-Width;
-        $Gradient: append($Gradient, ($Gutter-Color $Counter-Width, $Gutter-Color ($Counter-Width + ($Gutter-Width / 2))), 'comma');
+        @if unit($Counter-Width) == unit($Loop-Width) {
+          $Gradient: append($Gradient, ($Loop-Color $Counter-Width, $Loop-Color ($Counter-Width + $Loop-Width)), 'comma');
+          $Counter-Width: $Counter-Width + $Loop-Width;
+          $Gradient: append($Gradient, ($Gutter-Color $Counter-Width, $Gutter-Color ($Counter-Width + ($Gutter-Width / 2))), 'comma');
+        }
+        @else {
+          $Display: false;
+        }
       }
       @else {
         $Gradient: append($Gradient, ($Loop-Color $Counter-Width, $Loop-Color), 'comma');
       }
     }
 
-    @if $bkpt != -1px {
-      @include breakpoint($bkpt) {
+    @if $Display {
+      @if $bkpt != -1px {
+        @include breakpoint($bkpt) {
+          background-image: unquote('linear-gradient(to #{opposite-direction($Direction)}, #{$Gradient})');
+        }
+      }
+      @else {
         background-image: unquote('linear-gradient(to #{opposite-direction($Direction)}, #{$Gradient})');
       }
     }
     @else {
-      background-image: unquote('linear-gradient(to #{opposite-direction($Direction)}, #{$Gradient})');
+      @warn 'Cannot generate a CSS gradient for grid `#{$Grid}` with gutters `#{$Gutter}` and gutter style `#{$Style}`';
     }
   }
 }

data/stylesheets/singularitygs/helpers/_settings.scss

@@ -37,6 +37,10 @@
   $sgs-change: sgs-set($setting, $value);
 }
 
+@mixin sgs-set($setting, $value) {
+  @include sgs-change($setting, $value);
+}
+
 //////////////////////////////
 // Remove Setting
 //////////////////////////////

data/stylesheets/singularitygs/language/_parse-add.scss

@@ -43,7 +43,7 @@
 
       @if length($breakpoint-mq) > 1 {
         @warn "Responsive contexts are not available for `or` queries as which query to use is ambiguous. Please only use single context queries. Context set to -1px.";
-        $parse-mq: 1px;
+        $parse-mq: -1px;
       }
       @else if length($breakpoint-mq) < 1 {
         @warn "No " + if($Mobile-First, 'min-width', 'max-width') + ' context found. Please use a media query with the correct context. Context set to -1px.';
@@ -60,4 +60,4 @@
   }
 
   @return ($parse-find $parse-mq);
-}
+}

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: singularitygs
 version: !ruby/object:Gem::Version
-  version: 1.4.0
+  version: 1.5.0
 platform: ruby
 authors:
 - Scott Kellum
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2014-08-23 00:00:00.000000000 Z
+date: 2015-01-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass
@@ -56,6 +56,7 @@ files:
 - stylesheets/singularitygs/_helpers.scss
 - stylesheets/singularitygs/_language.scss
 - stylesheets/singularitygs/_math.scss
+- stylesheets/singularitygs/api/_calc.scss
 - stylesheets/singularitygs/api/_float.scss
 - stylesheets/singularitygs/api/_isolation.scss
 - stylesheets/singularitygs/grids/_add.scss