Fix keyframe-selector-notation issues

jakearchibald · Nov 11, 2022 · 3e5c3d1 · 3e5c3d1
1 parent 47cf1f8
commit 3e5c3d1
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/src/css/components/_ripple.scss b/src/css/components/_ripple.scss
@@ -1,12 +1,12 @@
 @keyframes ripple-pop {
-  from {
+  0% {
     transform: scale(0);
     opacity: 1;
   }
   20% {
     opacity: 1;
   }
-  to {
+  100% {
     transform: scale(1);
     opacity: 0;
   }

diff --git a/src/css/components/_spinner.scss b/src/css/components/_spinner.scss
@@ -10,19 +10,19 @@
   62.5% { transform: rotate(675deg); } // 2.5 * ARCSIZE
   75%   { transform: rotate(810deg); } // 3   * ARCSIZE
   87.5% { transform: rotate(945deg); } // 3.5 * ARCSIZE
-  to    { transform: rotate(1080deg); } // 4   * ARCSIZE
+  100%    { transform: rotate(1080deg); } // 4   * ARCSIZE
 }
 
 @keyframes left-spin {
-  from { transform: rotate(130deg); }
+  0% { transform: rotate(130deg); }
   50% { transform: rotate(-5deg); }
-  to { transform: rotate(130deg); }
+  100% { transform: rotate(130deg); }
 }
 
 @keyframes right-spin {
-  from { transform: rotate(-130deg); }
+  0% { transform: rotate(-130deg); }
   50% { transform: rotate(5deg); }
-  to { transform: rotate(-130deg); }
+  100% { transform: rotate(-130deg); }
 }
 
 @keyframes fade-in {