Remove prefixing mixins and all use thereof

HubSpot · Sep 2, 2017 · 7834464 · 7834464
1 parent 4dcf318
commit 7834464
Show file tree

Hide file tree

Showing 19 changed files with 247 additions and 578 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -66,7 +66,7 @@ module.exports = function (grunt) {
     postcss: {
       options: {
         processors: [
-          require('autoprefixer')
+          require('autoprefixer')({ cascade: false })
         ]
       },
       dist: {

diff --git a/dist/css/vex-theme-bottom-right-corner.css b/dist/css/vex-theme-bottom-right-corner.css
@@ -1,100 +1,64 @@
-@keyframes vex-slideup {
+@-webkit-keyframes vex-slideup {
   0% {
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0);
+    transform: translateY(0);
     opacity: 0; }
   1% {
-    transform: translateY(800px);
     -webkit-transform: translateY(800px);
-    -moz-transform: translateY(800px);
-    -ms-transform: translateY(800px);
-    -o-transform: translateY(800px);
+    transform: translateY(800px);
     opacity: 0; }
   2% {
-    transform: translateY(800px);
     -webkit-transform: translateY(800px);
-    -moz-transform: translateY(800px);
-    -ms-transform: translateY(800px);
-    -o-transform: translateY(800px);
+    transform: translateY(800px);
     opacity: 1; }
   100% {
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0);
+    transform: translateY(0);
     opacity: 1; } }
 
-@-webkit-keyframes vex-slideup {
+@keyframes vex-slideup {
   0% {
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0);
+    transform: translateY(0);
     opacity: 0; }
   1% {
-    transform: translateY(800px);
     -webkit-transform: translateY(800px);
-    -moz-transform: translateY(800px);
-    -ms-transform: translateY(800px);
-    -o-transform: translateY(800px);
+    transform: translateY(800px);
     opacity: 0; }
   2% {
-    transform: translateY(800px);
     -webkit-transform: translateY(800px);
-    -moz-transform: translateY(800px);
-    -ms-transform: translateY(800px);
-    -o-transform: translateY(800px);
+    transform: translateY(800px);
     opacity: 1; }
   100% {
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0);
+    transform: translateY(0);
     opacity: 1; } }
 
-@keyframes vex-slidedown {
+@-webkit-keyframes vex-slidedown {
   0% {
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0); }
+    transform: translateY(0); }
   100% {
-    transform: translateY(800px);
     -webkit-transform: translateY(800px);
-    -moz-transform: translateY(800px);
-    -ms-transform: translateY(800px);
-    -o-transform: translateY(800px); } }
+    transform: translateY(800px); } }
 
-@-webkit-keyframes vex-slidedown {
+@keyframes vex-slidedown {
   0% {
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0); }
+    transform: translateY(0); }
   100% {
-    transform: translateY(800px);
     -webkit-transform: translateY(800px);
-    -moz-transform: translateY(800px);
-    -ms-transform: translateY(800px);
-    -o-transform: translateY(800px); } }
+    transform: translateY(800px); } }
 
-@keyframes vex-pulse {
+@-webkit-keyframes vex-pulse {
   0% {
     box-shadow: inset 0 0 0 300px transparent; }
   70% {
     box-shadow: inset 0 0 0 300px rgba(255, 255, 255, 0.25); }
   100% {
     box-shadow: inset 0 0 0 300px transparent; } }
 
-@-webkit-keyframes vex-pulse {
+@keyframes vex-pulse {
   0% {
     box-shadow: inset 0 0 0 300px transparent; }
   70% {
@@ -110,19 +74,11 @@
   .vex.vex-theme-bottom-right-corner .vex-overlay {
     display: none; }
   .vex.vex-theme-bottom-right-corner.vex-closing .vex-content {
-    animation: vex-slidedown 0.5s forwards;
-    -webkit-animation: vex-slidedown 0.5s forwards;
-    -moz-animation: vex-slidedown 0.5s forwards;
-    -ms-animation: vex-slidedown 0.5s forwards;
-    -o-animation: vex-slidedown 0.5s forwards;
-    -webkit-backface-visibility: hidden; }
+    -webkit-animation: vex-slidedown .5s forwards;
+    animation: vex-slidedown .5s forwards; }
   .vex.vex-theme-bottom-right-corner .vex-content {
-    animation: vex-slideup 0.5s;
-    -webkit-animation: vex-slideup 0.5s;
-    -moz-animation: vex-slideup 0.5s;
-    -ms-animation: vex-slideup 0.5s;
-    -o-animation: vex-slideup 0.5s;
-    -webkit-backface-visibility: hidden; }
+    -webkit-animation: vex-slideup .5s;
+    animation: vex-slideup .5s; }
   .vex.vex-theme-bottom-right-corner .vex-content {
     border-radius: 5px 0 0 0;
     font-family: "Helvetica Neue", sans-serif;
@@ -200,21 +156,13 @@
     .vex.vex-theme-bottom-right-corner .vex-dialog-button.vex-last {
       margin-left: 0; }
     .vex.vex-theme-bottom-right-corner .vex-dialog-button:focus {
-      animation: vex-pulse 1.1s infinite;
       -webkit-animation: vex-pulse 1.1s infinite;
-      -moz-animation: vex-pulse 1.1s infinite;
-      -ms-animation: vex-pulse 1.1s infinite;
-      -o-animation: vex-pulse 1.1s infinite;
-      -webkit-backface-visibility: hidden;
+      animation: vex-pulse 1.1s infinite;
       outline: none; }
       @media (max-width: 568px) {
         .vex.vex-theme-bottom-right-corner .vex-dialog-button:focus {
-          animation: none;
           -webkit-animation: none;
-          -moz-animation: none;
-          -ms-animation: none;
-          -o-animation: none;
-          -webkit-backface-visibility: hidden; } }
+          animation: none; } }
     .vex.vex-theme-bottom-right-corner .vex-dialog-button.vex-dialog-button-primary {
       background: #3288e6;
       color: #fff; }

diff --git a/dist/css/vex-theme-default.css b/dist/css/vex-theme-default.css
@@ -1,76 +1,52 @@
-@keyframes vex-flyin {
+@-webkit-keyframes vex-flyin {
   0% {
     opacity: 0;
-    transform: translateY(-40px);
     -webkit-transform: translateY(-40px);
-    -moz-transform: translateY(-40px);
-    -ms-transform: translateY(-40px);
-    -o-transform: translateY(-40px); }
+    transform: translateY(-40px); }
   100% {
     opacity: 1;
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0); } }
+    transform: translateY(0); } }
 
