From: harry <harmanmanchanda182@gmail.com>
Date: Mon, 6 Feb 2017 20:58:15 +0000 (+0530)
Subject: Improved mixin logic: Semantic + Dry Coding
X-Git-Tag: v6.4.0-rc1~23^2~20^2~94
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=93692b1781895c72b44e3d1613a86fc1734a0c39;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Improved mixin logic: Semantic + Dry Coding
---

diff --git a/scss/prototype/_display.scss b/scss/prototype/_display.scss
index 39e4d643c..1973b0776 100644
--- a/scss/prototype/_display.scss
+++ b/scss/prototype/_display.scss
@@ -16,10 +16,14 @@ $prototype-display-classes: (
   none, inline, inline-block, block, table, table-cell
 ) !default;
 
+@mixin display($display) {
+    display: $display !important;
+}
+
 @mixin foundation-prototype-display {
   @each $display in $prototype-display-classes {
     .display-#{$display} {
-      display: $display !important;
+       @include display($display);
     }
   }
 
@@ -30,7 +34,7 @@ $prototype-display-classes: (
         @each $display in $prototype-display-classes {
           @if $size != $-zf-zero-breakpoint {
             .#{$size}-display-#{$display} {
-              display: $display !important;
+              @include display($display);
             }
           }
         }
diff --git a/scss/prototype/_list-style-type.scss b/scss/prototype/_list-style-type.scss
index 4c15ffc49..cabb25a7b 100644
--- a/scss/prototype/_list-style-type.scss
+++ b/scss/prototype/_list-style-type.scss
@@ -22,11 +22,20 @@ $prototype-style-type-ordered-classes: (
   decimal, lower-alpha, lower-latin, lower-roman, upper-alpha, upper-latin, upper-roman
 ) !default;
 
+@mixin style-type-unordered($style-type-unordered) {
+  margin-#{$global-left}: 0;
+  list-style-type: $style-type-unordered;
+}
+
+@mixin style-type-ordered($style-type-ordered) {
+  margin-#{$global-left}: 0;
+  list-style-type: $style-type-ordered;
+}
+
 @mixin list-unordered {
   @each $style-type-unordered in $prototype-style-type-unordered-classes {
     ul.list-#{$style-type-unordered} {
-      margin-#{$global-left}: 0;
-      list-style-type: $style-type-unordered;
+      @include style-type-unordered($style-type-unordered);
     }
   }
 
@@ -37,8 +46,7 @@ $prototype-style-type-ordered-classes: (
         @each $style-type-unordered in $prototype-style-type-unordered-classes {
           @if $size != $-zf-zero-breakpoint {
             ul.#{$size}-list-#{$style-type-unordered} {
-              margin-#{$global-left}: 0;
-              list-style-type: $style-type-unordered;
+              @include style-type-unordered($style-type-unordered);
             }
           }
         }
@@ -50,8 +58,7 @@ $prototype-style-type-ordered-classes: (
 @mixin list-ordered {
   @each $style-type-ordered in $prototype-style-type-ordered-classes {
     ol.list-#{$style-type-ordered} {
-      margin-#{$global-left}: 0;
-      list-style-type: $style-type-ordered;
+      @include style-type-ordered($style-type-ordered);
     }
   }
 
@@ -62,8 +69,7 @@ $prototype-style-type-ordered-classes: (
         @each $style-type-ordered in $prototype-style-type-ordered-classes {
           @if $size != $-zf-zero-breakpoint {
             ol.#{$size}-list-#{$style-type-ordered} {
-              margin-#{$global-left}: 0;
-              list-style-type: $style-type-ordered;
+              @include style-type-ordered($style-type-ordered);
             }
           }
         }
diff --git a/scss/prototype/_overflow.scss b/scss/prototype/_overflow.scss
index 643243e82..b951d6891 100644
--- a/scss/prototype/_overflow.scss
+++ b/scss/prototype/_overflow.scss
@@ -16,16 +16,28 @@ $prototype-overflow-classes: (
   visible, hidden, scroll
 ) !default;
 
+@mixin overflow($overflow) {
+    overflow: $overflow;
+}
+
+@mixin overflow-x($overflow) {
+    overflow-x: $overflow;
+}
+
+@mixin overflow-y($overflow) {
+    overflow-y: $overflow;
+}
+
 @mixin foundation-prototype-overflow {
   @each $overflow in $prototype-overflow-classes {
     .overflow-#{$overflow} {
-      overflow: $overflow;
+      @include overflow($overflow);
     }
     .overflow-x-#{$overflow} {
-      overflow-x: $overflow;
+      @include overflow-x($overflow);
     }
     .overflow-y-#{$overflow} {
-      overflow-y: $overflow;
+      @include overflow-y($overflow);
     }
   }
 
