diff options
Diffstat (limited to 'scss/_progress.scss')
| -rw-r--r-- | scss/_progress.scss | 44 |
1 files changed, 1 insertions, 43 deletions
diff --git a/scss/_progress.scss b/scss/_progress.scss index c2364feee..800138cdc 100644 --- a/scss/_progress.scss +++ b/scss/_progress.scss @@ -17,6 +17,7 @@ width: 100%; height: $spacer-y; // todo: make a new var for this margin-bottom: $spacer-y; + overflow: hidden; // force rounded corners by cropping it } .progress[value] { // Set overall background @@ -37,52 +38,22 @@ } .progress[value]::-moz-progress-bar { background-color: $progress-bar-color; - @include border-left-radius($progress-border-radius); } .progress[value]::-webkit-progress-value { background-color: $progress-bar-color; - @include border-left-radius($progress-border-radius); -} -// Tweaks for full progress bar -.progress[value="100"]::-moz-progress-bar { - @include border-right-radius($progress-border-radius); -} -.progress[value="100"]::-webkit-progress-value { - @include border-right-radius($progress-border-radius); } // Unfilled portion of the bar .progress[value]::-webkit-progress-bar { background-color: $progress-bg; - @include border-radius($progress-border-radius); @include box-shadow($progress-box-shadow); } base::-moz-progress-bar, // Absurd-but-syntactically-valid selector to make these styles Firefox-only .progress[value] { background-color: $progress-bg; - @include border-radius($progress-border-radius); @include box-shadow($progress-box-shadow); } -// IE9 hacks to accompany custom markup. We don't need to scope this via media queries, but I feel better doing it anyway. -@media screen and (min-width:0\0) { - .progress { - background-color: $progress-bg; - @include border-radius($progress-border-radius); - @include box-shadow($progress-box-shadow); - } - .progress-bar { - display: inline-block; - height: $spacer-y; - text-indent: -999rem; // Simulate hiding of value as in native `<progress>` - background-color: $progress-bar-color; - @include border-left-radius($progress-border-radius); - } - .progress[width="100%"] { - @include border-right-radius($progress-border-radius); - } -} - // // Striped @@ -100,13 +71,6 @@ base::-moz-progress-bar, // Absurd-but-syntactically-valid selector to make thes @include gradient-striped(); background-size: $spacer-y $spacer-y; } -// IE9 -@media screen and (min-width:0\0) { - .progress-bar-striped { - @include gradient-striped(); - background-size: $spacer-y $spacer-y; - } -} // @@ -119,12 +83,6 @@ base::-moz-progress-bar, // Absurd-but-syntactically-valid selector to make thes .progress-animated[value]::-moz-progress-bar { animation: progress-bar-stripes 2s linear infinite; } -// IE9 -@media screen and (min-width:0\0) { - .progress-animated .progress-bar-striped { - animation: progress-bar-stripes 2s linear infinite; - } -} // |
