update Progress style
This commit is contained in:
parent
6e1f8f4063
commit
724a607712
2 changed files with 24 additions and 0 deletions
|
@ -5,6 +5,12 @@
|
|||
<Progress vertical :percent="65" status="wrong"></Progress>
|
||||
<Progress vertical :percent="100"></Progress>
|
||||
<Progress vertical :percent="25" hide-info></Progress>
|
||||
|
||||
<Progress :percent="25"></Progress>
|
||||
<Progress :percent="45" status="active"></Progress>
|
||||
<Progress :percent="65" status="wrong"></Progress>
|
||||
<Progress :percent="100"></Progress>
|
||||
<Progress :percent="25" hide-info></Progress>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
|
@ -89,6 +89,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
&-vertical&-active{
|
||||
.@{progress-prefix-cls}-bg:before {
|
||||
top: auto;
|
||||
animation: ivu-progress-active-vertical 2s @ease-in-out infinite;
|
||||
}
|
||||
}
|
||||
|
||||
&-wrong {
|
||||
.@{progress-prefix-cls}-bg {
|
||||
background-color: @error-color;
|
||||
|
@ -118,3 +125,14 @@
|
|||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivu-progress-active-vertical {
|
||||
0% {
|
||||
opacity: .3;
|
||||
height: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue