variable names from camelCased to dash-cased

anthinkingcoder · anthinkingcoder · commit 93caa47877c2 · 2018-07-20T22:24:21.000+08:00
diff --git a/.postcssrc.js b/.postcssrc.js
@@ -6,8 +6,5 @@ module.exports = {
     "postcss-url": {},
     // to edit target browsers: use "browserslist" field in package.json
     "autoprefixer": {},
-    "postcss-write-svg": {},
-    "postcss-px-to-viewport": {
-    }
   }
 }
diff --git a/src/styles/grid.scss b/src/styles/grid.scss
@@ -1,47 +1,47 @@
 $prefix: '.simple';
-$rowPrefix: '#{$prefix}-row';
-$colPrefix: '#{$prefix}-col';
-$flexRowPrefix: '#{$rowPrefix}-flex';
-$flexJustifies: ('start', 'end', 'center', 'space-around', 'space-between');
-$flexAligns: ('top':'flex-start', 'middle':'center', 'bottom':'flex-end');
-$gridCol: 24;
+$row-prefix: '#{$prefix}-row';
+$col-prefix: '#{$prefix}-col';
+$flex-row-prefix: '#{$row-prefix}-flex';
+$flex-justifies: ('start', 'end', 'center', 'space-around', 'space-between');
+$flex-aligns: ('top':'flex-start', 'middle':'center', 'bottom':'flex-end');
+$grid-col: 24;
 @mixin generate-row {
-  #{$rowPrefix} {
+  #{$row-prefix} {
     display: block;
     position: relative;
     margin: 0;
     height: auto;
     zoom: 1;
     overflow: hidden;
   }
-  #{$flexRowPrefix} {
+  #{$flex-row-prefix} {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
   }
-  #{$colPrefix} {
+  #{$col-prefix} {
     display: block;
     position: relative;
   }
-  #{$flexRowPrefix}, #{$flexRowPrefix}, #{$colPrefix} {
+  #{$flex-row-prefix}, #{$flex-row-prefix}, #{$col-prefix} {
     box-sizing: border-box;
   }
-  @each $justify in $flexJustifies {
-    #{$flexRowPrefix}-#{$justify} {
+  @each $justify in $flex-justifies {
+    #{$flex-row-prefix}-#{$justify} {
       justify-content: #{$justify};
     }
   }
-  @each $key, $value in $flexAligns {
-    #{$flexRowPrefix}-#{$key} {
+  @each $key, $value in $flex-aligns {
+    #{$flex-row-prefix}-#{$key} {
       align-items: #{$value};
     }
   }
 }
 
 @mixin generate-float-col($viewport:'') {
-  $cols: '#{$colPrefix}-span#{$viewport}-1';
-  @for $i from 2 through $gridCol {
-    $cols: '#{$cols},#{$colPrefix}-span#{$viewport}-#{$i},';
+  $cols: '#{$col-prefix}-span#{$viewport}-1';
+  @for $i from 2 through $grid-col {
+    $cols: '#{$cols},#{$col-prefix}-span#{$viewport}-#{$i},';
   }
   #{$cols} {
     float: left;
@@ -50,21 +50,21 @@ $gridCol: 24;
 }
 
 @mixin generate-col($viewport: '') {
-  @for $i from 1 through $gridCol {
-    #{$colPrefix}-span#{$viewport}-#{$i} {
-      width: percentage($i / $gridCol);
+  @for $i from 1 through $grid-col {
+    #{$col-prefix}-span#{$viewport}-#{$i} {
+      width: percentage($i / $grid-col);
     }
 
-    #{$colPrefix}-push#{$viewport}-#{$i} {
-      left: percentage($i / $gridCol);
+    #{$col-prefix}-push#{$viewport}-#{$i} {
+      left: percentage($i / $grid-col);
     }
 
-    #{$colPrefix}-pull#{$viewport}-#{$i} {
-      right: percentage($i / $gridCol);
+    #{$col-prefix}-pull#{$viewport}-#{$i} {
+      right: percentage($i / $grid-col);
     }
 
-    #{$colPrefix}-offset#{$viewport}-#{$i} {
-      margin-left: percentage($i / $gridCol);
+    #{$col-prefix}-offset#{$viewport}-#{$i} {
+      margin-left: percentage($i / $grid-col);
     }
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -6,8 +6,5 @@ module.exports = {`
`6`	`6`	`"postcss-url": {},`
`7`	`7`	`// to edit target browsers: use "browserslist" field in package.json`
`8`	`8`	`"autoprefixer": {},`
`9`		`- "postcss-write-svg": {},`
`10`		`- "postcss-px-to-viewport": {`
`11`		`- }`
`12`	`9`	`}`
`13`	`10`	`}`