singularitygs 0.1.alpha → 1.0.alpha.0

data/stylesheets/singularitygs/grid-structure/_grid-layout.scss

@@ -0,0 +1 @@
+

data/stylesheets/singularitygs/grid-structure/_isolation.scss

@@ -0,0 +1,145 @@
+@mixin isolation-clear($dir) {
+  @if $dir == 'left' {
+    clear: right;
+    @if $grouped-styles {
+      margin-right: -100%;
+      float: left;
+    }
+  }
+  @else if $dir == 'right' {
+    clear: left;
+    @if $grouped-styles {
+      margin-left: -100%;
+      float: right;
+    }
+  }
+  @else if $dir == 'both' {
+    clear: both;
+    @if $grouped-styles {
+      margin-right: -100%;
+      float: left;
+    }
+  }
+
+  @include clearfix;
+}
+
+@mixin isolation-common($columns: $columns, $gutter: $gutter, $padding: $padding, $grouped-styles: $grouped-styles) {
+  @include box-sizing(border-box);
+  *behavior: url("../behaviors/box-sizing/boxsizing.php");
+  overflow: hidden;
+  *zoom: 1;
+
+  @if $grouped-styles and $padding != 0 {
+    padding-left: $padding;
+    padding-right: $padding;
+  }
+  @if $grouped-styles == false and $padding != 0 {
+
+  }
+}
+
+
+
+@mixin isolation-section($span, $location: $grid-counter, $columns: $columns, $gutter: $gutter, $padding: $padding, $grouped-styles: $grouped-styles) {
+  width: grid-span($span, $location, $columns, $gutter);
+  // add special left padding
+
+  @include grid-location($span, $location, $columns);
+
+  @if $dir == ltr or $dir == both {
+    @if $grid-location == 'middle' {
+      @if $grouped-styles == false {
+        margin-right: -100%;
+        float: left;
+        @include isolation-clear('left');
+      }
+    }
+    @else if $grid-location == 'first' {
+      @if $grouped-styles == false {
+        margin-right: -100%;
+        float: left;
+        @include isolation-clear('left');
+      }
+      margin-left: 0;
+    }
+    @else if $grid-location == 'last' {
+      float: right;
+      margin-right: 0;
+      @include isolation-clear('left');
+    }
+  }
+  @if $dir == rtl {
+    @if $grid-location == 'middle' {
+      @if $grouped-styles == false {
+        margin-left: -100%;
+        float: right;
+        @include isolation-clear('right');
+      }
+    }
+    @else if grid-location == 'first' {
+      @if $grouped-styles {
+        margin-left: -100%;
+        float: right;
+        @include isolation-clear('right');
+      }
+      margin-right: 0;
+    }
+    @else if $grid-location == 'last' {
+      float: left;
+      margin-left: 0;
+      @include isolation-clear('right');
+    }
+  }
+  @if $dir == both {
+    #{$rtl-selector} & {
+      @if $grid-location == 'middle' {
+        @if $grouped-styles {
+          margin-left: -100%;
+          float: right;
+          @include isolation-clear('right');
+        }
+      }
+      @if $grid-location == 'first' {
+        @if $grouped-styles {
+          margin-left: -100%;
+          float: right;
+          @include isolation-clear('right');
+        }
+        margin-right: 0;
+      }
+      @if $grid-location == 'last' {
+        float: left;
+        margin-left: 0;
+        @include isolation-clear('right');
+      }
+    }
+  }
+  
+  @include push($location - 1, 1, $columns, $gutter);
+
+  // Padding
+  @if type-of($columns) == list {
+    @if type-of(nth($columns, $location)) == list {
+      padding-left: nth(nth($columns, $location), 2);
+    }
+    @else if $padding != 0 {
+      padding-left: $padding;
+    }
+    // add special right padding
+    @if type-of(nth($columns, $location + $span - 1)) == list {
+      padding-right: nth(nth($columns, $location + $span - 1), 2);
+    }
+    @else if $padding != 0 {
+      padding-right: $padding;
+    }
+  }
+}
+
+@mixin isolation-structure($span, $location, $columns, $gutter, $padding) {
+  // common components
+  @include isolation-common($columns, $gutter);
+
+  // specific styles
+  @include isolation-section($span, $location, $columns, $gutter);
+}

data/stylesheets/singularitygs/helpers/_grids.scss

@@ -0,0 +1,34 @@
+// Find column count
+@function column-count($columns) {
+  @if type-of($columns) == number {
+    @return $columns;
+  }
+  @if type-of($columns) == list {
+    @return length($columns);
+  }
+}
+
+// Context of gutters
+@function gutter-context($gutter, $context) {
+  @return $gutter * 100% / $context;
+}
+
+// First or last column?
+$grid-location: '';
+
+@mixin grid-location($span, $location, $columns) {
+  $grid-location: '';
+  
+  @if ($span + $location) > column-count($columns) {
+    $grid-location: 'last';
+  }
+  @else if $location == 1 {
+    $grid-location: 'first';
+  }
+  @else if $location == column-count($columns) {
+    $grid-location: 'last';
+  }
+  @else {
+    $grid-location: 'middle';
+  }
+}

