diff options
Diffstat (limited to 'assets/vendor/bulma/sass/elements/progress.sass')
-rw-r--r-- | assets/vendor/bulma/sass/elements/progress.sass | 33 |
1 files changed, 30 insertions, 3 deletions
diff --git a/assets/vendor/bulma/sass/elements/progress.sass b/assets/vendor/bulma/sass/elements/progress.sass index f6e8de3..bb43bb6 100644 --- a/assets/vendor/bulma/sass/elements/progress.sass +++ b/assets/vendor/bulma/sass/elements/progress.sass @@ -1,12 +1,15 @@ -$progress-bar-background-color: $border !default +$progress-bar-background-color: $border-light !default $progress-value-background-color: $text !default +$progress-border-radius: $radius-rounded !default + +$progress-indeterminate-duration: 1.5s !default .progress - +block + @extend %block -moz-appearance: none -webkit-appearance: none border: none - border-radius: $radius-rounded + border-radius: $progress-border-radius display: block height: $size-normal overflow: hidden @@ -31,6 +34,24 @@ $progress-value-background-color: $text !default 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 + animation-name: moveIndeterminate + animation-timing-function: linear + background-color: $progress-bar-background-color + background-image: linear-gradient(to right, $text 30%, $progress-bar-background-color 30%) + background-position: top left + background-repeat: no-repeat + background-size: 150% 150% + &::-webkit-progress-bar + background-color: transparent + &::-moz-progress-bar + background-color: transparent + // Sizes &.is-small height: $size-small @@ -38,3 +59,9 @@ $progress-value-background-color: $text !default height: $size-medium &.is-large height: $size-large + +@keyframes moveIndeterminate + from + background-position: 200% 0 + to + background-position: -200% 0 |