vuesax
Version:
Framework Components for Vue js
46 lines (41 loc) • 905 B
text/stylus
.vs-progress--indeterminate
position: absolute;
width: 0%;
height: 100%;
left: -100%;
top: 0px;
border-radius: 2px;
animation: indeterminate 1.200s ease infinite;
border-radius: 20px;
@keyframes indeterminate {
0% {
width: 30%;
left: -40%;
}
60% {
left: 100%;
width:100%;
}
100% {
left: 100%;
width:0%;
}
}
.vs-progress--background
width: 100%;
border-radius: 18px;
background-color: rgba(0,0,0,.06)
z-index: 50;
position: relative;
display: inline-block;
overflow: hidden;
.vs-progress--foreground
z-index: 100;
height: 100%;
border-radius: 18px;
transition: all .5s ease;
for colorx, i in $vs-colors
.vs-progress-{colorx}
background: getColor(colorx, .1)
.vs-progress--foreground,.vs-progress--indeterminate
background: getColor(colorx, 1)