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

[improvement] Checkbox: update disabled label color (#1068)

Browse Source
This commit is contained in:
neverland 2018-12-12 16:38:06 +08:00 committed by GitHub
parent 2ca2ced432
commit 35b0a8e510
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 28 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/checkbox/index.less
View File

@ -1,7 +1,5 @@
@import '../common/style/var.less';
@checkbox-size: 20px;
.van-checkbox {
overflow: hidden;
user-select: none;
@ -14,15 +12,15 @@
}
&__icon {
box-sizing: border-box;
display: block;
font-size: 14px;
width: @checkbox-size;
height: @checkbox-size;
border: 1px solid @gray-light;
color: transparent;
font-size: 14px;
text-align: center;
transition: .2s;
box-sizing: border-box;
border: 1px solid @checkbox-border-color;
transition: @checkbox-transition-duration;
&--round {
border-radius: 100%;
@ -30,28 +28,31 @@
&--checked {
color: @white;
border-color: @blue;
background-color: @blue;
border-color: @checkbox-checked-icon-color;
background-color: @checkbox-checked-icon-color;
}
&--disabled {
border-color: @border-color;
background-color: currentColor;
color: @background-color;
border-color: @checkbox-disabled-icon-color;
background-color: @checkbox-disabled-background-color;
}
&--disabled&--checked {
border-color: @border-color;
background-color: @border-color;
color: @checkbox-disabled-icon-color;
}
}
&__label {
margin-left: 10px;
color: @checkbox-label-color;
margin-left: @checkbox-label-margin;
&--left {
margin: 0 10px 0 0;
float: left;
margin: 0 @checkbox-label-margin 0 0;
}
&--disabled {
color: @checkbox-disabled-label-color;
}
&:empty {

2
packages/checkbox/index.wxml
View File

@ -12,7 +12,7 @@
custom-style="line-height: 20px;"
/>
</view>
<view class="van-checkbox__label van-checkbox__label--{{ labelPosition }} label-class" bindtap="onClickLabel">
<view class="label-class {{ utils.bem('checkbox__label', [labelPosition, { disabled }]) }}" bindtap="onClickLabel">
<slot />
</view>
</view>

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

@ -37,6 +37,17 @@
@button-bottom-action-primary-color: @white;
@button-bottom-action-primary-background-color: @red;
// Checkbox
@checkbox-size: 20px;
@checkbox-border-color: @gray-light;
@checkbox-transition-duration: .2s;
@checkbox-label-margin: 10px;
@checkbox-label-color: @text-color;
@checkbox-checked-icon-color: @blue;
@checkbox-disabled-icon-color: @gray;
@checkbox-disabled-label-color: @gray;
@checkbox-disabled-background-color: @border-color;
// Info
@info-size: 16px;
@info-color: @white;