perf: change margin property, remove @mixin, grid-margin and grid-col-margin

Author: thingsym

docs/index.html

@@ -641,92 +641,6 @@ <h3 class="reference"><span class="small">@include</span> <span class="big">grid
 
 <p>* The same initial value as the property of Flexbox</p>
 
-<h3 class="reference"><span class="small">@include</span> <span class="big">grid-margin</span>($margin: null, $margin-top: null, $margin-right: null, $margin-bottom: null, $margin-left: null);</h3>
-
-<p>Generate the margins around grids.</p>
-
-<table>
-    <tr>
-    <th>Arguments</th>
-    <th>Default value</th>
-    <th>Values</th>
-    <th>Description</th>
-    </tr>
-    <tr>
-    <td>$margin</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-top</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-right</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-bottom</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-left</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-</table>
-
-<h3 class="reference"><span class="small">@include</span> <span class="big">grid-col-margin</span>($margin: null, $margin-top: null, $margin-right: null, $margin-bottom: null, $margin-left: null);</h3>
-
-<p>Generate the margins around columns. Work as alias grid-margin().</p>
-
-<table>
-    <tr>
-    <th>Arguments</th>
-    <th>Default value</th>
-    <th>Values</th>
-    <th>Description</th>
-    </tr>
-    <tr>
-    <td>$margin</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-top</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-right</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-bottom</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-    <tr>
-    <td>$margin-left</td>
-    <td>null</td>
-    <td>null | &lt;<a href="http://www.w3.org/TR/CSS21/box.html#value-def-margin-width" target="_blank">margin-width</a>&gt;</td>
-    <td></td>
-    </tr>
-</table>
-
 <h2 id="Resources">Resources</h2>
 
 <ul>

sass/_flexbox-grid-mixins.scss

@@ -45,7 +45,8 @@ $flexbox-grid-mixins-box-sizing: border-box !default;
 
 	@if $flexbox-grid-mixins-grid-type == skeleton {
 		@if $gutter {
-			@include grid-margin($margin: 0 $gutter / 2 * -1);
+			margin-left: $gutter / 2 * -1;
+			margin-right: $gutter / 2 * -1;
 		}
 	}
 
@@ -167,40 +168,17 @@ $flexbox-grid-mixins-box-sizing: border-box !default;
 
 	@if $gutter and unitless($gutter) == false {
 		@if $flexbox-grid-mixins-grid-type == skeleton {
-				@include grid-col-margin($margin: 0 $gutter / 2 $gutter);
+			margin-left: $gutter / 2;
+			margin-right: $gutter / 2;
 		} @else if $flexbox-grid-mixins-grid-type == margin-offset {
 			@if type-of($last-child) == bool and $last-child == true {
-				@include grid-col-margin($margin-right: 0);
+				margin-right: 0;
 			} @else {
-				@include grid-col-margin($margin-right: $gutter);
+				margin-right: $gutter;
 			}
 
 		}
 	}
 
 	@content;
 }
-
-@mixin grid-margin($margin: null, $margin-top: null, $margin-right: null, $margin-bottom: null, $margin-left: null)
-{
-	@if $margin != null {
-		margin: $margin;
-	}
-	@if $margin-top != null {
-		margin-top: $margin-top;
-	}
-	@if $margin-bottom != null {
-		margin-bottom: $margin-bottom;
-	}
-	@if $margin-left != null {
-		margin-left: $margin-left;
-	}
-	@if $margin-right != null {
-		margin-right: $margin-right;
-	}
-}
-
-@mixin grid-col-margin($margin: null, $margin-top: null, $margin-right: null, $margin-bottom: null, $margin-left: null)
-{
-	@include grid-margin($margin, $margin-top, $margin-right, $margin-bottom, $margin-left);
-}