Sha256: 15586217b54a3f2388bcad5ee2a0b0ee49a784e92874bc3ff1a8721a9edb7678
Contents?: true
Size: 1.71 KB
Versions: 4
Compression:
Stored size: 1.71 KB
Contents
// PROGRESS BARS
// -------------
// ANIMATIONS
// ----------
// Webkit
@-webkit-keyframes progress-bar-stripes
from
background-position: 0 0
to
background-position: 40px 0
// Firefox
@-moz-keyframes progress-bar-stripes
from
background-position: 0 0
to
background-position: 40px 0
// Spec
@keyframes progress-bar-stripes
from
background-position: 0 0
to
background-position: 40px 0
// THE BARS
// --------
// Outer container
.progress
overflow: hidden
height: 18px
margin-bottom: 18px
+gradient-vertical(#f5f5f5, #f9f9f9)
+box-shadow(inset 0 1px 2px rgba(0, 0, 0, 0.1))
+border-radius(4px)
// Bar of progress
.progress .bar
width: 0%
height: 18px
color: $white
font-size: 12px
text-align: center
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25)
+gradient-vertical(#149bdf, #0480be)
+box-shadow(inset 0 -1px 0 rgba(0, 0, 0, 0.15))
+box-sizing(border-box)
+transition(width 0.6s ease)
// Striped bars
.progress-striped .bar
+gradient-striped(#62c462)
+background-size(40px 40px)
// Call animation for the active one
.progress.active .bar
-webkit-animation: progress-bar-stripes 2s linear infinite
-moz-animation: progress-bar-stripes 2s linear infinite
animation: progress-bar-stripes 2s linear infinite
// COLORS
// ------
// Danger (red)
.progress-danger .bar
+gradient-vertical(#ee5f5b, #c43c35)
.progress-danger.progress-striped .bar
+gradient-striped(#ee5f5b)
// Success (green)
.progress-success .bar
+gradient-vertical(#62c462, #57a957)
.progress-success.progress-striped .bar
+gradient-striped(#62c462)
// Info (teal)
.progress-info .bar
+gradient-vertical(#5bc0de, #339bb9)
.progress-info.progress-striped .bar
+gradient-striped(#5bc0de)
Version data entries
4 entries across 4 versions & 1 rubygems