-@-webkit-keyframes vex-flyin {
+@keyframes vex-flyin {
   0% {
     opacity: 0;
-    transform: translateY(-40px);
     -webkit-transform: translateY(-40px);
-    -moz-transform: translateY(-40px);
-    -ms-transform: translateY(-40px);
-    -o-transform: translateY(-40px); }
+    transform: translateY(-40px); }
   100% {
     opacity: 1;
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0); } }
+    transform: translateY(0); } }
 
-@keyframes vex-flyout {
+@-webkit-keyframes vex-flyout {
   0% {
     opacity: 1;
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0); }
+    transform: translateY(0); }
   100% {
     opacity: 0;
-    transform: translateY(-40px);
     -webkit-transform: translateY(-40px);
-    -moz-transform: translateY(-40px);
-    -ms-transform: translateY(-40px);
-    -o-transform: translateY(-40px); } }
+    transform: translateY(-40px); } }
 
-@-webkit-keyframes vex-flyout {
+@keyframes vex-flyout {
   0% {
     opacity: 1;
-    transform: translateY(0);
     -webkit-transform: translateY(0);
-    -moz-transform: translateY(0);
-    -ms-transform: translateY(0);
-    -o-transform: translateY(0); }
+    transform: translateY(0); }
   100% {
     opacity: 0;
-    transform: translateY(-40px);
     -webkit-transform: translateY(-40px);
-    -moz-transform: translateY(-40px);
-    -ms-transform: translateY(-40px);
-    -o-transform: translateY(-40px); } }
+    transform: translateY(-40px); } }
 
-@keyframes vex-pulse {
+@-webkit-keyframes vex-pulse {
   0% {
     box-shadow: inset 0 0 0 300px transparent; }
   70% {
     box-shadow: inset 0 0 0 300px rgba(255, 255, 255, 0.25); }
   100% {
     box-shadow: inset 0 0 0 300px transparent; } }
 
-@-webkit-keyframes vex-pulse {
+@keyframes vex-pulse {
   0% {
     box-shadow: inset 0 0 0 300px transparent; }
   70% {
@@ -82,19 +58,11 @@
   padding-top: 160px;
   padding-bottom: 160px; }
   .vex.vex-theme-default.vex-closing .vex-content {
-    animation: vex-flyout 0.5s forwards;
-    -webkit-animation: vex-flyout 0.5s forwards;
-    -moz-animation: vex-flyout 0.5s forwards;
-    -ms-animation: vex-flyout 0.5s forwards;
-    -o-animation: vex-flyout 0.5s forwards;
-    -webkit-backface-visibility: hidden; }
+    -webkit-animation: vex-flyout .5s forwards;
+    animation: vex-flyout .5s forwards; }
   .vex.vex-theme-default .vex-content {
-    animation: vex-flyin 0.5s;
-    -webkit-animation: vex-flyin 0.5s;
-    -moz-animation: vex-flyin 0.5s;
-    -ms-animation: vex-flyin 0.5s;
-    -o-animation: vex-flyin 0.5s;
-    -webkit-backface-visibility: hidden; }
+    -webkit-animation: vex-flyin .5s;
+    animation: vex-flyin .5s; }
   .vex.vex-theme-default .vex-content {
     border-radius: 5px;
     font-family: "Helvetica Neue", sans-serif;
@@ -170,21 +138,13 @@
     .vex.vex-theme-default .vex-dialog-button.vex-last {
       margin-left: 0; }
     .vex.vex-theme-default .vex-dialog-button:focus {
-      animation: vex-pulse 1.1s infinite;
       -webkit-animation: vex-pulse 1.1s infinite;
-      -moz-animation: vex-pulse 1.1s infinite;
-      -ms-animation: vex-pulse 1.1s infinite;
-      -o-animation: vex-pulse 1.1s infinite;
-      -webkit-backface-visibility: hidden;
+      animation: vex-pulse 1.1s infinite;
       outline: none; }
       @media (max-width: 568px) {
         .vex.vex-theme-default .vex-dialog-button:focus {
-          animation: none;
           -webkit-animation: none;
-          -moz-animation: none;
-          -ms-animation: none;
-          -o-animation: none;
-          -webkit-backface-visibility: hidden; } }
+          animation: none; } }
     .vex.vex-theme-default .vex-dialog-button.vex-dialog-button-primary {
       background: #3288e6;
       color: #fff; }