123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081 |
- @-webkit-keyframes progress-bar-stripes {
- from { background-position: 40px 0; }
- to { background-position: 0 0; }
- }
- @keyframes progress-bar-stripes {
- from { background-position: 40px 0; }
- to { background-position: 0 0; }
- }
- .progress {
- overflow: hidden;
- height: $line-height-computed;
- margin-bottom: $line-height-computed;
- background-color: $progress-bg;
- border-radius: $border-radius-base;
- @include box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
- }
- .progress-bar {
- float: left;
- width: 0%;
- height: 100%;
- font-size: $font-size-small;
- line-height: $line-height-computed;
- color: $progress-bar-color;
- text-align: center;
- background-color: $progress-bar-bg;
- @include box-shadow(inset 0 -1px 0 rgba(0,0,0,.15));
- @include transition(width .6s ease);
- }
- .progress-striped .progress-bar {
- @include gradient-striped();
- background-size: 40px 40px;
- }
- .progress.active .progress-bar {
- @include animation(progress-bar-stripes 2s linear infinite);
- }
- .progress-bar-success {
- @include progress-bar-variant($progress-bar-success-bg);
- }
- .progress-bar-info {
- @include progress-bar-variant($progress-bar-info-bg);
- }
- .progress-bar-warning {
- @include progress-bar-variant($progress-bar-warning-bg);
- }
- .progress-bar-danger {
- @include progress-bar-variant($progress-bar-danger-bg);
- }
|