fix flex-end flex-start, lint

Author: adamseckel

.stylintrc

@@ -0,0 +1,45 @@
+{
+  "blocks": false,
+  "brackets": "never",
+  "colons": "never",
+  "colors": "always",
+  "commaSpace": "always",
+  "commentSpace": "always",
+  "cssLiteral": "never",
+  "customProperties": [],
+  "depthLimit": false,
+  "duplicates": true,
+  "efficient": "always",
+  "exclude": [],
+  "extendPref": false,
+  "globalDupe": true,
+  "groupOutputByFile": true,
+  "indentPref": 2,
+  "leadingZero": "never",
+  "maxErrors": false,
+  "maxWarnings": false,
+  "mixed": false,
+  "mixins": [],
+  "namingConvention": "lowercase-dash",
+  "namingConventionStrict": true,
+  "none": "never",
+  "noImportant": true,
+  "parenSpace": "never",
+  "placeholders": "always",
+  "prefixVarsWithDollar": "always",
+  "quotePref": "single",
+  "reporterOptions": {
+    "columns": ["lineData", "severity", "description", "rule"],
+    "columnSplitter": "  ",
+    "showHeaders": false,
+    "truncate": true
+  },
+  "semicolons": "never",
+  "sortOrder": false,
+  "stackedProperties": "never",
+  "trailingWhitespace": "never",
+  "universal": false,
+  "valid": false,
+  "zeroUnits": "never",
+  "zIndexNormalize": 10
+}

flex-attributes.css

@@ -1,6 +1,6 @@
 {
   "name": "flex-attributes",
-  "version": "2.0.6",
+  "version": "2.0.7",
   "description": "A css library that allows you to compose mobile first, adaptive flexbox layouts and grids with attributes.",
   "main": "flex-attributes.css",
   "keywords": [
@@ -18,6 +18,7 @@
     "cssnano": "^3.8.0",
     "gulp": "^3.9.1",
     "gulp-postcss": "^6.2.0",
-    "gulp-stylus": "^2.5.0"
+    "gulp-stylus": "^2.5.0",
+    "stylint": "^1.5.9"
   }
 }

package.json

@@ -33,41 +33,50 @@ $secondary-axis = center start end stretch baseline
   &[data-wrap]
     flex-wrap wrap
 
-  &[wrap="reverse"],
-  &[data-wrap="reverse"]
+  &[wrap='reverse'],
+  &[data-wrap='reverse']
     flex-wrap wrap-reverse
 
   for $alignment in $primary-axis
-    &[data-layout=\"{$alignment}\"],
-    &[layout=\"{$alignment}\"]
-      justify-content $alignment
+    &[data-layout=\'{$alignment}\'],
+    &[layout=\'{$alignment}\']
+      if $alignment == start || $alignment == end
+        justify-content flex-+$alignment
+      else
+        justify-content $alignment
 
   for $primary-alignment in $primary-axis
     for $secondary-alignment in $secondary-axis
-      &[layout=\"{$primary-alignment} {$secondary-alignment}\"],
-      &[data-layout=\"{$primary-alignment} {$secondary-alignment}\"]
-        justify-content $primary-alignment
-        align-items $secondary-alignment
+      &[layout=\'{$primary-alignment} {$secondary-alignment}\'],
+      &[data-layout=\'{$primary-alignment} {$secondary-alignment}\']
+        if $primary-alignment == start || $primary-alignment == end
+          justify-content flex-+$primary-alignment
+        else
+          justify-content $primary-alignment
+        if $secondary-alignment == start || $secondary-alignment == end
+          align-items flex-+$secondary-alignment
+        else
+          align-items $secondary-alignment
 
 for $prop in $primary-axis
-  [data-align=\"{$prop}\"],
-  [align=\"{$prop}\"]
+  [data-align=\'{$prop}\'],
+  [align=\'{$prop}\']
     align-content $prop
 
 [grow],
 [data-grow]
   flex-grow 1
 
-for $num in range(0,10)
-  [grow=\"{$num}\"],
-  [data-grow=\"{$num}\"]
+for $num in range(0, 10)
+  [grow=\'{$num}\'],
+  [data-grow=\'{$num}\']
     flex-grow $num
 
 [shrink],
 [data-shrink]
   flex-shrink 1
 
-for $num in range(0,10)
-  [shrink=\"{$num}\"],
-  [data-shrink=\"{$num}\"]
+for $num in range(0, 10)
+  [shrink=\'{$num}\'],
+  [data-shrink=\'{$num}\']
     flex-shrink $num