data/stylesheets/singularitygs/helpers/_gridsets.scss

@@ -0,0 +1,362 @@
+//////////////////////////////
+// Find Grid
+//
+// Finds the grid that you are on
+//////////////////////////////
+@function find-grid($user-columns: false) {
+  $length: length($grids);
+  
+  @if $user-columns != false {
+    @return $user-columns;
+  }
+  @else if $length > 0 {
+    $query-min: breakpoint-get-context('min-width');
+    $query-max: breakpoint-get-context('max-width');
+
+    @if $query-min {
+      $query-min: breakpoint-to-base-em($query-min);
+    }
+    @if $query-max {
+      $query-max: breakpoint-to-base-em($query-max);
+    }
+    
+    $ghr: () !default;
+    
+    @if $query-min or $query-max {
+      @for $j from 2 through $length {
+        $ghr: append($ghr, nth($grids, $j), comma);
+      }
+      
+      $ghr: reverse($ghr);
+      
+      $holder-length: length($ghr);
+      
+      @for $i from 1 through $holder-length {
+        $gridholder: nth($ghr, $i);
+
+        $grid-columns: nth($gridholder, 1);
+        $grid-query: nth($gridholder, 2);
+
+        $grid-query: breakpoint-to-base-em($grid-query);
+
+        @if length($gridholder) < 2 {
+          @warn 'Grid #{$gridholder} needs a breakpoint value!';
+        }
+        @else if $grids-mobile-first {
+          @if $query-min and not $query-max {
+            @if $query-min and $query-max {
+              @if $query-min >= $grid-query and $query-max < $grid-query {
+                @return $grid-columns;
+              }
+            }
+            @else if $query-min >= $grid-query {
+              @return $grid-columns;
+            }
+          }
+          @else {
+            @if $query-max < $grid-query {
+              @return $grid-columns;
+            }
+          }
+        }
+        @else {
+          @if $query-min and $query-max {
+            @if $query-min > $grid-query and $query-max <= $grid-query {
+              @return $grid-columns;
+            }
+          }
+          @else if $query-min and not $query-max {
+            @if $query-min > $grid-query {
+              @return $grid-columns;
+            }
+          }
+          @else {
+            @if $query-max <= $grid-query {
+              @return $grid-columns;
+            }
+          }
+        }
+      }
+    }
+    @else {
+      @return nth($grids, 1);
+    }
+  }
+  @else {
+    @return $columns;
+  }
+}
+
+//////////////////////////////
+// Find Gutters
+//
+// Finds the gutter that you should be using
+//////////////////////////////
+@function find-gutter($user-gutter: false) {
+  $length: length($grids);
+  
+  @if $user-gutter != false {
+    @return $user-gutter;
+  }
+  @else if $length > 0 {
+    $query-min: breakpoint-get-context('min-width');
+    $query-max: breakpoint-get-context('max-width');
+
+    @if $query-min {
+      $query-min: breakpoint-to-base-em($query-min);
+    }
+    @if $query-max {
+      $query-max: breakpoint-to-base-em($query-max);
+    }
+    
+    $ghr: () !default;
+    $ghs: () !default;
+    $gutter-length: length($gutters);
+    
+    @if $query-min or $query-max {
+      @for $j from 2 through $length {
+        $ghr: append($ghr, nth($grids, $j), comma);
+        
+        @if $gutter-length == 0 {
+          $ghs: append($ghs, $gutter);
+        }
+        @else if $j > $gutter-length {
+          $ghs: append($ghs, nth($gutters, $gutter-length));
+        }
+        @else {
+          $ghs: append($ghs, nth($gutters, $j));
+        }
+      }
+            
+      $ghr: reverse($ghr);
+      $gthr: reverse($ghs);
+      
+      $holder-length: length($ghr);
+      
+      @for $i from 1 through $holder-length {
+        $gridholder: nth($ghr, $i);
+
+        $grid-columns: nth($gridholder, 1);
+        $grid-query: nth($gridholder, 2);
+
+        $grid-query: breakpoint-to-base-em($grid-query);
+
+        @if length($gridholder) < 2 {
+          @warn 'Grid #{$gridholder} needs a breakpoint value!';
+        }
+        @else if $grids-mobile-first {
+          @if $query-min and not $query-max {
+            @if $query-min and $query-max {
+              @if $query-min >= $grid-query and $query-max < $grid-query {
+                @if $gutter-length > 0 {
+                  @return nth($gthr, $i);
+                }
+                @else {
+                  @return $gutter;
+                }
+              }
+            }
+            @else if $query-min >= $grid-query {
+              @if $gutter-length > 0 {
+                @return nth($gthr, $i);
+              }
+              @else {
+                @return $gutter;
+              }
+            }
+          }
+          @else {
+            @if $query-max < $grid-query {
+              @if $gutter-length > 0 {
+                @return nth($gthr, $i);
+              }
+              @else {
+                @return $gutter;
+              }
+            }
+          }
+        }
+        @else {
+          @if $query-min and $query-max {
+            @if $query-min > $grid-query and $query-max <= $grid-query {
+              @if $gutter-length > 0 {
+                @return nth($gthr, $i);
+              }
+              @else {
+                @return $gutter;
+              }
+            }
+          }
+          @else if $query-min and not $query-max {
+            @if $query-min > $grid-query {
+              @if $gutter-length > 0 {
+                $gutter-span: nth($gthr, $i);
+              }
+              @else {
+                $gutter-span: $gutter;
+              }
+            }
+          }
+          @else {
+            @if $query-max <= $grid-query {
+              @if $gutter-length > 0 {
+                $gutter-span: nth($gthr, $i);
+              }
+              @else {
+                $gutter-span: $gutter;
+              }
+            }
+          }
+        }
+      }
+    }
+    @else {
+      @if length($gutters) > 0 {
+        @return nth($gutters, 1);
+      }
+      @else {
+        @return $gutter;
+      }
+    }
+  }
+  @else {
+    @return $gutter;
+  }
+}
+
+//////////////////////////////
+// Find Padding
+//
+// Finds the padding that you should be using
+//////////////////////////////
+@function find-padding($user-padding: false) {
+  $length: length($grids);
+  
+  @if $user-padding != false {
+    @return $user-padding;
+  }
+  @else if $length > 0 {
+    $query-min: breakpoint-get-context('min-width');
+    $query-max: breakpoint-get-context('max-width');
+
+    @if $query-min {
+      $query-min: breakpoint-to-base-em($query-min);
+    }
+    @if $query-max {
+      $query-max: breakpoint-to-base-em($query-max);
+    }
+    
+    $ghr: () !default;
+    $phs: () !default;
+    $padding-length: length($paddings);
+    
+    @if $query-min or $query-max {
+      @for $j from 2 through $length {
+        $ghr: append($ghr, nth($grids, $j), comma);
+        
+        @if $padding-length == 0 {
+          $phs: append($phs, $padding);
+        }
+        @else if $j > $padding-length {
+          $phs: append($phs, nth($paddings, $padding-length));
+        }
+        @else {
+          $phs: append($phs, nth($paddings, $j));
+        }
+      }
+            
+      $ghr: reverse($ghr);
+      $phr: reverse($phs);
+      
+      $holder-length: length($ghr);
+      
+      @for $i from 1 through $holder-length {
+        $gridholder: nth($ghr, $i);
+
+        $grid-columns: nth($gridholder, 1);
+        $grid-query: nth($gridholder, 2);
+
+        $grid-query: breakpoint-to-base-em($grid-query);
+
+        @if length($gridholder) < 2 {
+          @warn 'Grid #{$gridholder} needs a breakpoint value!';
+        }
+        @else if $grids-mobile-first {
+          @if $query-min and not $query-max {
+            @if $query-min and $query-max {
+              @if $query-min >= $grid-query and $query-max < $grid-query {
+                @if $padding-length > 0 {
+                  @return nth($phr, $i);
+                }
+                @else {
+                  @return $padding;
+                }
+              }
+            }
+            @else if $query-min >= $grid-query {
+              @if $padding-length > 0 {
+                @return nth($phr, $i);
+              }
+              @else {
+                @return $padding;
+              }
+            }
+          }
+          @else {
+            @if $query-max < $grid-query {
+              @if $padding-length > 0 {
+                @return nth($phr, $i);
+              }
+              @else {
+                @return $padding;
+              }
+            }
+          }
+        }
+        @else {
+          @if $query-min and $query-max {
+            @if $query-min > $grid-query and $query-max <= $grid-query {
+              @if $padding-length > 0 {
+                @return nth($phr, $i);
+              }
+              @else {
+                @return $padding;
+              }
+            }
+          }
+          @else if $query-min and not $query-max {
+            @if $query-min > $grid-query {
+              @if $padding-length > 0 {
+                $padding-span: nth($phr, $i);
+              }
+              @else {
+                $padding-span: $padding;
+              }
+            }
+          }
+          @else {
+            @if $query-max <= $grid-query {
+              @if $padding-length > 0 {
+                $padding-span: nth($phr, $i);
+              }
+              @else {
+                $padding-span: $padding;
+              }
+            }
+          }
+        }
+      }
+    }
+    @else {
+      @if length($paddings) > 0 {
+        @return nth($paddings, 1);
+      }
+      @else {
+        @return $padding;
+      }
+    }
+  }
+  @else {
+    @return $padding;
+  }
+}