mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-15 01:55:46 +02:00
Code Issues Releases Wiki Activity

Merge pull request #18622 from twbs/fix-18535

Browse Source 
Use variables for .progress base colors
/fyi @mdo
This commit is contained in:
Chris Rebert
2015-12-21 11:12:59 -07:00
parent 4afc0a3c4a 646580a919
commit d756e12f78
2 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
scss/_progress.scss
View File

@@ -20,7 +20,7 @@
} }
.progress[value] { .progress[value] {
// Set overall background // Set overall background
background-color: #eee; background-color: $progress-bg;
// Remove Firefox and Opera border // Remove Firefox and Opera border
border: 0; border: 0;
// Reset the default appearance // Reset the default appearance
@@ -29,17 +29,17 @@
@include border-radius($border-radius); @include border-radius($border-radius);
} }
.progress[value]::-ms-fill { .progress[value]::-ms-fill {
background-color: #0074d9; background-color: $progress-bar-color;
// Remove right-hand border of value bar from IE10+/Edge // Remove right-hand border of value bar from IE10+/Edge
border: 0; border: 0;
} }
.progress[value]::-webkit-progress-bar { .progress[value]::-webkit-progress-bar {
background-color: #eee; background-color: $progress-bg;
@include border-radius($border-radius); @include border-radius($border-radius);
@include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1)); @include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
} }
.progress[value]::-webkit-progress-value { .progress[value]::-webkit-progress-value {
background-color: #0074d9; background-color: $progress-bar-color;
border-top-left-radius: $border-radius; border-top-left-radius: $border-radius;
border-bottom-left-radius: $border-radius; border-bottom-left-radius: $border-radius;
} }
@@ -54,12 +54,12 @@
// //
// $-moz-document url-prefix() { // $-moz-document url-prefix() {
// .progress[value] { // .progress[value] {
// background-color: #eee; // background-color: $progress-bg;
// .border-radius($border-radius); // .border-radius($border-radius);
// .box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1)); // .box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
// } // }
// .progress[value]::-moz-progress-bar { // .progress[value]::-moz-progress-bar {
// background-color: #0074d9; // background-color: $progress-bar-color;
// border-top-left-radius: $border-radius; // border-top-left-radius: $border-radius;
// border-bottom-left-radius: $border-radius; // border-bottom-left-radius: $border-radius;
// } // }
@@ -78,7 +78,7 @@
// IE9 hacks to accompany custom markup. We don't need to scope this via media queries, but I feel better doing it anyway. // 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) { @media screen and (min-width:0\0) {
.progress { .progress {
background-color: #eee; background-color: $progress-bg;
@include border-radius($border-radius); @include border-radius($border-radius);
@include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1)); @include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
} }
@@ -86,7 +86,7 @@
display: inline-block; display: inline-block;
height: $spacer-y; height: $spacer-y;
text-indent: -999rem; // Simulate hiding of value as in native `<progress>` text-indent: -999rem; // Simulate hiding of value as in native `<progress>`
background-color: #0074d9; background-color: $progress-bar-color;
border-top-left-radius: $border-radius; border-top-left-radius: $border-radius;
border-bottom-left-radius: $border-radius; border-bottom-left-radius: $border-radius;
} }

4
scss/_variables.scss
View File

@@ -581,8 +581,8 @@ $alert-danger-border: $state-danger-border !default;
// Progress bars // Progress bars
$progress-bg: #f5f5f5 !default; $progress-bg: #eee !default;
$progress-bar-color: #fff !default; $progress-bar-color: #0074d9 !default;
$progress-border-radius: $border-radius !default; $progress-border-radius: $border-radius !default;
$progress-bar-bg: $brand-primary !default; $progress-bar-bg: $brand-primary !default;