Organize existing .progress styles

This commit is contained in:
Chris Rebert 2015-12-23 22:35:45 -07:00
parent 68061027b6
commit a96e522d6a

View File

@ -28,16 +28,13 @@
// Set overall border radius // Set overall border radius
@include border-radius($border-radius); @include border-radius($border-radius);
} }
// Filled-in portion of the bar
.progress[value]::-ms-fill { .progress[value]::-ms-fill {
background-color: $progress-bar-color; 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 {
background-color: $progress-bg;
@include border-radius($border-radius);
@include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
}
.progress[value]::-webkit-progress-value { .progress[value]::-webkit-progress-value {
background-color: $progress-bar-color; background-color: $progress-bar-color;
border-top-left-radius: $border-radius; border-top-left-radius: $border-radius;
@ -48,6 +45,13 @@
border-bottom-right-radius: $border-radius; border-bottom-right-radius: $border-radius;
} }
// Unfilled portion of the bar
.progress[value]::-webkit-progress-bar {
background-color: $progress-bg;
@include border-radius($border-radius);
@include box-shadow(inset 0 .1rem .1rem rgba(0,0,0,.1));
}
// Firefox styles must be entirely separate or it busts Webkit styles. // Firefox styles must be entirely separate or it busts Webkit styles.
// //
// Commented out for now because linter. // Commented out for now because linter.