1 $progress-bar-background-color: $border-light !default
2 $progress-value-background-color: $text !default
3 $progress-border-radius: $radius-rounded !default
5 $progress-indeterminate-duration: 1.5s !default
10 -webkit-appearance: none
12 border-radius: $progress-border-radius
18 &::-webkit-progress-bar
19 background-color: $progress-bar-background-color
20 &::-webkit-progress-value
21 background-color: $progress-value-background-color
23 background-color: $progress-value-background-color
25 background-color: $progress-value-background-color
28 @each $name, $pair in $colors
31 &::-webkit-progress-value
32 background-color: $color
34 background-color: $color
36 background-color: $color
38 background-image: linear-gradient(to right, $color 30%, $progress-bar-background-color 30%)
41 animation-duration: $progress-indeterminate-duration
42 animation-iteration-count: infinite
43 animation-name: moveIndeterminate
44 animation-timing-function: linear
45 background-color: $progress-bar-background-color
46 background-image: linear-gradient(to right, $text 30%, $progress-bar-background-color 30%)
47 background-position: top left
48 background-repeat: no-repeat
49 background-size: 150% 150%
50 &::-webkit-progress-bar
51 background-color: transparent
53 background-color: transparent
63 @keyframes moveIndeterminate
65 background-position: 200% 0
67 background-position: -200% 0