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

[improvement] Step: add less vars

Browse Source
This commit is contained in:
陈嘉涵 2019-05-16 20:54:19 +08:00
parent aacd168dd6
commit 6160d4e620
3 changed files with 33 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
packages/step/index.less
View File

@ -3,17 +3,22 @@
.van-step {
position: relative;
flex: 1;
color: @gray-dark;
font-size: 14px;
color: @step-text-color;
font-size: @step-font-size;
&__circle {
display: block;
width: 5px;
height: 5px;
background-color: @gray-dark;
width: @step-circle-size;
height: @step-circle-size;
background-color: @step-circle-color;
border-radius: 50%;
}
&__line {
position: absolute;
background-color: @step-line-color;
}
&--horizontal {
float: left;
@ -53,30 +58,28 @@
.van-step__title {
display: inline-block;
margin-left: 3px;
font-size: 12px;
font-size: @step-horizontal-title-font-size;
transform: translateX(-50%);
@media (max-width: 321px) {
font-size: 11px;
font-size: @step-horizontal-title-font-size - 1px;
}
}
.van-step__line {
position: absolute;
top: 30px;
left: 0;
width: 100%;
height: 1px;
background-color: @border-color;
}
.van-step__icon {
display: block;
font-size: 12px;
font-size: @step-icon-size;
}
.van-step--process {
color: @text-color;
color: @step-process-text-color;
}
}
@ -84,7 +87,6 @@
display: block;
float: none;
padding: 10px 10px 10px 0;
font-size: 14px;
line-height: 18px;
&:not(:last-child)::after {
@ -109,18 +111,16 @@
top: 19px;
left: -15px;
z-index: 2;
font-size: 12px;
font-size: @step-icon-size;
line-height: 1;
transform: translate(-50%, -50%);
}
.van-step__line {
position: absolute;
top: 16px;
left: -15px;
width: 1px;
height: 100%;
background-color: @border-color;
}
}
@ -131,11 +131,11 @@
}
&--finish {
color: @text-color;
color: @step-finish-text-color;
.van-step__circle,
.van-step__line {
background-color: @green;
background-color: @step-finish-line-color;
}
}
}

2
packages/steps/index.less
View File

@ -2,7 +2,7 @@
.van-steps {
overflow: hidden;
background-color: @white;
background-color: @steps-background-color;
&--horizontal {
padding: 10px 10px 0;

15
packages/style/var.less
View File

@ -434,6 +434,21 @@
@slider-button-background-color: @white;
@slider-button-box-shadow: 0 1px 2px rgba(0, 0, 0, .5);
// Step
@step-text-color: @gray-dark;
@step-process-text-color: @text-color;
@step-font-size: 14px;
@step-line-color: @border-color;
@step-finish-line-color: @green;
@step-finish-text-color: @text-color;
@step-icon-size: 12px;
@step-circle-size: 5px;
@step-circle-color: @gray-dark;
@step-horizontal-title-font-size: 12px;
// Steps
@steps-background-color: @white;
// Stepper
@stepper-active-color: #e8e8e8;
@stepper-background-color: @active-color;