From db524359e1c2b6a2d9aa534cb4443f4bfb88026b Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@buaa.edu.cn>
Date: Wed, 6 Dec 2017 16:02:40 +0800
Subject: [PATCH] [Improvement] Radio & Checkbox disabled color (#383)

---
 docs/demos/views/checkbox.vue      |  5 ++++-
 docs/demos/views/radio.vue         |  2 ++
 packages/vant-css/src/checkbox.css | 10 ++++++----
 packages/vant-css/src/radio.css    |  5 ++++-
 4 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/docs/demos/views/checkbox.vue b/docs/demos/views/checkbox.vue
index 8ad87952a..69e80422d 100644
--- a/docs/demos/views/checkbox.vue
+++ b/docs/demos/views/checkbox.vue
@@ -5,7 +5,8 @@
     </demo-block>
 
     <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 :title="$t('title3')">
@@ -64,6 +65,8 @@ export default {
 
 <style lang="postcss">
 .demo-checkbox {
+  background: #fff;
+
   .van-checkbox {
     margin: 10px 0 0 20px;
   }
diff --git a/docs/demos/views/radio.vue b/docs/demos/views/radio.vue
index 00e242c85..4dbc189ce 100644
--- a/docs/demos/views/radio.vue
+++ b/docs/demos/views/radio.vue
@@ -66,6 +66,8 @@ export default {
 
 <style lang="postcss">
 .demo-radio {
+  background: #fff;
+
   .van-radios {
     padding: 0 20px;
 
diff --git a/packages/vant-css/src/checkbox.css b/packages/vant-css/src/checkbox.css
index 45fcd777d..43753e3ee 100644
--- a/packages/vant-css/src/checkbox.css
+++ b/packages/vant-css/src/checkbox.css
@@ -4,6 +4,7 @@ $van-checkbox-size: 20px;
 
 .van-checkbox {
   overflow: hidden;
+  user-select: none;
 
   .van-icon-success {
     color: $white;
@@ -61,13 +62,14 @@ $van-checkbox-size: 20px;
 
   &--disabled {
     .van-icon-success {
-      border-color: #d1dbe5;
-      background-color: transparent;
+      color: $background-color;
+      border-color: $gray-light;
+      background-color: currentColor;
     }
 
     .van-checkbox__control:checked + .van-icon-success {
-      border-color: #d1dbe5;
-      background-color: #d1dbe5;      
+      border-color: $gray-light;
+      background-color: $gray-light;
     }
   }
 }
diff --git a/packages/vant-css/src/radio.css b/packages/vant-css/src/radio.css
index 47bcbf185..7cfb1182f 100644
--- a/packages/vant-css/src/radio.css
+++ b/packages/vant-css/src/radio.css
@@ -4,6 +4,7 @@ $van-radio-size: 20px;
 
 .van-radio {
   overflow: hidden;
+  user-select: none;
 
   &__input,
   &__label {
@@ -45,7 +46,9 @@ $van-radio-size: 20px;
 
   &--disabled {
     .van-icon {
-      color: #d1dbe5;
+      color: $gray-light;
+      border-radius: 100%;
+      background-color: $background-color;
     }
   }
 }