49 lines
1.5 KiB
Plaintext
49 lines
1.5 KiB
Plaintext
@import './var.less';
|
|
|
|
:root {
|
|
--van-progress-height: @progress-height;
|
|
--van-progress-color: @progress-color;
|
|
--van-progress-background-color: @progress-background-color;
|
|
--van-progress-pivot-padding: @progress-pivot-padding;
|
|
--van-progress-pivot-text-color: @progress-pivot-text-color;
|
|
--van-progress-pivot-font-size: @progress-pivot-font-size;
|
|
--van-progress-pivot-line-height: @progress-pivot-line-height;
|
|
--van-progress-pivot-background-color: @progress-pivot-background-color;
|
|
}
|
|
|
|
.van-progress {
|
|
position: relative;
|
|
height: var(--van-progress-height);
|
|
background: var(--van-progress-background-color);
|
|
border-radius: var(--van-progress-height);
|
|
|
|
&__portion {
|
|
position: absolute;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: var(--van-progress-color);
|
|
border-radius: inherit;
|
|
transform-origin: 0;
|
|
transition: all var(--van-animation-duration-base)
|
|
var(--van-animation-timing-function-enter);
|
|
}
|
|
|
|
&__pivot {
|
|
position: absolute;
|
|
top: 50%;
|
|
box-sizing: border-box;
|
|
min-width: 3.6em;
|
|
padding: var(--van-progress-pivot-padding);
|
|
color: var(--van-progress-pivot-text-color);
|
|
font-size: var(--van-progress-pivot-font-size);
|
|
line-height: var(--van-progress-pivot-line-height);
|
|
text-align: center;
|
|
word-break: keep-all;
|
|
background-color: var(--van-progress-pivot-background-color);
|
|
border-radius: 1em;
|
|
transition: all var(--van-animation-duration-base)
|
|
var(--van-animation-timing-function-enter);
|
|
}
|
|
}
|