[Improvement] Radio & Checkbox disabled color (#383)

This commit is contained in:
neverland 2017-12-06 16:02:40 +08:00 committed by GitHub
parent 80c2fdc18f
commit db524359e1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 6 deletions

View File

@ -5,7 +5,8 @@
</demo-block> </demo-block>
<demo-block :title="$t('disabled')"> <demo-block :title="$t('disabled')">
<van-checkbox v-model="checkbox2" disabled>{{ $t('checkbox') }} 2</van-checkbox> <van-checkbox :value="false" disabled>{{ $t('checkbox') }} 2</van-checkbox>
<van-checkbox :value="true" disabled>{{ $t('checkbox') }} 2</van-checkbox>
</demo-block> </demo-block>
<demo-block :title="$t('title3')"> <demo-block :title="$t('title3')">
@ -64,6 +65,8 @@ export default {
<style lang="postcss"> <style lang="postcss">
.demo-checkbox { .demo-checkbox {
background: #fff;
.van-checkbox { .van-checkbox {
margin: 10px 0 0 20px; margin: 10px 0 0 20px;
} }

View File

@ -66,6 +66,8 @@ export default {
<style lang="postcss"> <style lang="postcss">
.demo-radio { .demo-radio {
background: #fff;
.van-radios { .van-radios {
padding: 0 20px; padding: 0 20px;

View File

@ -4,6 +4,7 @@ $van-checkbox-size: 20px;
.van-checkbox { .van-checkbox {
overflow: hidden; overflow: hidden;
user-select: none;
.van-icon-success { .van-icon-success {
color: $white; color: $white;
@ -61,13 +62,14 @@ $van-checkbox-size: 20px;
&--disabled { &--disabled {
.van-icon-success { .van-icon-success {
border-color: #d1dbe5; color: $background-color;
background-color: transparent; border-color: $gray-light;
background-color: currentColor;
} }
.van-checkbox__control:checked + .van-icon-success { .van-checkbox__control:checked + .van-icon-success {
border-color: #d1dbe5; border-color: $gray-light;
background-color: #d1dbe5; background-color: $gray-light;
} }
} }
} }

View File

@ -4,6 +4,7 @@ $van-radio-size: 20px;
.van-radio { .van-radio {
overflow: hidden; overflow: hidden;
user-select: none;
&__input, &__input,
&__label { &__label {
@ -45,7 +46,9 @@ $van-radio-size: 20px;
&--disabled { &--disabled {
.van-icon { .van-icon {
color: #d1dbe5; color: $gray-light;
border-radius: 100%;
background-color: $background-color;
} }
} }
} }