From 14987857ca659f3a9f564802e371cceffdd7a3cf Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Tue, 2 Nov 2021 19:54:00 +0800
Subject: [PATCH] chore: adjust some css vars for dark mode (#9782)

---
 packages/vant/src/checkbox/README.md                          | 2 +-
 packages/vant/src/checkbox/README.zh-CN.md                    | 2 +-
 packages/vant/src/checkbox/demo/index.vue                     | 4 +---
 .../vant/src/checkbox/test/__snapshots__/demo.spec.ts.snap    | 2 +-
 packages/vant/src/icon/demo/index.vue                         | 2 +-
 packages/vant/src/password-input/README.md                    | 2 +-
 packages/vant/src/password-input/README.zh-CN.md              | 2 +-
 packages/vant/src/password-input/var.less                     | 2 +-
 packages/vant/src/radio/README.md                             | 2 +-
 packages/vant/src/radio/README.zh-CN.md                       | 2 +-
 packages/vant/src/radio/demo/index.vue                        | 4 +---
 packages/vant/src/radio/test/__snapshots__/demo.spec.ts.snap  | 2 +-
 packages/vant/src/slider/README.md                            | 2 +-
 packages/vant/src/slider/README.zh-CN.md                      | 2 +-
 packages/vant/src/slider/var.less                             | 2 +-
 packages/vant/src/switch/README.md                            | 2 +-
 packages/vant/src/switch/README.zh-CN.md                      | 2 +-
 packages/vant/src/switch/var.less                             | 2 +-
 18 files changed, 18 insertions(+), 22 deletions(-)

diff --git a/packages/vant/src/checkbox/README.md b/packages/vant/src/checkbox/README.md
index 0bbc9faa5..103b954dd 100644
--- a/packages/vant/src/checkbox/README.md
+++ b/packages/vant/src/checkbox/README.md
@@ -196,7 +196,7 @@ export default {
 
 ```html
 <van-checkbox-group v-model="checked">
-  <van-cell-group>
+  <van-cell-group inset>
     <van-cell
       v-for="(item, index) in list"
       clickable
diff --git a/packages/vant/src/checkbox/README.zh-CN.md b/packages/vant/src/checkbox/README.zh-CN.md
index 60b7ca709..6e4e0305e 100644
--- a/packages/vant/src/checkbox/README.zh-CN.md
+++ b/packages/vant/src/checkbox/README.zh-CN.md
@@ -214,7 +214,7 @@ export default {
 
 ```html
 <van-checkbox-group v-model="checked">
-  <van-cell-group>
+  <van-cell-group inset>
     <van-cell
       v-for="(item, index) in list"
       clickable
diff --git a/packages/vant/src/checkbox/demo/index.vue b/packages/vant/src/checkbox/demo/index.vue
index 7c9b448a9..75ab4b606 100644
--- a/packages/vant/src/checkbox/demo/index.vue
+++ b/packages/vant/src/checkbox/demo/index.vue
@@ -165,7 +165,7 @@ const toggleAll = () => {
 
   <demo-block :title="t('title5')">
     <van-checkbox-group v-model="state.result3">
-      <van-cell-group>
+      <van-cell-group inset>
         <van-cell
           v-for="(item, index) in state.list"
           clickable
@@ -184,8 +184,6 @@ const toggleAll = () => {
 
 <style lang="less">
 .demo-checkbox {
-  background: var(--van-background-color-light);
-
   .van-checkbox {
     margin: 0 0 8px 20px;
   }
diff --git a/packages/vant/src/checkbox/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/checkbox/test/__snapshots__/demo.spec.ts.snap
index f326be6df..e1ec46ec4 100644
--- a/packages/vant/src/checkbox/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/checkbox/test/__snapshots__/demo.spec.ts.snap
@@ -290,7 +290,7 @@ exports[`should render demo and match snapshot 1`] = `
 </div>
 <div>
   <div class="van-checkbox-group">
-    <div class="van-cell-group van-hairline--top-bottom">
+    <div class="van-cell-group van-cell-group--inset">
       <div class="van-cell van-cell--clickable"
            role="button"
            tabindex="0"
diff --git a/packages/vant/src/icon/demo/index.vue b/packages/vant/src/icon/demo/index.vue
index e8cc3f7b6..9b8b1e109 100644
--- a/packages/vant/src/icon/demo/index.vue
+++ b/packages/vant/src/icon/demo/index.vue
@@ -212,7 +212,7 @@ const copy = (icon: string, option: Record<string, unknown> = {}) => {
       height: 36px;
       margin: -4px 0 4px;
       padding: 0 5px;
-      color: var(--van-gray-7);
+      color: var(--van-text-color);
       font-size: 12px;
       line-height: 18px;
     }
diff --git a/packages/vant/src/password-input/README.md b/packages/vant/src/password-input/README.md
index 2963eebf2..2ed8fc525 100644
--- a/packages/vant/src/password-input/README.md
+++ b/packages/vant/src/password-input/README.md
@@ -165,7 +165,7 @@ The component provides the following CSS variables, which can be used to customi
 | --van-password-input-info-font-size | _var(--van-font-size-md)_ | - |
 | --van-password-input-error-info-color | _var(--van-danger-color)_ | - |
 | --van-password-input-dot-size | _10px_ | - |
-| --van-password-input-dot-color | _var(--van-black)_ | - |
+| --van-password-input-dot-color | _var(--van-text-color)_ | - |
 | --van-password-input-text-color | _var(--van-text-color)_ | - |
 | --van-password-input-cursor-color | _var(--van-text-color)_ | - |
 | --van-password-input-cursor-width | _1px_ | - |
diff --git a/packages/vant/src/password-input/README.zh-CN.md b/packages/vant/src/password-input/README.zh-CN.md
index 0eae9c5d2..3b93c843f 100644
--- a/packages/vant/src/password-input/README.zh-CN.md
+++ b/packages/vant/src/password-input/README.zh-CN.md
@@ -175,7 +175,7 @@ export default {
 | --van-password-input-info-font-size | _var(--van-font-size-md)_ | - |
 | --van-password-input-error-info-color | _var(--van-danger-color)_ | - |
 | --van-password-input-dot-size | _10px_ | - |
-| --van-password-input-dot-color | _var(--van-black)_ | - |
+| --van-password-input-dot-color | _var(--van-text-color)_ | - |
 | --van-password-input-text-color | _var(--van-text-color)_ | - |
 | --van-password-input-cursor-color | _var(--van-text-color)_ | - |
 | --van-password-input-cursor-width | _1px_ | - |
diff --git a/packages/vant/src/password-input/var.less b/packages/vant/src/password-input/var.less
index 36cb202bf..db0de6bb1 100644
--- a/packages/vant/src/password-input/var.less
+++ b/packages/vant/src/password-input/var.less
@@ -9,7 +9,7 @@
 @password-input-info-font-size: var(--van-font-size-md);
 @password-input-error-info-color: var(--van-danger-color);
 @password-input-dot-size: 10px;
-@password-input-dot-color: var(--van-black);
+@password-input-dot-color: var(--van-text-color);
 @password-input-text-color: var(--van-text-color);
 @password-input-cursor-color: var(--van-text-color);
 @password-input-cursor-width: 1px;
diff --git a/packages/vant/src/radio/README.md b/packages/vant/src/radio/README.md
index f99b06f74..5ec95eb7d 100644
--- a/packages/vant/src/radio/README.md
+++ b/packages/vant/src/radio/README.md
@@ -141,7 +141,7 @@ export default {
 
 ```html
 <van-radio-group v-model="checked">
-  <van-cell-group>
+  <van-cell-group inset>
     <van-cell title="Radio 1" clickable @click="checked = '1'">
       <template #right-icon>
         <van-radio name="1" />
diff --git a/packages/vant/src/radio/README.zh-CN.md b/packages/vant/src/radio/README.zh-CN.md
index bc5c33c34..cc1925b32 100644
--- a/packages/vant/src/radio/README.zh-CN.md
+++ b/packages/vant/src/radio/README.zh-CN.md
@@ -155,7 +155,7 @@ export default {
 
 ```html
 <van-radio-group v-model="checked">
-  <van-cell-group>
+  <van-cell-group inset>
     <van-cell title="单选框 1" clickable @click="checked = '1'">
       <template #right-icon>
         <van-radio name="1" />
diff --git a/packages/vant/src/radio/demo/index.vue b/packages/vant/src/radio/demo/index.vue
index cd7872362..74292f00c 100644
--- a/packages/vant/src/radio/demo/index.vue
+++ b/packages/vant/src/radio/demo/index.vue
@@ -123,7 +123,7 @@ const inactiveIcon = 'https://img.yzcdn.cn/vant/user-inactive.png';
 
   <demo-block :title="t('withCell')">
     <van-radio-group v-model="radio5">
-      <van-cell-group>
+      <van-cell-group inset>
         <van-cell clickable :title="t('radio') + 1" @click="radio5 = '1'">
           <template #right-icon>
             <van-radio name="1" />
@@ -141,8 +141,6 @@ const inactiveIcon = 'https://img.yzcdn.cn/vant/user-inactive.png';
 
 <style lang="less">
 .demo-radio {
-  background: var(--van-background-color-light);
-
   &-group {
     padding: 0 16px;
 
diff --git a/packages/vant/src/radio/test/__snapshots__/demo.spec.ts.snap b/packages/vant/src/radio/test/__snapshots__/demo.spec.ts.snap
index e23eafda2..c3016c993 100644
--- a/packages/vant/src/radio/test/__snapshots__/demo.spec.ts.snap
+++ b/packages/vant/src/radio/test/__snapshots__/demo.spec.ts.snap
@@ -265,7 +265,7 @@ exports[`should render demo and match snapshot 1`] = `
   <div class="van-radio-group"
        role="radiogroup"
   >
-    <div class="van-cell-group van-hairline--top-bottom">
+    <div class="van-cell-group van-cell-group--inset">
       <div class="van-cell van-cell--clickable"
            role="button"
            tabindex="0"
diff --git a/packages/vant/src/slider/README.md b/packages/vant/src/slider/README.md
index 83094808d..6a8936ba8 100644
--- a/packages/vant/src/slider/README.md
+++ b/packages/vant/src/slider/README.md
@@ -204,5 +204,5 @@ The component provides the following CSS variables, which can be used to customi
 | --van-slider-button-width | _24px_ | - |
 | --van-slider-button-height | _24px_ | - |
 | --van-slider-button-border-radius | _50%_ | - |
-| --van-slider-button-background-color | _var(--van-background-color-light)_ | - |
+| --van-slider-button-background-color | _var(--van-white)_ | - |
 | --van-slider-button-box-shadow | _0 1px 2px rgba(0, 0, 0, 0.5)_ | - |
diff --git a/packages/vant/src/slider/README.zh-CN.md b/packages/vant/src/slider/README.zh-CN.md
index f61661b61..560c91c45 100644
--- a/packages/vant/src/slider/README.zh-CN.md
+++ b/packages/vant/src/slider/README.zh-CN.md
@@ -206,5 +206,5 @@ import type { SliderProps } from 'vant';
 | --van-slider-button-width | _24px_ | - |
 | --van-slider-button-height | _24px_ | - |
 | --van-slider-button-border-radius | _50%_ | - |
-| --van-slider-button-background-color | _var(--van-background-color-light)_ | - |
+| --van-slider-button-background-color | _var(--van-white)_ | - |
 | --van-slider-button-box-shadow | _0 1px 2px rgba(0, 0, 0, 0.5)_ | - |
diff --git a/packages/vant/src/slider/var.less b/packages/vant/src/slider/var.less
index adcf1417a..5906e1929 100644
--- a/packages/vant/src/slider/var.less
+++ b/packages/vant/src/slider/var.less
@@ -7,5 +7,5 @@
 @slider-button-width: 24px;
 @slider-button-height: 24px;
 @slider-button-border-radius: 50%;
-@slider-button-background-color: var(--van-background-color-light);
+@slider-button-background-color: var(--van-white);
 @slider-button-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
diff --git a/packages/vant/src/switch/README.md b/packages/vant/src/switch/README.md
index e5fe74c90..891f235f5 100644
--- a/packages/vant/src/switch/README.md
+++ b/packages/vant/src/switch/README.md
@@ -141,7 +141,7 @@ The component provides the following CSS variables, which can be used to customi
 | --van-switch-width | _2em_ | - |
 | --van-switch-height | _1em_ | - |
 | --van-switch-node-size | _1em_ | - |
-| --van-switch-node-background-color | _var(--van-background-color-light)_ | - |
+| --van-switch-node-background-color | _var(--van-white)_ | - |
 | --van-switch-node-box-shadow | _0 3px 1px 0 rgba(0, 0, 0, 0.05)_ | - |
 | --van-switch-background-color | _var(--van-background-color-light)_ | - |
 | --van-switch-on-background-color | _var(--van-primary-color)_ | - |
diff --git a/packages/vant/src/switch/README.zh-CN.md b/packages/vant/src/switch/README.zh-CN.md
index b325a5355..1060bde00 100644
--- a/packages/vant/src/switch/README.zh-CN.md
+++ b/packages/vant/src/switch/README.zh-CN.md
@@ -153,7 +153,7 @@ import type { SwitchProps } from 'vant';
 | --van-switch-width | _2em_ | - |
 | --van-switch-height | _1em_ | - |
 | --van-switch-node-size | _1em_ | - |
-| --van-switch-node-background-color | _var(--van-background-color-light)_ | - |
+| --van-switch-node-background-color | _var(--van-white)_ | - |
 | --van-switch-node-box-shadow | _0 3px 1px 0 rgba(0, 0, 0, 0.05)_ | - |
 | --van-switch-background-color | _var(--van-background-color-light)_ | - |
 | --van-switch-on-background-color | _var(--van-primary-color)_ | - |
diff --git a/packages/vant/src/switch/var.less b/packages/vant/src/switch/var.less
index ef561d045..93906544e 100644
--- a/packages/vant/src/switch/var.less
+++ b/packages/vant/src/switch/var.less
@@ -4,7 +4,7 @@
 @switch-width: 2em;
 @switch-height: 1em;
 @switch-node-size: 1em;
-@switch-node-background-color: var(--van-background-color-light);
+@switch-node-background-color: var(--van-white);
 @switch-node-box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05),
   0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05);
 @switch-background-color: var(--van-background-color-light);