Fix Indeterminate Progress Bar animation in Firefox. Fixes #2258

diff --git a/sass/elements/progress.sass b/sass/elements/progress.sass
index 89612f6c217773d9215dc9c9773d1738a8e78670..08e2bcc99b8499a66b12cba7e5ad6c0f001b67f4 100644 (file)
--- a/sass/elements/progress.sass
+++ b/sass/elements/progress.sass
@@ -24,6 +24,19 @@ $progress-indeterminate-duration: 1.5s !default
   &::-ms-fill
     background-color: $progress-value-background-color
     border: none
+  // Colors
+  @each $name, $pair in $colors
+    $color: nth($pair, 1)
+    &.is-#{$name}
+      &::-webkit-progress-value
+        background-color: $color
+      &::-moz-progress-bar
+        background-color: $color
+      &::-ms-fill
+        background-color: $color
+      &:indeterminate
+        background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
+
   &:indeterminate
     animation-duration: $progress-indeterminate-duration
     animation-iteration-count: infinite
@@ -38,18 +51,6 @@ $progress-indeterminate-duration: 1.5s !default
       background-color: transparent
     &::-moz-progress-bar
       background-color: transparent
-  // Colors
-  @each $name, $pair in $colors
-    $color: nth($pair, 1)
-    &.is-#{$name}
-      &::-webkit-progress-value
-        background-color: $color
-      &::-moz-progress-bar
-        background-color: $color
-      &::-ms-fill
-        background-color: $color
-      &:indeterminate
-        background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
 
   // Sizes
   &.is-small