blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-06 03:58:05 +08:00
Code Issues Projects Releases Wiki Activity

feat(Progress): Progress 组件样式调整 (#2262)

Browse Source
This commit is contained in:
Lindy 2019-11-10 10:34:51 +08:00 committed by neverland
parent b2a1222d2b
commit f77ebec870
2 changed files with 19 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/common/style/var.less
View File

@ -292,6 +292,16 @@
@popup-close-icon-margin: 16px; @popup-close-icon-margin: 16px;
@popup-close-icon-z-index: 1; @popup-close-icon-z-index: 1;
// Progress
@progress-height: 4px;
@progress-background-color: @gray-light;
@progress-pivot-padding: 0 5px;
@progress-color: @blue;
@progress-pivot-font-size: @font-size-xs;
@progress-pivot-line-height: 1.6;
@progress-pivot-background-color: @blue;
@progress-pivot-text-color: @white;
// Radio // Radio
@radio-size: 20px; @radio-size: 20px;
@radio-border-color: @gray-light; @radio-border-color: @gray-light;

16
packages/progress/index.less
View File

@ -3,15 +3,16 @@
.van-progress { .van-progress {
position: relative; position: relative;
height: 4px; .theme(height, '@progress-height');
border-radius: 4px; .theme(border-radius, '@progress-height');
.theme(background, '@gray-light'); .theme(background, '@progress-background-color');
&__portion { &__portion {
position: absolute; position: absolute;
left: 0; left: 0;
height: 100%; height: 100%;
border-radius: inherit; border-radius: inherit;
.theme(background, '@progress-color');
} }
&__pivot { &__pivot {
@ -20,13 +21,14 @@
right: 0; right: 0;
box-sizing: border-box; box-sizing: border-box;
min-width: 2em; min-width: 2em;
padding: 0 5px;
font-size: 10px;
line-height: 1.6;
text-align: center; text-align: center;
word-break: keep-all; word-break: keep-all;
border-radius: 1em; border-radius: 1em;
transform: translateY(-50%); transform: translateY(-50%);
.theme(background-color, '@gray-light'); .theme(color, '@progress-pivot-text-color');
.theme(padding, '@progress-pivot-padding');
.theme(font-size, '@progress-pivot-font-size');
.theme(line-height, '@progress-pivot-line-height');
.theme(background-color, '@progress-pivot-background-color');
} }
} }