Minor code updates + bugfix to include 0 variations of spacing

furqanfreed · Nov 7, 2014 · d9e67ec · d9e67ec
1 parent c1b9e92
commit d9e67ec
Show file tree

Hide file tree

Showing 9 changed files with 81 additions and 40 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,7 @@
 .DS_Store
 .sass-cache
+gulpfile.js
+node_modules
+package.json
+public
+main.scss
diff --git a/global/_mixins.scss b/global/_mixins.scss
@@ -110,6 +110,9 @@
         } @else if $operator == '/' {
           $amount: str-slice($unit, -1, -1);
           @include rem-sizing(#{$property}-#{$position}, $base-spacing-unit / to-number($amount));
+        } @else {
+          $amount: str-slice($unit, 1, 1);
+          #{$property}-#{$position}: to-number($amount);
         }
       }
     } @else {

diff --git a/patterns/_flag.scss b/patterns/_flag.scss
@@ -71,7 +71,7 @@ $flag-pattern-reversed-enable: true !default;
 
       &__sidebar,
       &__body {
-          vertical-align: middle;
+        @extend %valign;
       }
 
       // .flag__sidebar--bottom

diff --git a/patterns/_grid.scss b/patterns/_grid.scss
@@ -18,34 +18,34 @@
   letter-spacing: -0.36em;                                       // 1
   list-style: none;
   text-rendering: optimizespeed;                                 // 2
-  margin-left: -(calc-rem($base-spacing-unit, $base-font-size)); // 3
+  margin-left: -(calc-em($base-spacing-unit, $base-font-size));  // 3
 }
 
-    // =============================
-    // Core Grid Item Element Styling
-    // =============================
-
-    //
-    // Core Grid Item Element creates a building block to house layout elements.
-    // Example Use - Any element within the page layout will contain this class.
-    //
-    // 1. Letter spacing set to normal, to override cascade from .grid container, and all text values reverted back to defaults.
-    // 2. Cause columns to stack side-by-side.
-    // 3. Align columns to the tops of each other.
-    // 4. Space columns apart.
-    // 5. Add box-sizing to grid items if global variable returns false.
-    //
+// =============================
+// Core Grid Item Element Styling
+// =============================
 
-    .grid__item {
-      letter-spacing: normal;                                      // 1
-      text-rendering: auto;                                        // 1
-      word-spacing: normal;                                        // 1
-      display: inline-block;                                       // 2
-      vertical-align: top;                                         // 3
-      padding-left: calc-rem($base-spacing-unit, $base-font-size); // 4
+//
+// Core Grid Item Element creates a building block to house layout elements.
+// Example Use - Any element within the page layout will contain this class.
+//
+// 1. Letter spacing set to normal, to override cascade from .grid container, and all text values reverted back to defaults.
+// 2. Cause columns to stack side-by-side.
+// 3. Align columns to the tops of each other.
+// 4. Space columns apart.
+// 5. Add box-sizing to grid items if global variable returns false.
+//
 
-      @if $global-box-sizing == false {
-          box-sizing: border-box;                                  // 5
-      }
+  .grid__item {
+    letter-spacing: normal;                                      // 1
+    text-rendering: auto;                                        // 1
+    word-spacing: normal;                                        // 1
+    display: inline-block;                                       // 2
+    vertical-align: top;                                         // 3
+    padding-left: calc-em($base-spacing-unit, $base-font-size);  // 4
 
+    @if $global-box-sizing == false {
+        box-sizing: border-box;                                  // 5
     }
+
+  }
diff --git a/utilities/format-model/_position.scss b/utilities/format-model/_position.scss
@@ -14,9 +14,18 @@ $_viewport-position-enable: true !default;
 //
 
 @if ($_position-enable) {
-	.position-static,   %position-static   { position: static   !important }
-	.position-relative, %position-relative { position: relative !important }
-	.position-absolute, %position-absolute { position: absolute !important }
+	.position-static,
+	%position-static   {
+		position: static   !important
+	}
+	.position-relative,
+	%position-relative {
+		position: relative !important
+	}
+	.position-absolute,
+	%position-absolute {
+		position: absolute !important
+	}
 }
 
 // =============================

diff --git a/utilities/generic/_clearfix.scss b/utilities/generic/_clearfix.scss
@@ -14,7 +14,7 @@ $_clearfix-enable: true !default;
 
 	  &:before,
 	  &:after {
-	    content: " ";
+	    content: "";
 	    display: table;
 	  }
 

diff --git a/utilities/text/_text-alignment.scss b/utilities/text/_text-alignment.scss
@@ -12,9 +12,18 @@ $_viewport-text-alignment-enable: true !default;
 // Un-namespaced Classes are to be used globally when an elements alignment is consistant across all viewports.
 
 @if ($_text-alignment-enable) {
-	.text-left,   %text-left   { text-align: left   !important }
-	.text-right,  %text-right  { text-align: right  !important }
-	.text-center, %text-center { text-align: center !important }
+	.text-left,
+	%text-left   {
+		text-align: left   !important
+	}
+	.text-right,
+	%text-right  {
+		text-align: right  !important
+	}
+	.text-center,
+	%text-center {
+		text-align: center !important
+	}
 }
 
 // =============================

diff --git a/utilities/text/_text-style.scss b/utilities/text/_text-style.scss
@@ -11,23 +11,38 @@ $_text-transform-enable: true !default;
 // =============================
 
 @if ($_text-weight-enable) {
-	.text-bold,   %text-bold   { font-weight: bold   !important }
-	.text-normal, %text-normal { font-weight: normal !important }
+	.text-bold,
+	%text-bold   {
+		font-weight: bold   !important
+	}
+	.text-normal,
+	%text-normal {
+		font-weight: normal !important
+	}
 }
 
 // =============================
 // Core Text Style Utility Helper Classes
 // =============================
 
 @if ($_text-style-enable) {
-	.text-italic, %text-italic { font-style: italic !important }
+	.text-italic,
+	%text-italic {
+		font-style: italic !important
+	}
 }
 
 // =============================
 // Core Text Transform Utility Helper Classes
 // =============================
 
 @if ($_text-transform-enable) {
-	.text-caps,      %text-caps      { text-transform: uppercase  !important  }
-	.text-smallcaps, %text-smallcaps { font-variant:   small-caps !important  }
+	.text-caps,
+	%text-caps      {
+		text-transform: uppercase  !important
+	}
+	.text-smallcaps,
+	%text-smallcaps {
+		font-variant:   small-caps !important
+	}
 }
diff --git a/utilities/text/_text-truncate.scss b/utilities/text/_text-truncate.scss
@@ -18,10 +18,10 @@ $_text-truncate-enable: true !default;
 @if ($_text-truncate-enable) {
 	.text-truncate,
 	%text-truncate {
-	    max-width: 100%;              // 1
+	    max-width: 100%;                    // 1
 	    overflow: hidden !important;
 	    text-overflow: ellipsis !important;
 	    white-space: nowrap !important;
-	    word-wrap: normal !important; // 2
+	    word-wrap: normal !important;       // 2
 	}
 }