@@ -36,13 +48,13 @@ $prototype-overflow-classes: (
         @each $overflow in $prototype-overflow-classes {
           @if $size != $-zf-zero-breakpoint {
             .#{$size}-overflow-#{$overflow} {
-              overflow: $overflow;
+              @include overflow($overflow);
             }
             .#{$size}-overflow-x-#{$overflow} {
-              overflow-x: $overflow;
+              @include overflow-x($overflow);
             }
             .#{$size}-overflow-y-#{$overflow} {
-              overflow-y: $overflow;
+              @include overflow-y($overflow);
             }
           }
         }
diff --git a/scss/prototype/_position.scss b/scss/prototype/_position.scss
index d7e986a96..fc37e5294 100644
--- a/scss/prototype/_position.scss
+++ b/scss/prototype/_position.scss
@@ -36,16 +36,22 @@ $prototype-position-zindex: 975 !default;
   z-index: $prototype-position-zindex;
 }
 
+@mixin position($position) {
+  position: $position;
+} 
+
 @mixin foundation-prototype-position {
+  // Position: Static, Relative, Fixed, Absolute
   @each $position in $prototype-position-classes {
     .position-#{$position} {
-      position: $position;
+      @include position($position);
     }
   }
+  
+  // Position: Fixed Top, Fixed Bottom
   .position-fixed-top {
     @include position-fixed-top;
   }
-
   .position-fixed-bottom {
     @include position-fixed-bottom;
   }
@@ -58,10 +64,11 @@ $prototype-position-zindex: 975 !default;
         @each $position in $prototype-position-classes {
           @if $size != $-zf-zero-breakpoint {
             .#{$size}-position-#{$position} {
-              position: $position;
+              @include position($position);
             }
           }
         }
+
         // Position: Fixed Top, Fixed Bottom
         @if $size != $-zf-zero-breakpoint {
           .#{$size}-position-fixed-top {
diff --git a/scss/prototype/_text-decoration.scss b/scss/prototype/_text-decoration.scss
index 556d44bb7..205dd9b2e 100644
--- a/scss/prototype/_text-decoration.scss
+++ b/scss/prototype/_text-decoration.scss
@@ -16,10 +16,14 @@ $prototype-text-decoration-classes: (
   overline, underline, line-through
 ) !default;
 
+@mixin text-decoration($decoration) {
+  text-decoration: $decoration;
+} 
+
 @mixin foundation-prototype-text-decoration {
   @each $decoration in $prototype-text-decoration-classes {
     .text-#{$decoration} {
-      text-decoration: $decoration;
+      @include text-decoration($decoration);
     }
   }
 
@@ -30,7 +34,7 @@ $prototype-text-decoration-classes: (
         @each $decoration in $prototype-text-decoration-classes {
           @if $size != $-zf-zero-breakpoint {
             .#{$size}-text-#{$decoration} {
-              text-decoration: $decoration;
+              @include text-decoration($decoration);
             }
           }
         }
diff --git a/scss/prototype/_text-transformation.scss b/scss/prototype/_text-transformation.scss
index 758ee8b4b..a0c690233 100644
--- a/scss/prototype/_text-transformation.scss
+++ b/scss/prototype/_text-transformation.scss
@@ -16,10 +16,14 @@ $prototype-text-transformation-classes: (
   lowercase, uppercase, capitalize
 ) !default;
 
+@mixin text-transform($transformation) {
+  text-transform: $transformation;
+} 
+
 @mixin foundation-prototype-text-transformation {
   @each $transformation in $prototype-text-transformation-classes {
     .text-#{$transformation} {
-      text-transform: $transformation;
+      @include text-transform($transformation);
     }
   }
 
@@ -30,7 +34,7 @@ $prototype-text-transformation-classes: (
         @each $transformation in $prototype-text-transformation-classes {
           @if $size != $-zf-zero-breakpoint {
             .#{$size}-text-#{$transformation} {
-  			      text-transform: $transformation;
+  			      @include text-transform($transformation);
   			    }
           }
         }