fix(prefixer): add more webkit prefixes

Author: karlhaas

src/lib/utils/auto-prefixer.ts

@@ -22,14 +22,24 @@ export function applyCssPrefixes(target) {
             '-webkit-flex',
             'flex'
           ];
+        } else if (value === 'inline-flex') {
+          target['display'] = [
+            '-webkit-inline-box',
+            '-moz-inline-box',
+            '-ms-inline-flexbox',
+            '-webkit-inline-flex',
+            'inline-flex'
+          ];
         } else {
           target['display'] = value;
         }
         break;
 
       case 'flex':
         target['-ms-flex'] = value;
+        target['-webkit-flex'] = value;
         target['-webkit-box-flex'] = value.split(" ")[0];
+        target['-moz-box-flex'] = value.split(" ")[0];
         break;
 
       case 'flex-direction':
@@ -38,11 +48,14 @@ export function applyCssPrefixes(target) {
         target['-ms-flex-direction'] = value;
         target['-webkit-flex-direction'] = value;
         target['-webkit-box-orient'] = toBoxOrient(value);
+        target['-moz-box-orient'] = toBoxOrient(value);
         target['-webkit-box-direction'] = toBoxDirection(value);
+        target['-moz-box-direction'] = toBoxDirection(value);
         break;
 
       case 'flex-wrap':
         target['-ms-flex-wrap'] = value;
+        target['-webkit-flex-wrap'] = value;
         break;
 
       case 'flex-grow':
@@ -57,32 +70,44 @@ export function applyCssPrefixes(target) {
         target['-webkit-flex-basis'] = value;
         break;
 
+      case 'flex-flow':
+        target['-webkit-flex-flow'] = value;
+        break;
+
       case 'order':
         if (isNaN(value)) {
           value = "0";
         }
         target['order'] = value;
+        target['-webkit-order'] = value;
         target['-ms-flex-order'] = value;
+        target['-moz-box-ordinal-group'] = toBoxOrdinal(value);
         target['-webkit-box-ordinal-group'] = toBoxOrdinal(value);
         break;
 
       case 'justify-content':
         target['-ms-flex-pack'] = toBoxValue(value);
         target['-webkit-box-pack'] = toBoxValue(value);
+        target['-moz-box-pack'] = toBoxValue(value);
+        target['-webkit-justify-content'] = value;
         break;
 
       case 'align-items':
         target['-ms-flex-align'] = toBoxValue(value);
         target['-webkit-box-align'] = toBoxValue(value);
+        target['-moz-box-align'] = toBoxValue(value);
+        target['-webkit-align-items'] = toBoxValue(value);
         break;
 
       case 'align-self':
         target['-ms-flex-item-align'] = toBoxValue(value);
+        target['-webkit-align-self'] = value;
         break;
 
       case 'align-content':
         target['-ms-align-content'] = toAlignContentValue(value);
         target['-ms-flex-line-pack'] = toAlignContentValue(value);
+        target['-webkit-align-content'] = value;
         break;
     }
   }