mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-23 09:52:57 +08:00
[Improvement] Radio & Checkbox disabled color (#383)
This commit is contained in:
parent
80c2fdc18f
commit
db524359e1
@ -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;
|
||||||
}
|
}
|
||||||
|
@ -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;
|
||||||
|
|
||||||
|
@ -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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user