diff options
| author | Martijn Cuppens <[email protected]> | 2019-01-15 01:51:11 +0100 |
|---|---|---|
| committer | Patrick H. Lauke <[email protected]> | 2019-01-15 00:51:11 +0000 |
| commit | f1f740be09fd08e06e4766e5bf987a57b5d51b80 (patch) | |
| tree | fc52bf2a28297c87b6106aab006db841946ae399 /scss | |
| parent | 8eb8b8d3da7cd852a489879752166e013fdd3ace (diff) | |
| download | bootstrap-f1f740be09fd08e06e4766e5bf987a57b5d51b80.tar.xz bootstrap-f1f740be09fd08e06e4766e5bf987a57b5d51b80.zip | |
Make progress animation respect `$enable-transitions` and `prefers-reduced-motion` media query
Make progress animation respect `$enable-transitions` and `prefers-reduced-motion` media query
Diffstat (limited to 'scss')
| -rw-r--r-- | scss/_progress.scss | 19 |
1 files changed, 14 insertions, 5 deletions
diff --git a/scss/_progress.scss b/scss/_progress.scss index 0ac3e0c93..6247abe3f 100644 --- a/scss/_progress.scss +++ b/scss/_progress.scss @@ -1,6 +1,9 @@ -@keyframes progress-bar-stripes { - from { background-position: $progress-height 0; } - to { background-position: 0 0; } +// Disable animation if transitions are disabled +@if $enable-transitions { + @keyframes progress-bar-stripes { + from { background-position: $progress-height 0; } + to { background-position: 0 0; } + } } .progress { @@ -29,6 +32,12 @@ background-size: $progress-height $progress-height; } -.progress-bar-animated { - animation: progress-bar-stripes $progress-bar-animation-timing; +@if $enable-transitions { + .progress-bar-animated { + animation: progress-bar-stripes $progress-bar-animation-timing; + + @media (prefers-reduced-motion: reduce) { + animation: none; + } + } } |