antd-mini
Version:
antd-mini 是支付宝小程序 UI 组件库,遵循 Ant Design 规范。
62 lines (60 loc) • 1.39 kB
text/less
@import (reference) './variable.less';
.ant-progress {
&-line {
display: flex;
flex-direction: row;
align-items: center;
.ant-progress-outer {
background-color: @progress-trail-color;
border-radius: @corner-radius-circle;
height: 16 * @rpx;
overflow: hidden;
flex: 1;
}
.ant-progress-inner {
border-radius: @corner-radius-circle;
transition: width 0.3s;
height: 100%;
position: relative;
background-color: @progress-stroke-color;
&-success {
background-color: @progress-success-color;
}
&-exception {
background-color: @progress-exception-color;
}
}
.ant-progress-indicator {
margin-left: 16 * @rpx;
color: @progress-assist-color;
font-size: 26 * @rpx;
height: 37 * @rpx;
display: flex;
align-items: center;
}
.ant-progress-status-icon {
&-success {
color: @progress-success-color;
}
&-exception {
color: @progress-exception-color;
}
}
}
&-circle {
position: relative;
> canvas {
width: 100%;
height: 100%;
}
.ant-progress-indicator {
font-size: 40 * @rpx;
color: @progress-indicator-color;
position: absolute;
top: 50%;
left: 50%;
transform: translate3d(-50%, -50%, 0);
z-index: 10;
}
}
}