Merge pull request #405 from peterramsing/hotfix/gh404_lost_center_gl…

…obal_flex_issue Hotfix/gh404 lost center global flex issue
peterramsing · Mar 1, 2018 · 75dbc58 · 75dbc58
2 parents 2999fe9 + 7dc19d7
commit 75dbc58
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 6 deletions.
diff --git a/lib/lost-center.js b/lib/lost-center.js
@@ -24,6 +24,10 @@ module.exports = function lostCenterDecl(css, settings, result) {
       lostCenterPadding = declArr[1];
     }
 
+    if(lostCenterFlexbox !== 'flex') {
+      lostCenterFlexbox = settings.flexbox;
+    }
+
     if (declArr.indexOf('flex') !== -1) {
       lostCenterFlexbox = 'flex';
     }
@@ -32,6 +36,7 @@ module.exports = function lostCenterDecl(css, settings, result) {
       lostCenterFlexbox = 'no-flex';
     }
 
+    lostCenterFlexbox = lgLogic.parseLostProperty(decl.parent.nodes, 'lost-center-flexbox', lostCenterFlexbox);
     lostCenterPadding = lgLogic.parseLostProperty(decl.parent.nodes, 'lost-center-padding', lostCenterPadding);
     lostColumnRounder = lgLogic.parseLostProperty(decl.parent.nodes, 'lost-column-rounder', lostColumnRounder);
 
@@ -42,12 +47,6 @@ module.exports = function lostCenterDecl(css, settings, result) {
       lostUnit = settings.gridUnit;
     }
 
-    lostCenterFlexbox = lgLogic.parseLostProperty(decl.parent.nodes, 'lost-center-flexbox', lostCenterFlexbox);
-
-    if(lostCenterFlexbox !== 'flex') {
-      lostCenterFlexbox = settings.flexbox;
-    }
-
     if(declArr[0] !== undefined && isFractionValue(declArr[0])) {
       lostCenterMaxWidth = lgLogic.calcValue(declArr[0], lostColumnGutter, lostColumnRounder, lostUnit);
     } else {

diff --git a/test/lost-center.js b/test/lost-center.js
@@ -84,4 +84,19 @@ describe('lost-center', function() {
       'a { display: flex; flex-flow: row wrap; max-width: 1140px; margin-left: auto; margin-right: auto; padding-left: 30px; padding-right: 30px }'
     );
   });
+
+  it('overrides global flex when told to', function() {
+    check(
+      '@lost flexbox flex; .root { lost-center: 600px no-flex; }',
+      '.root { max-width: 600px; margin-left: auto; margin-right: auto; }\n' +
+      '.root:before { content: \'\'; display: table; }\n' +
+      '.root:after { content: \'\'; display: table; clear: both; }'
+    );
+    check(
+      '@lost flexbox flex; .root { lost-center: 600px; lost-center-flexbox: no-flex;}',
+      '.root { max-width: 600px; margin-left: auto; margin-right: auto; }\n' +
+      '.root:before { content: \'\'; display: table; }\n' +
+      '.root:after { content: \'\'; display: table; clear: both; }'
+    );
+  });
 });