Blame view
app/bower_components/bootstrap/less/progress-bars.less
1.88 KB
f986e111b
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
// // Progress bars // -------------------------------------------------- // Bar animations // ------------------------- // WebKit @-webkit-keyframes progress-bar-stripes { from { background-position: 40px 0; } to { background-position: 0 0; } } // Spec and IE10+ @keyframes progress-bar-stripes { from { background-position: 40px 0; } to { background-position: 0 0; } } |
f986e111b
|
20 21 22 23 24 25 26 27 28 |
// Bar itself // ------------------------- // Outer container .progress { overflow: hidden; height: @line-height-computed; margin-bottom: @line-height-computed; background-color: @progress-bg; |
87c93a029
|
29 |
border-radius: @progress-border-radius; |
f986e111b
|
30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
.box-shadow(inset 0 1px 2px rgba(0,0,0,.1)); } // Bar of progress .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; .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15)); .transition(width .6s ease); } // Striped bars |
87c93a029
|
48 49 50 51 52 53 |
// // `.progress-striped .progress-bar` is deprecated as of v3.2.0 in favor of the // `.progress-bar-striped` class, which you just add to an existing // `.progress-bar`. .progress-striped .progress-bar, .progress-bar-striped { |
f986e111b
|
54 55 56 57 58 |
#gradient > .striped(); background-size: 40px 40px; } // Call animation for the active one |
87c93a029
|
59 60 61 62 63 |
// // `.progress.active .progress-bar` is deprecated as of v3.2.0 in favor of the // `.progress-bar.active` approach. .progress.active .progress-bar, .progress-bar.active { |
f986e111b
|
64 65 |
.animation(progress-bar-stripes 2s linear infinite); } |
f986e111b
|
66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 |
// Variations // ------------------------- .progress-bar-success { .progress-bar-variant(@progress-bar-success-bg); } .progress-bar-info { .progress-bar-variant(@progress-bar-info-bg); } .progress-bar-warning { .progress-bar-variant(@progress-bar-warning-bg); } .progress-bar-danger { .progress-bar-variant(@progress-bar-danger-bg); } |