From 85a636dfbcbc606ada5b79daad16f46958177af0 Mon Sep 17 00:00:00 2001 From: neverland Date: Sun, 31 Oct 2021 19:47:17 +0800 Subject: [PATCH] feat: add --van-text-color-secondary css var (#9759) * feat: add --van-text-color-secondary css var * chore: upd --- packages/vant/src/action-sheet/README.md | 4 +-- .../vant/src/action-sheet/README.zh-CN.md | 4 +-- packages/vant/src/action-sheet/var.less | 4 +-- packages/vant/src/address-list/README.md | 2 +- .../vant/src/address-list/README.zh-CN.md | 2 +- packages/vant/src/address-list/var.less | 2 +- packages/vant/src/card/README.md | 4 +-- packages/vant/src/card/README.zh-CN.md | 4 +-- packages/vant/src/card/var.less | 4 +-- packages/vant/src/cascader/README.md | 2 +- packages/vant/src/cascader/README.zh-CN.md | 32 +++++++++---------- packages/vant/src/cascader/var.less | 2 +- packages/vant/src/cell-group/var.less | 2 +- packages/vant/src/cell/README.md | 6 ++-- packages/vant/src/cell/README.zh-CN.md | 6 ++-- packages/vant/src/cell/var.less | 4 +-- packages/vant/src/collapse-item/var.less | 2 +- packages/vant/src/collapse/README.md | 2 +- packages/vant/src/collapse/README.zh-CN.md | 2 +- packages/vant/src/config-provider/README.md | 3 +- .../vant/src/config-provider/README.zh-CN.md | 3 +- packages/vant/src/coupon-list/README.md | 4 +-- packages/vant/src/coupon-list/README.zh-CN.md | 4 +-- packages/vant/src/coupon-list/var.less | 2 +- packages/vant/src/coupon/var.less | 2 +- packages/vant/src/divider/README.md | 20 ++++++------ packages/vant/src/divider/README.zh-CN.md | 20 ++++++------ packages/vant/src/divider/var.less | 2 +- packages/vant/src/dropdown-menu/README.md | 2 +- .../vant/src/dropdown-menu/README.zh-CN.md | 2 +- packages/vant/src/dropdown-menu/var.less | 2 +- packages/vant/src/empty/README.md | 2 +- packages/vant/src/empty/README.zh-CN.md | 20 ++++++------ packages/vant/src/empty/var.less | 2 +- packages/vant/src/image/README.md | 2 +- packages/vant/src/image/README.zh-CN.md | 2 +- packages/vant/src/image/var.less | 2 +- packages/vant/src/list/README.md | 12 +++---- packages/vant/src/list/README.zh-CN.md | 12 +++---- packages/vant/src/list/var.less | 2 +- packages/vant/src/loading/README.md | 2 +- packages/vant/src/loading/README.zh-CN.md | 14 ++++---- packages/vant/src/loading/var.less | 2 +- packages/vant/src/password-input/README.md | 2 +- .../vant/src/password-input/README.zh-CN.md | 2 +- packages/vant/src/password-input/var.less | 2 +- packages/vant/src/picker/README.md | 2 +- packages/vant/src/picker/README.zh-CN.md | 2 +- packages/vant/src/picker/var.less | 2 +- packages/vant/src/popover/README.md | 2 +- packages/vant/src/popover/README.zh-CN.md | 2 +- packages/vant/src/popover/var.less | 2 +- packages/vant/src/pull-refresh/README.md | 2 +- .../vant/src/pull-refresh/README.zh-CN.md | 12 +++---- packages/vant/src/pull-refresh/var.less | 2 +- packages/vant/src/share-sheet/README.md | 2 +- packages/vant/src/share-sheet/README.zh-CN.md | 2 +- packages/vant/src/share-sheet/var.less | 2 +- packages/vant/src/sidebar/demo/index.vue | 2 +- packages/vant/src/step/var.less | 2 +- packages/vant/src/steps/README.md | 2 +- packages/vant/src/steps/README.zh-CN.md | 2 +- packages/vant/src/style/var.less | 1 + packages/vant/src/submit-bar/demo/index.vue | 1 - packages/vant/src/uploader/README.md | 2 +- packages/vant/src/uploader/README.zh-CN.md | 2 +- packages/vant/src/uploader/var.less | 2 +- 67 files changed, 144 insertions(+), 142 deletions(-) diff --git a/packages/vant/src/action-sheet/README.md b/packages/vant/src/action-sheet/README.md index e9d0dfcd0..551d9558f 100644 --- a/packages/vant/src/action-sheet/README.md +++ b/packages/vant/src/action-sheet/README.md @@ -243,7 +243,7 @@ The component provides the following CSS variables, which can be used to customi | --van-action-sheet-max-height | _80%_ | - | | --van-action-sheet-header-height | _48px_ | - | | --van-action-sheet-header-font-size | _var(--van-font-size-lg)_ | - | -| --van-action-sheet-description-color | _var(--van-gray-6)_ | - | +| --van-action-sheet-description-color | _var(--van-text-color-secondary)_ | - | | --van-action-sheet-description-font-size | _var(--van-font-size-md)_ | - | | --van-action-sheet-description-line-height | _var(--van-line-height-md)_ | - | | --van-action-sheet-item-background | _var(--van-background-color-light)_ | - | @@ -251,7 +251,7 @@ The component provides the following CSS variables, which can be used to customi | --van-action-sheet-item-line-height | _var(--van-line-height-lg)_ | - | | --van-action-sheet-item-text-color | _var(--van-text-color)_ | - | | --van-action-sheet-item-disabled-text-color | _var(--van-gray-5)_ | - | -| --van-action-sheet-subname-color | _var(--van-gray-6)_ | - | +| --van-action-sheet-subname-color | _var(--van-text-color-secondary)_ | - | | --van-action-sheet-subname-font-size | _var(--van-font-size-sm)_ | - | | --van-action-sheet-subname-line-height | _var(--van-line-height-sm)_ | - | | --van-action-sheet-close-icon-size | _22px_ | - | diff --git a/packages/vant/src/action-sheet/README.zh-CN.md b/packages/vant/src/action-sheet/README.zh-CN.md index 0d10d1297..fa398bf36 100644 --- a/packages/vant/src/action-sheet/README.zh-CN.md +++ b/packages/vant/src/action-sheet/README.zh-CN.md @@ -255,7 +255,7 @@ import type { ActionSheetProps, ActionSheetAction } from 'vant'; | --van-action-sheet-max-height | _80%_ | - | | --van-action-sheet-header-height | _48px_ | - | | --van-action-sheet-header-font-size | _var(--van-font-size-lg)_ | - | -| --van-action-sheet-description-color | _var(--van-gray-6)_ | - | +| --van-action-sheet-description-color | _var(--van-text-color-secondary)_ | - | | --van-action-sheet-description-font-size | _var(--van-font-size-md)_ | - | | --van-action-sheet-description-line-height | _var(--van-line-height-md)_ | - | | --van-action-sheet-item-background | _var(--van-background-color-light)_ | - | @@ -263,7 +263,7 @@ import type { ActionSheetProps, ActionSheetAction } from 'vant'; | --van-action-sheet-item-line-height | _var(--van-line-height-lg)_ | - | | --van-action-sheet-item-text-color | _var(--van-text-color)_ | - | | --van-action-sheet-item-disabled-text-color | _var(--van-gray-5)_ | - | -| --van-action-sheet-subname-color | _var(--van-gray-6)_ | - | +| --van-action-sheet-subname-color | _var(--van-text-color-secondary)_ | - | | --van-action-sheet-subname-font-size | _var(--van-font-size-sm)_ | - | | --van-action-sheet-subname-line-height | _var(--van-line-height-sm)_ | - | | --van-action-sheet-close-icon-size | _22px_ | - | diff --git a/packages/vant/src/action-sheet/var.less b/packages/vant/src/action-sheet/var.less index 6ee0d3331..a0c4f5f54 100644 --- a/packages/vant/src/action-sheet/var.less +++ b/packages/vant/src/action-sheet/var.less @@ -3,7 +3,7 @@ @action-sheet-max-height: 80%; @action-sheet-header-height: 48px; @action-sheet-header-font-size: var(--van-font-size-lg); -@action-sheet-description-color: var(--van-gray-6); +@action-sheet-description-color: var(--van-text-color-secondary); @action-sheet-description-font-size: var(--van-font-size-md); @action-sheet-description-line-height: var(--van-line-height-md); @action-sheet-item-background: var(--van-background-color-light); @@ -11,7 +11,7 @@ @action-sheet-item-line-height: var(--van-line-height-lg); @action-sheet-item-text-color: var(--van-text-color); @action-sheet-item-disabled-text-color: var(--van-gray-5); -@action-sheet-subname-color: var(--van-gray-6); +@action-sheet-subname-color: var(--van-text-color-secondary); @action-sheet-subname-font-size: var(--van-font-size-sm); @action-sheet-subname-line-height: var(--van-line-height-sm); @action-sheet-close-icon-size: 22px; diff --git a/packages/vant/src/address-list/README.md b/packages/vant/src/address-list/README.md index 2869abd90..c4822bffe 100644 --- a/packages/vant/src/address-list/README.md +++ b/packages/vant/src/address-list/README.md @@ -138,7 +138,7 @@ The component provides the following CSS variables, which can be used to customi | Name | Default Value | Description | | --- | --- | --- | | --van-address-list-padding | _var(--van-padding-sm) var(--van-padding-sm) 80px_ | - | -| --van-address-list-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-address-list-disabled-text-color | _var(--van-text-color-secondary)_ | - | | --van-address-list-disabled-text-padding | _var(--van-padding-base) \* 5 0 var(--van-padding-md)_ | - | | --van-address-list-disabled-text-font-size | _var(--van-font-size-md)_ | - | | --van-address-list-disabled-text-line-height | _var(--van-line-height-md)_ | - | diff --git a/packages/vant/src/address-list/README.zh-CN.md b/packages/vant/src/address-list/README.zh-CN.md index d1231309d..332a3c518 100644 --- a/packages/vant/src/address-list/README.zh-CN.md +++ b/packages/vant/src/address-list/README.zh-CN.md @@ -138,7 +138,7 @@ import type { AddressListProps, AddressListAddress } from 'vant'; | 名称 | 默认值 | 描述 | | --- | --- | --- | | --van-address-list-padding | _var(--van-padding-sm) var(--van-padding-sm) 80px_ | - | -| --van-address-list-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-address-list-disabled-text-color | _var(--van-text-color-secondary)_ | - | | --van-address-list-disabled-text-padding | _var(--van-padding-base) \* 5 0 var(--van-padding-md)_ | - | | --van-address-list-disabled-text-font-size | _var(--van-font-size-md)_ | - | | --van-address-list-disabled-text-line-height | _var(--van-line-height-md)_ | - | diff --git a/packages/vant/src/address-list/var.less b/packages/vant/src/address-list/var.less index f0fd691c7..b4cab4806 100644 --- a/packages/vant/src/address-list/var.less +++ b/packages/vant/src/address-list/var.less @@ -1,7 +1,7 @@ @import '../style/var.less'; @address-list-padding: var(--van-padding-sm) var(--van-padding-sm) 80px; -@address-list-disabled-text-color: var(--van-gray-6); +@address-list-disabled-text-color: var(--van-text-color-secondary); @address-list-disabled-text-padding: calc(var(--van-padding-base) * 5) 0 var(--van-padding-md); @address-list-disabled-text-font-size: var(--van-font-size-md); diff --git a/packages/vant/src/card/README.md b/packages/vant/src/card/README.md index 4c0ec8339..1fffd2611 100644 --- a/packages/vant/src/card/README.md +++ b/packages/vant/src/card/README.md @@ -134,8 +134,8 @@ The component provides the following CSS variables, which can be used to customi | --van-card-desc-color | _var(--van-gray-7)_ | - | | --van-card-desc-line-height | _var(--van-line-height-md)_ | - | | --van-card-price-color | _var(--van-gray-8)_ | - | -| --van-card-origin-price-color | _var(--van-gray-6)_ | - | -| --van-card-num-color | _var(--van-gray-6)_ | - | +| --van-card-origin-price-color | _var(--van-text-color-secondary)_ | - | +| --van-card-num-color | _var(--van-text-color-secondary)_ | - | | --van-card-origin-price-font-size | _var(--van-font-size-xs)_ | - | | --van-card-price-font-size | _var(--van-font-size-sm)_ | - | | --van-card-price-integer-font-size | _var(--van-font-size-lg)_ | - | diff --git a/packages/vant/src/card/README.zh-CN.md b/packages/vant/src/card/README.zh-CN.md index 600f7ff64..791a72102 100644 --- a/packages/vant/src/card/README.zh-CN.md +++ b/packages/vant/src/card/README.zh-CN.md @@ -136,8 +136,8 @@ import type { CardProps } from 'vant'; | --van-card-desc-color | _var(--van-gray-7)_ | - | | --van-card-desc-line-height | _var(--van-line-height-md)_ | - | | --van-card-price-color | _var(--van-gray-8)_ | - | -| --van-card-origin-price-color | _var(--van-gray-6)_ | - | -| --van-card-num-color | _var(--van-gray-6)_ | - | +| --van-card-origin-price-color | _var(--van-text-color-secondary)_ | - | +| --van-card-num-color | _var(--van-text-color-secondary)_ | - | | --van-card-origin-price-font-size | _var(--van-font-size-xs)_ | - | | --van-card-price-font-size | _var(--van-font-size-sm)_ | - | | --van-card-price-integer-font-size | _var(--van-font-size-lg)_ | - | diff --git a/packages/vant/src/card/var.less b/packages/vant/src/card/var.less index 922455aa8..f698cfeee 100644 --- a/packages/vant/src/card/var.less +++ b/packages/vant/src/card/var.less @@ -10,8 +10,8 @@ @card-desc-color: var(--van-gray-7); @card-desc-line-height: var(--van-line-height-md); @card-price-color: var(--van-gray-8); -@card-origin-price-color: var(--van-gray-6); -@card-num-color: var(--van-gray-6); +@card-origin-price-color: var(--van-text-color-secondary); +@card-num-color: var(--van-text-color-secondary); @card-origin-price-font-size: var(--van-font-size-xs); @card-price-font-size: var(--van-font-size-sm); @card-price-integer-font-size: var(--van-font-size-lg); diff --git a/packages/vant/src/cascader/README.md b/packages/vant/src/cascader/README.md index c7260f093..7b5aa0429 100644 --- a/packages/vant/src/cascader/README.md +++ b/packages/vant/src/cascader/README.md @@ -312,4 +312,4 @@ The component provides the following CSS variables, which can be used to customi | --van-cascader-active-color | _var(--van-danger-color)_ | - | | --van-cascader-options-height | _384px_ | - | | --van-cascader-tab-color | _var(--van-text-color)_ | - | -| --van-cascader-unselected-tab-color | _var(--van-gray-6)_ | - | +| --van-cascader-unselected-tab-color | _var(--van-text-color-secondary)_ | - | diff --git a/packages/vant/src/cascader/README.zh-CN.md b/packages/vant/src/cascader/README.zh-CN.md index 99b877e27..1aa92d8b7 100644 --- a/packages/vant/src/cascader/README.zh-CN.md +++ b/packages/vant/src/cascader/README.zh-CN.md @@ -310,19 +310,19 @@ import type { CascaderProps, CascaderOption, CascaderFieldNames } from 'vant'; 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。 -| 名称 | 默认值 | 描述 | -| -------------------------------------- | ------------------------- | ---- | -| --van-cascader-header-height | _48px_ | - | -| --van-cascader-header-padding | _0 var(--van-padding-md)_ | - | -| --van-cascader-title-font-size | _var(--van-font-size-lg)_ | - | -| --van-cascader-title-line-height | _20px_ | - | -| --van-cascader-close-icon-size | _22px_ | - | -| --van-cascader-close-icon-color | _var(--van-gray-5)_ | - | -| --van-cascader-close-icon-active-color | _var(--van-gray-6)_ | - | -| --van-cascader-selected-icon-size | _18px_ | - | -| --van-cascader-tabs-height | _48px_ | - | -| --van-cascader-active-color | _var(--van-danger-color)_ | - | -| --van-cascader-options-height | _384px_ | - | -| --van-cascader-option-disabled-color | _van(--van-gray-5)_ | - | -| --van-cascader-tab-color | _var(--van-text-color)_ | - | -| --van-cascader-unselected-tab-color | _var(--van-gray-6)_ | - | +| 名称 | 默认值 | 描述 | +| --- | --- | --- | +| --van-cascader-header-height | _48px_ | - | +| --van-cascader-header-padding | _0 var(--van-padding-md)_ | - | +| --van-cascader-title-font-size | _var(--van-font-size-lg)_ | - | +| --van-cascader-title-line-height | _20px_ | - | +| --van-cascader-close-icon-size | _22px_ | - | +| --van-cascader-close-icon-color | _var(--van-gray-5)_ | - | +| --van-cascader-close-icon-active-color | _var(--van-gray-6)_ | - | +| --van-cascader-selected-icon-size | _18px_ | - | +| --van-cascader-tabs-height | _48px_ | - | +| --van-cascader-active-color | _var(--van-danger-color)_ | - | +| --van-cascader-options-height | _384px_ | - | +| --van-cascader-option-disabled-color | _van(--van-gray-5)_ | - | +| --van-cascader-tab-color | _var(--van-text-color)_ | - | +| --van-cascader-unselected-tab-color | _var(--van-text-color-secondary)_ | - | diff --git a/packages/vant/src/cascader/var.less b/packages/vant/src/cascader/var.less index 684b737eb..ddaf6b47b 100644 --- a/packages/vant/src/cascader/var.less +++ b/packages/vant/src/cascader/var.less @@ -13,4 +13,4 @@ @cascader-options-height: 384px; @cascader-option-disabled-color: var(--van-gray-5); @cascader-tab-color: var(--van-text-color); -@cascader-unselected-tab-color: var(--van-gray-6); +@cascader-unselected-tab-color: var(--van-text-color-secondary); diff --git a/packages/vant/src/cell-group/var.less b/packages/vant/src/cell-group/var.less index 35c451f22..74e0a3d62 100644 --- a/packages/vant/src/cell-group/var.less +++ b/packages/vant/src/cell-group/var.less @@ -1,7 +1,7 @@ @import '../style/var.less'; @cell-group-background-color: var(--van-background-color-light); -@cell-group-title-color: var(--van-gray-6); +@cell-group-title-color: var(--van-text-color-secondary); @cell-group-title-padding: var(--van-padding-md) var(--van-padding-md) var(--van-padding-xs); @cell-group-title-font-size: var(--van-font-size-md); diff --git a/packages/vant/src/cell/README.md b/packages/vant/src/cell/README.md index 7e78fe6f9..20dd4c7f3 100644 --- a/packages/vant/src/cell/README.md +++ b/packages/vant/src/cell/README.md @@ -217,18 +217,18 @@ The component provides the following CSS variables, which can be used to customi | --van-cell-border-color | _var(--van-border-color)_ | - | | --van-cell-active-color | _var(--van-active-color)_ | - | | --van-cell-required-color | _var(--van-danger-color)_ | - | -| --van-cell-label-color | _var(--van-gray-6)_ | - | +| --van-cell-label-color | _var(--van-text-color-secondary)_ | - | | --van-cell-label-font-size | _var(--van-font-size-sm)_ | - | | --van-cell-label-line-height | _var(--van-line-height-sm)_ | - | | --van-cell-label-margin-top | _var(--van-padding-base)_ | - | -| --van-cell-value-color | _var(--van-gray-6)_ | - | +| --van-cell-value-color | _var(--van-text-color-secondary)_ | - | | --van-cell-icon-size | _16px_ | - | | --van-cell-right-icon-color | _var(--van-gray-6)_ | - | | --van-cell-large-vertical-padding | _var(--van-padding-sm)_ | - | | --van-cell-large-title-font-size | _var(--van-font-size-lg)_ | - | | --van-cell-large-label-font-size | _var(--van-font-size-md)_ | - | | --van-cell-group-background-color | _var(--van-background-color-light)_ | - | -| --van-cell-group-title-color | _var(--van-gray-6)_ | - | +| --van-cell-group-title-color | _var(--van-text-color-secondary)_ | - | | --van-cell-group-title-padding | _var(--van-padding-md) var(--van-padding-md) var(--van-padding-xs)_ | - | | --van-cell-group-title-font-size | _var(--van-font-size-md)_ | - | | --van-cell-group-title-line-height | _16px_ | - | diff --git a/packages/vant/src/cell/README.zh-CN.md b/packages/vant/src/cell/README.zh-CN.md index b420e9c9e..0834c77ae 100644 --- a/packages/vant/src/cell/README.zh-CN.md +++ b/packages/vant/src/cell/README.zh-CN.md @@ -222,18 +222,18 @@ import type { CellProps, CellGroupProps, CellArrowDirection } from 'vant'; | --van-cell-border-color | _var(--van-border-color)_ | - | | --van-cell-active-color | _var(--van-active-color)_ | - | | --van-cell-required-color | _var(--van-danger-color)_ | - | -| --van-cell-label-color | _var(--van-gray-6)_ | - | +| --van-cell-label-color | _var(--van-text-color-secondary)_ | - | | --van-cell-label-font-size | _var(--van-font-size-sm)_ | - | | --van-cell-label-line-height | _var(--van-line-height-sm)_ | - | | --van-cell-label-margin-top | _var(--van-padding-base)_ | - | -| --van-cell-value-color | _var(--van-gray-6)_ | - | +| --van-cell-value-color | _var(--van-text-color-secondary)_ | - | | --van-cell-icon-size | _16px_ | - | | --van-cell-right-icon-color | _var(--van-gray-6)_ | - | | --van-cell-large-vertical-padding | _var(--van-padding-sm)_ | - | | --van-cell-large-title-font-size | _var(--van-font-size-lg)_ | - | | --van-cell-large-label-font-size | _var(--van-font-size-md)_ | - | | --van-cell-group-background-color | _var(--van-background-color-light)_ | - | -| --van-cell-group-title-color | _var(--van-gray-6)_ | - | +| --van-cell-group-title-color | _var(--van-text-color-secondary)_ | - | | --van-cell-group-title-padding | _var(--van-padding-md) var(--van-padding-md) var(--van-padding-xs)_ | - | | --van-cell-group-title-font-size | _var(--van-font-size-md)_ | - | | --van-cell-group-title-line-height | _16px_ | - | diff --git a/packages/vant/src/cell/var.less b/packages/vant/src/cell/var.less index d986301a6..892146a51 100644 --- a/packages/vant/src/cell/var.less +++ b/packages/vant/src/cell/var.less @@ -9,11 +9,11 @@ @cell-border-color: var(--van-border-color); @cell-active-color: var(--van-active-color); @cell-required-color: var(--van-danger-color); -@cell-label-color: var(--van-gray-6); +@cell-label-color: var(--van-text-color-secondary); @cell-label-font-size: var(--van-font-size-sm); @cell-label-line-height: var(--van-line-height-sm); @cell-label-margin-top: var(--van-padding-base); -@cell-value-color: var(--van-gray-6); +@cell-value-color: var(--van-text-color-secondary); @cell-icon-size: 16px; @cell-right-icon-color: var(--van-gray-6); @cell-large-vertical-padding: var(--van-padding-sm); diff --git a/packages/vant/src/collapse-item/var.less b/packages/vant/src/collapse-item/var.less index bdbe96d7b..475e2ccc2 100644 --- a/packages/vant/src/collapse-item/var.less +++ b/packages/vant/src/collapse-item/var.less @@ -4,6 +4,6 @@ @collapse-item-content-padding: var(--van-padding-sm) var(--van-padding-md); @collapse-item-content-font-size: var(--van-font-size-md); @collapse-item-content-line-height: 1.5; -@collapse-item-content-text-color: var(--van-gray-6); +@collapse-item-content-text-color: var(--van-text-color-secondary); @collapse-item-content-background-color: var(--van-background-color-light); @collapse-item-title-disabled-color: var(--van-gray-5); diff --git a/packages/vant/src/collapse/README.md b/packages/vant/src/collapse/README.md index 69ca68fc4..3b79a4445 100644 --- a/packages/vant/src/collapse/README.md +++ b/packages/vant/src/collapse/README.md @@ -196,6 +196,6 @@ The component provides the following CSS variables, which can be used to customi | --van-collapse-item-content-padding | _var(--van-padding-sm) var(--van-padding-md)_ | - | | --van-collapse-item-content-font-size | _var(--van-font-size-md)_ | - | | --van-collapse-item-content-line-height | _1.5_ | - | -| --van-collapse-item-content-text-color | _var(--van-gray-6)_ | - | +| --van-collapse-item-content-text-color | _var(--van-text-color-secondary)_ | - | | --van-collapse-item-content-background-color | _var(--van-background-color-light)_ | - | | --van-collapse-item-title-disabled-color | _var(--van-gray-5)_ | - | diff --git a/packages/vant/src/collapse/README.zh-CN.md b/packages/vant/src/collapse/README.zh-CN.md index d5b909249..a5ecc5b4d 100644 --- a/packages/vant/src/collapse/README.zh-CN.md +++ b/packages/vant/src/collapse/README.zh-CN.md @@ -194,6 +194,6 @@ collapseItemRef.value?.toggle(); | --van-collapse-item-content-padding | _var(--van-padding-sm) var(--van-padding-md)_ | - | | --van-collapse-item-content-font-size | _var(--van-font-size-md)_ | - | | --van-collapse-item-content-line-height | _1.5_ | - | -| --van-collapse-item-content-text-color | _var(--van-gray-6)_ | - | +| --van-collapse-item-content-text-color | _var(--van-text-color-secondary)_ | - | | --van-collapse-item-content-background-color | _var(--van-background-color-light)_ | - | | --van-collapse-item-title-disabled-color | _var(--van-gray-5)_ | - | diff --git a/packages/vant/src/config-provider/README.md b/packages/vant/src/config-provider/README.md index 4e5f9c0b6..d961abd5e 100644 --- a/packages/vant/src/config-provider/README.md +++ b/packages/vant/src/config-provider/README.md @@ -156,12 +156,13 @@ There are all **Basic Variables** below, for component CSS Variables, please ref --van-danger-color: var(--van-red); --van-warning-color: var(--van-orange); --van-text-color: var(--van-gray-8); +--van-text-color-secondary: var(--van-gray-6); +--van-text-link-color: #576b95; --van-active-color: var(--van-gray-2); --van-active-opacity: 0.7; --van-disabled-opacity: 0.5; --van-background-color: var(--van-gray-1); --van-background-color-light: var(--van-white); ---van-text-link-color: #576b95; // Padding --van-padding-base: 4px; diff --git a/packages/vant/src/config-provider/README.zh-CN.md b/packages/vant/src/config-provider/README.zh-CN.md index e6e993b81..4e8fdf3aa 100644 --- a/packages/vant/src/config-provider/README.zh-CN.md +++ b/packages/vant/src/config-provider/README.zh-CN.md @@ -158,12 +158,13 @@ Vant 中的 CSS 变量分为 **基础变量** 和 **组件变量**。组件变 --van-danger-color: var(--van-red); --van-warning-color: var(--van-orange); --van-text-color: var(--van-gray-8); +--van-text-color-secondary: var(--van-gray-6); +--van-text-link-color: #576b95; --van-active-color: var(--van-gray-2); --van-active-opacity: 0.7; --van-disabled-opacity: 0.5; --van-background-color: var(--van-gray-1); --van-background-color-light: var(--van-white); ---van-text-link-color: #576b95; // Padding --van-padding-base: 4px; diff --git a/packages/vant/src/coupon-list/README.md b/packages/vant/src/coupon-list/README.md index 87832fb10..658d56edc 100644 --- a/packages/vant/src/coupon-list/README.md +++ b/packages/vant/src/coupon-list/README.md @@ -177,7 +177,7 @@ The component provides the following CSS variables, which can be used to customi | --van-coupon-amount-font-size | _30px_ | - | | --van-coupon-currency-font-size | _40%_ | - | | --van-coupon-name-font-size | _var(--van-font-size-md)_ | - | -| --van-coupon-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-coupon-disabled-text-color | _var(--van-text-color-secondary)_ | - | | --van-coupon-description-padding | _var(--van-padding-xs) var(--van-padding-md)_ | - | | --van-coupon-description-border-color | _var(--van-border-color)_ | - | | --van-coupon-corner-checkbox-icon-color | _var(--van-danger-color)_ | - | @@ -186,7 +186,7 @@ The component provides the following CSS variables, which can be used to customi | --van-coupon-list-exchange-button-height | _32px_ | - | | --van-coupon-list-close-button-height | _40px_ | - | | --van-coupon-list-empty-image-size | _200px_ | - | -| --van-coupon-list-empty-tip-color | _var(--van-gray-6)_ | - | +| --van-coupon-list-empty-tip-color | _var(--van-text-color-secondary)_ | - | | --van-coupon-list-empty-tip-font-size | _var(--van-font-size-md)_ | - | | --van-coupon-list-empty-tip-line-height | _var(--van-line-height-md)_ | - | | --van-coupon-cell-selected-text-color | _var(--van-text-color)_ | - | diff --git a/packages/vant/src/coupon-list/README.zh-CN.md b/packages/vant/src/coupon-list/README.zh-CN.md index e284c7e32..c9b871241 100644 --- a/packages/vant/src/coupon-list/README.zh-CN.md +++ b/packages/vant/src/coupon-list/README.zh-CN.md @@ -179,7 +179,7 @@ import type { CouponCellProps, CouponListProps } from 'vant'; | --van-coupon-amount-font-size | _30px_ | - | | --van-coupon-currency-font-size | _40%_ | - | | --van-coupon-name-font-size | _var(--van-font-size-md)_ | - | -| --van-coupon-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-coupon-disabled-text-color | _var(--van-text-color-secondary)_ | - | | --van-coupon-description-padding | _var(--van-padding-xs) var(--van-padding-md)_ | - | | --van-coupon-description-border-color | _var(--van-border-color)_ | - | | --van-coupon-corner-checkbox-icon-color | _var(--van-danger-color)_ | - | @@ -188,7 +188,7 @@ import type { CouponCellProps, CouponListProps } from 'vant'; | --van-coupon-list-exchange-button-height | _32px_ | - | | --van-coupon-list-close-button-height | _40px_ | - | | --van-coupon-list-empty-image-size | _200px_ | - | -| --van-coupon-list-empty-tip-color | _var(--van-gray-6)_ | - | +| --van-coupon-list-empty-tip-color | _var(--van-text-color-secondary)_ | - | | --van-coupon-list-empty-tip-font-size | _var(--van-font-size-md)_ | - | | --van-coupon-list-empty-tip-line-height | _var(--van-line-height-md)_ | - | | --van-coupon-cell-selected-text-color | _var(--van-text-color)_ | - | diff --git a/packages/vant/src/coupon-list/var.less b/packages/vant/src/coupon-list/var.less index 32184ad1f..5d38daccb 100644 --- a/packages/vant/src/coupon-list/var.less +++ b/packages/vant/src/coupon-list/var.less @@ -5,6 +5,6 @@ @coupon-list-exchange-button-height: 32px; @coupon-list-close-button-height: 40px; @coupon-list-empty-image-size: 200px; -@coupon-list-empty-tip-color: var(--van-gray-6); +@coupon-list-empty-tip-color: var(--van-text-color-secondary); @coupon-list-empty-tip-font-size: var(--van-font-size-md); @coupon-list-empty-tip-line-height: var(--van-line-height-md); diff --git a/packages/vant/src/coupon/var.less b/packages/vant/src/coupon/var.less index 454ab3dfb..55fd55f93 100644 --- a/packages/vant/src/coupon/var.less +++ b/packages/vant/src/coupon/var.less @@ -12,7 +12,7 @@ @coupon-amount-font-size: 30px; @coupon-currency-font-size: 40%; @coupon-name-font-size: var(--van-font-size-md); -@coupon-disabled-text-color: var(--van-gray-6); +@coupon-disabled-text-color: var(--van-text-color-secondary); @coupon-description-padding: var(--van-padding-xs) var(--van-padding-md); @coupon-description-border-color: var(--van-border-color); @coupon-corner-checkbox-icon-color: var(--van-danger-color); diff --git a/packages/vant/src/divider/README.md b/packages/vant/src/divider/README.md index 7f987603a..69d286a65 100644 --- a/packages/vant/src/divider/README.md +++ b/packages/vant/src/divider/README.md @@ -83,13 +83,13 @@ import type { DividerProps, DividerContentPosition } from 'vant'; The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider). -| Name | Default Value | Description | -| --------------------------------- | ------------------------- | ----------- | -| --van-divider-margin | _var(--van-padding-md) 0_ | - | -| --van-divider-text-color | _var(--van-gray-6)_ | - | -| --van-divider-font-size | _var(--van-font-size-md)_ | - | -| --van-divider-line-height | _24px_ | - | -| --van-divider-border-color | _var(--van-border-color)_ | - | -| --van-divider-content-padding | _var(--van-padding-md)_ | - | -| --van-divider-content-left-width | _10%_ | - | -| --van-divider-content-right-width | _10%_ | - | +| Name | Default Value | Description | +| --- | --- | --- | +| --van-divider-margin | _var(--van-padding-md) 0_ | - | +| --van-divider-text-color | _var(--van-text-color-secondary)_ | - | +| --van-divider-font-size | _var(--van-font-size-md)_ | - | +| --van-divider-line-height | _24px_ | - | +| --van-divider-border-color | _var(--van-border-color)_ | - | +| --van-divider-content-padding | _var(--van-padding-md)_ | - | +| --van-divider-content-left-width | _10%_ | - | +| --van-divider-content-right-width | _10%_ | - | diff --git a/packages/vant/src/divider/README.zh-CN.md b/packages/vant/src/divider/README.zh-CN.md index 6b32f2b2f..f56ec1955 100644 --- a/packages/vant/src/divider/README.zh-CN.md +++ b/packages/vant/src/divider/README.zh-CN.md @@ -93,13 +93,13 @@ import type { DividerProps, DividerContentPosition } from 'vant'; 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。 -| 名称 | 默认值 | 描述 | -| --------------------------------- | ------------------------- | ---- | -| --van-divider-margin | _var(--van-padding-md) 0_ | - | -| --van-divider-text-color | _var(--van-gray-6)_ | - | -| --van-divider-font-size | _var(--van-font-size-md)_ | - | -| --van-divider-line-height | _24px_ | - | -| --van-divider-border-color | _var(--van-border-color)_ | - | -| --van-divider-content-padding | _var(--van-padding-md)_ | - | -| --van-divider-content-left-width | _10%_ | - | -| --van-divider-content-right-width | _10%_ | - | +| 名称 | 默认值 | 描述 | +| --------------------------------- | --------------------------------- | ---- | +| --van-divider-margin | _var(--van-padding-md) 0_ | - | +| --van-divider-text-color | _var(--van-text-color-secondary)_ | - | +| --van-divider-font-size | _var(--van-font-size-md)_ | - | +| --van-divider-line-height | _24px_ | - | +| --van-divider-border-color | _var(--van-border-color)_ | - | +| --van-divider-content-padding | _var(--van-padding-md)_ | - | +| --van-divider-content-left-width | _10%_ | - | +| --van-divider-content-right-width | _10%_ | - | diff --git a/packages/vant/src/divider/var.less b/packages/vant/src/divider/var.less index 3913aafcf..3d839fcd6 100644 --- a/packages/vant/src/divider/var.less +++ b/packages/vant/src/divider/var.less @@ -1,7 +1,7 @@ @import '../style/var.less'; @divider-margin: var(--van-padding-md) 0; -@divider-text-color: var(--van-gray-6); +@divider-text-color: var(--van-text-color-secondary); @divider-font-size: var(--van-font-size-md); @divider-line-height: 24px; @divider-border-color: var(--van-border-color); diff --git a/packages/vant/src/dropdown-menu/README.md b/packages/vant/src/dropdown-menu/README.md index 0e23e1437..10d9e23dd 100644 --- a/packages/vant/src/dropdown-menu/README.md +++ b/packages/vant/src/dropdown-menu/README.md @@ -238,7 +238,7 @@ The component provides the following CSS variables, which can be used to customi | --van-dropdown-menu-title-font-size | _15px_ | - | | --van-dropdown-menu-title-text-color | _var(--van-text-color)_ | - | | --van-dropdown-menu-title-active-text-color | _var(--van-danger-color)_ | - | -| --van-dropdown-menu-title-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-dropdown-menu-title-disabled-text-color | _var(--van-text-color-secondary)_ | - | | --van-dropdown-menu-title-padding | _0 var(--van-padding-xs)_ | - | | --van-dropdown-menu-title-line-height | _var(--van-line-height-lg)_ | - | | --van-dropdown-menu-option-active-color | _var(--van-danger-color)_ | - | diff --git a/packages/vant/src/dropdown-menu/README.zh-CN.md b/packages/vant/src/dropdown-menu/README.zh-CN.md index 6e71c3fb2..d2c14a1c4 100644 --- a/packages/vant/src/dropdown-menu/README.zh-CN.md +++ b/packages/vant/src/dropdown-menu/README.zh-CN.md @@ -242,7 +242,7 @@ dropdownItemRef.value?.toggle(); | --van-dropdown-menu-title-font-size | _15px_ | - | | --van-dropdown-menu-title-text-color | _var(--van-text-color)_ | - | | --van-dropdown-menu-title-active-text-color | _var(--van-danger-color)_ | - | -| --van-dropdown-menu-title-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-dropdown-menu-title-disabled-text-color | _var(--van-text-color-secondary)_ | - | | --van-dropdown-menu-title-padding | _0 var(--van-padding-xs)_ | - | | --van-dropdown-menu-title-line-height | _var(--van-line-height-lg)_ | - | | --van-dropdown-menu-option-active-color | _var(--van-danger-color)_ | - | diff --git a/packages/vant/src/dropdown-menu/var.less b/packages/vant/src/dropdown-menu/var.less index d929b5ae7..05c4f5678 100644 --- a/packages/vant/src/dropdown-menu/var.less +++ b/packages/vant/src/dropdown-menu/var.less @@ -6,7 +6,7 @@ @dropdown-menu-title-font-size: 15px; @dropdown-menu-title-text-color: var(--van-text-color); @dropdown-menu-title-active-text-color: var(--van-danger-color); -@dropdown-menu-title-disabled-text-color: var(--van-gray-6); +@dropdown-menu-title-disabled-text-color: var(--van-text-color-secondary); @dropdown-menu-title-padding: 0 var(--van-padding-xs); @dropdown-menu-title-line-height: var(--van-line-height-lg); @dropdown-menu-option-active-color: var(--van-danger-color); diff --git a/packages/vant/src/empty/README.md b/packages/vant/src/empty/README.md index 06f5db837..1730ad88a 100644 --- a/packages/vant/src/empty/README.md +++ b/packages/vant/src/empty/README.md @@ -106,7 +106,7 @@ The component provides the following CSS variables, which can be used to customi | --van-empty-image-size | _160px_ | - | | --van-empty-description-margin-top | _var(--van-padding-md)_ | - | | --van-empty-description-padding | _0 60px_ | - | -| --van-empty-description-color | _var(--van-gray-6)_ | - | +| --van-empty-description-color | _var(--van-text-color-secondary)_ | - | | --van-empty-description-font-size | _var(--van-font-size-md)_ | - | | --van-empty-description-line-height | _var(--van-line-height-md)_ | - | | --van-empty-bottom-margin-top | _24px_ | - | diff --git a/packages/vant/src/empty/README.zh-CN.md b/packages/vant/src/empty/README.zh-CN.md index c68aca59f..c5a9fc64e 100644 --- a/packages/vant/src/empty/README.zh-CN.md +++ b/packages/vant/src/empty/README.zh-CN.md @@ -105,13 +105,13 @@ import type { EmptyProps } from 'vant'; 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。 -| 名称 | 默认值 | 描述 | -| ----------------------------------- | --------------------------- | ---- | -| --van-empty-padding | _var(--van-padding-xl) 0_ | - | -| --van-empty-image-size | _160px_ | - | -| --van-empty-description-margin-top | _var(--van-padding-md)_ | - | -| --van-empty-description-padding | _0 60px_ | - | -| --van-empty-description-color | _var(--van-gray-6)_ | - | -| --van-empty-description-font-size | _var(--van-font-size-md)_ | - | -| --van-empty-description-line-height | _var(--van-line-height-md)_ | - | -| --van-empty-bottom-margin-top | _24px_ | - | +| 名称 | 默认值 | 描述 | +| --- | --- | --- | +| --van-empty-padding | _var(--van-padding-xl) 0_ | - | +| --van-empty-image-size | _160px_ | - | +| --van-empty-description-margin-top | _var(--van-padding-md)_ | - | +| --van-empty-description-padding | _0 60px_ | - | +| --van-empty-description-color | _var(--van-text-color-secondary)_ | - | +| --van-empty-description-font-size | _var(--van-font-size-md)_ | - | +| --van-empty-description-line-height | _var(--van-line-height-md)_ | - | +| --van-empty-bottom-margin-top | _24px_ | - | diff --git a/packages/vant/src/empty/var.less b/packages/vant/src/empty/var.less index fb80fedc5..3dc9a4e75 100644 --- a/packages/vant/src/empty/var.less +++ b/packages/vant/src/empty/var.less @@ -4,7 +4,7 @@ @empty-image-size: 160px; @empty-description-margin-top: var(--van-padding-md); @empty-description-padding: 0 60px; -@empty-description-color: var(--van-gray-6); +@empty-description-color: var(--van-text-color-secondary); @empty-description-font-size: var(--van-font-size-md); @empty-description-line-height: var(--van-line-height-md); @empty-bottom-margin-top: 24px; diff --git a/packages/vant/src/image/README.md b/packages/vant/src/image/README.md index d870bf00d..fdab09b72 100644 --- a/packages/vant/src/image/README.md +++ b/packages/vant/src/image/README.md @@ -130,7 +130,7 @@ The component provides the following CSS variables, which can be used to customi | Name | Default Value | Description | | --- | --- | --- | -| --van-image-placeholder-text-color | _var(--van-gray-6)_ | - | +| --van-image-placeholder-text-color | _var(--van-text-color-secondary)_ | - | | --van-image-placeholder-font-size | _var(--van-font-size-md)_ | - | | --van-image-placeholder-background-color | _var(--van-background-color)_ | - | | --van-image-loading-icon-size | _32px_ | - | diff --git a/packages/vant/src/image/README.zh-CN.md b/packages/vant/src/image/README.zh-CN.md index 670f76d67..e5432cd97 100644 --- a/packages/vant/src/image/README.zh-CN.md +++ b/packages/vant/src/image/README.zh-CN.md @@ -158,7 +158,7 @@ import type { ImageFit, ImageProps } from 'vant'; | 名称 | 默认值 | 描述 | | --- | --- | --- | -| --van-image-placeholder-text-color | _var(--van-gray-6)_ | - | +| --van-image-placeholder-text-color | _var(--van-text-color-secondary)_ | - | | --van-image-placeholder-font-size | _var(--van-font-size-md)_ | - | | --van-image-placeholder-background-color | _var(--van-background-color)_ | - | | --van-image-loading-icon-size | _32px_ | - | diff --git a/packages/vant/src/image/var.less b/packages/vant/src/image/var.less index cbfee2c9e..4a77c0ac8 100644 --- a/packages/vant/src/image/var.less +++ b/packages/vant/src/image/var.less @@ -1,6 +1,6 @@ @import '../style/var.less'; -@image-placeholder-text-color: var(--van-gray-6); +@image-placeholder-text-color: var(--van-text-color-secondary); @image-placeholder-font-size: var(--van-font-size-md); @image-placeholder-background-color: var(--van-background-color); @image-loading-icon-size: 32px; diff --git a/packages/vant/src/list/README.md b/packages/vant/src/list/README.md index 88063d9f3..90cf933e4 100644 --- a/packages/vant/src/list/README.md +++ b/packages/vant/src/list/README.md @@ -225,9 +225,9 @@ listRef.value?.check(); The component provides the following CSS variables, which can be used to customize styles. Please refer to [ConfigProvider component](#/en-US/config-provider). -| Name | Default Value | Description | -| ---------------------------- | ------------------------- | ----------- | -| --van-list-text-color | _var(--van-gray-6)_ | - | -| --van-list-text-font-size | _var(--van-font-size-md)_ | - | -| --van-list-text-line-height | _50px_ | - | -| --van-list-loading-icon-size | _16px_ | - | +| Name | Default Value | Description | +| --- | --- | --- | +| --van-list-text-color | _var(--van-text-color-secondary)_ | - | +| --van-list-text-font-size | _var(--van-font-size-md)_ | - | +| --van-list-text-line-height | _50px_ | - | +| --van-list-loading-icon-size | _16px_ | - | diff --git a/packages/vant/src/list/README.zh-CN.md b/packages/vant/src/list/README.zh-CN.md index 70b21b431..7c301a738 100644 --- a/packages/vant/src/list/README.zh-CN.md +++ b/packages/vant/src/list/README.zh-CN.md @@ -240,12 +240,12 @@ listRef.value?.check(); 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。 -| 名称 | 默认值 | 描述 | -| ---------------------------- | ------------------------- | ---- | -| --van-list-text-color | _var(--van-gray-6)_ | - | -| --van-list-text-font-size | _var(--van-font-size-md)_ | - | -| --van-list-text-line-height | _50px_ | - | -| --van-list-loading-icon-size | _16px_ | - | +| 名称 | 默认值 | 描述 | +| ---------------------------- | --------------------------------- | ---- | +| --van-list-text-color | _var(--van-text-color-secondary)_ | - | +| --van-list-text-font-size | _var(--van-font-size-md)_ | - | +| --van-list-text-line-height | _50px_ | - | +| --van-list-loading-icon-size | _16px_ | - | ## 常见问题 diff --git a/packages/vant/src/list/var.less b/packages/vant/src/list/var.less index c18cd8317..c6a3c1819 100644 --- a/packages/vant/src/list/var.less +++ b/packages/vant/src/list/var.less @@ -1,6 +1,6 @@ @import '../style/var.less'; -@list-text-color: var(--van-gray-6); +@list-text-color: var(--van-text-color-secondary); @list-text-font-size: var(--van-font-size-md); @list-text-line-height: 50px; @list-loading-icon-size: 16px; diff --git a/packages/vant/src/loading/README.md b/packages/vant/src/loading/README.md index 08d590ca1..9bac42b48 100644 --- a/packages/vant/src/loading/README.md +++ b/packages/vant/src/loading/README.md @@ -101,7 +101,7 @@ The component provides the following CSS variables, which can be used to customi | Name | Default Value | Description | | --- | --- | --- | -| --van-loading-text-color | _var(--van-gray-6)_ | - | +| --van-loading-text-color | _var(--van-text-color-secondary)_ | - | | --van-loading-text-font-size | _var(--van-font-size-md)_ | - | | --van-loading-spinner-color | _var(--van-gray-5)_ | - | | --van-loading-spinner-size | _30px_ | - | diff --git a/packages/vant/src/loading/README.zh-CN.md b/packages/vant/src/loading/README.zh-CN.md index 9fae21614..7523577e4 100644 --- a/packages/vant/src/loading/README.zh-CN.md +++ b/packages/vant/src/loading/README.zh-CN.md @@ -109,10 +109,10 @@ import type { LoadingType, LoadingProps } from 'vant'; 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。 -| 名称 | 默认值 | 描述 | -| ---------------------------------------- | ------------------------- | ---- | -| --van-loading-text-color | _var(--van-gray-6)_ | - | -| --van-loading-text-font-size | _var(--van-font-size-md)_ | - | -| --van-loading-spinner-color | _var(--van-gray-5)_ | - | -| --van-loading-spinner-size | _30px_ | - | -| --van-loading-spinner-animation-duration | _0.8s_ | - | +| 名称 | 默认值 | 描述 | +| --- | --- | --- | +| --van-loading-text-color | _var(--van-text-color-secondary)_ | - | +| --van-loading-text-font-size | _var(--van-font-size-md)_ | - | +| --van-loading-spinner-color | _var(--van-gray-5)_ | - | +| --van-loading-spinner-size | _30px_ | - | +| --van-loading-spinner-animation-duration | _0.8s_ | - | diff --git a/packages/vant/src/loading/var.less b/packages/vant/src/loading/var.less index 430162829..98abf52f9 100644 --- a/packages/vant/src/loading/var.less +++ b/packages/vant/src/loading/var.less @@ -1,6 +1,6 @@ @import '../style/var.less'; -@loading-text-color: var(--van-gray-6); +@loading-text-color: var(--van-text-color-secondary); @loading-text-font-size: var(--van-font-size-md); @loading-spinner-color: var(--van-gray-5); @loading-spinner-size: 30px; diff --git a/packages/vant/src/password-input/README.md b/packages/vant/src/password-input/README.md index 645c26efa..2963eebf2 100644 --- a/packages/vant/src/password-input/README.md +++ b/packages/vant/src/password-input/README.md @@ -161,7 +161,7 @@ The component provides the following CSS variables, which can be used to customi | --van-password-input-font-size | _20px_ | - | | --van-password-input-border-radius | _6px_ | - | | --van-password-input-background-color | _var(--van-background-color-light)_ | - | -| --van-password-input-info-color | _var(--van-gray-6)_ | - | +| --van-password-input-info-color | _var(--van-text-color-secondary)_ | - | | --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_ | - | diff --git a/packages/vant/src/password-input/README.zh-CN.md b/packages/vant/src/password-input/README.zh-CN.md index 876be16e3..0eae9c5d2 100644 --- a/packages/vant/src/password-input/README.zh-CN.md +++ b/packages/vant/src/password-input/README.zh-CN.md @@ -171,7 +171,7 @@ export default { | --van-password-input-font-size | _20px_ | - | | --van-password-input-border-radius | _6px_ | - | | --van-password-input-background-color | _var(--van-background-color-light)_ | - | -| --van-password-input-info-color | _var(--van-gray-6)_ | - | +| --van-password-input-info-color | _var(--van-text-color-secondary)_ | - | | --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_ | - | diff --git a/packages/vant/src/password-input/var.less b/packages/vant/src/password-input/var.less index c65e5c5b3..36cb202bf 100644 --- a/packages/vant/src/password-input/var.less +++ b/packages/vant/src/password-input/var.less @@ -5,7 +5,7 @@ @password-input-font-size: 20px; @password-input-border-radius: 6px; @password-input-background-color: var(--van-background-color-light); -@password-input-info-color: var(--van-gray-6); +@password-input-info-color: var(--van-text-color-secondary); @password-input-info-font-size: var(--van-font-size-md); @password-input-error-info-color: var(--van-danger-color); @password-input-dot-size: 10px; diff --git a/packages/vant/src/picker/README.md b/packages/vant/src/picker/README.md index c5ae91fca..ccc65ae40 100644 --- a/packages/vant/src/picker/README.md +++ b/packages/vant/src/picker/README.md @@ -422,7 +422,7 @@ The component provides the following CSS variables, which can be used to customi | --van-picker-action-padding | _0 var(--van-padding-md)_ | - | | --van-picker-action-font-size | _var(--van-font-size-md)_ | - | | --van-picker-confirm-action-color | _var(--van-text-link-color)_ | - | -| --van-picker-cancel-action-color | _var(--van-gray-6)_ | - | +| --van-picker-cancel-action-color | _var(--van-text-color-secondary)_ | - | | --van-picker-option-padding | _0 var(--van-padding-base)_ | - | | --van-picker-option-font-size | _var(--van-font-size-lg)_ | - | | --van-picker-option-text-color | _var(--van-black)_ | - | diff --git a/packages/vant/src/picker/README.zh-CN.md b/packages/vant/src/picker/README.zh-CN.md index 7fb6d81ee..5ec50d541 100644 --- a/packages/vant/src/picker/README.zh-CN.md +++ b/packages/vant/src/picker/README.zh-CN.md @@ -447,7 +447,7 @@ pickerRef.value?.confirm(); | --van-picker-action-padding | _0 var(--van-padding-md)_ | - | | --van-picker-action-font-size | _var(--van-font-size-md)_ | - | | --van-picker-confirm-action-color | _var(--van-text-link-color)_ | - | -| --van-picker-cancel-action-color | _var(--van-gray-6)_ | - | +| --van-picker-cancel-action-color | _var(--van-text-color-secondary)_ | - | | --van-picker-option-padding | _0 var(--van-padding-base)_ | - | | --van-picker-option-font-size | _var(--van-font-size-lg)_ | - | | --van-picker-option-text-color | _var(--van-black)_ | - | diff --git a/packages/vant/src/picker/var.less b/packages/vant/src/picker/var.less index c21d6968e..c852c0259 100644 --- a/packages/vant/src/picker/var.less +++ b/packages/vant/src/picker/var.less @@ -7,7 +7,7 @@ @picker-action-padding: 0 var(--van-padding-md); @picker-action-font-size: var(--van-font-size-md); @picker-confirm-action-color: var(--van-text-link-color); -@picker-cancel-action-color: var(--van-gray-6); +@picker-cancel-action-color: var(--van-text-color-secondary); @picker-option-padding: 0 var(--van-padding-base); @picker-option-font-size: var(--van-font-size-lg); @picker-option-text-color: var(--van-black); diff --git a/packages/vant/src/popover/README.md b/packages/vant/src/popover/README.md index a5fbbdb83..0989259b8 100644 --- a/packages/vant/src/popover/README.md +++ b/packages/vant/src/popover/README.md @@ -289,4 +289,4 @@ The component provides the following CSS variables, which can be used to customi | --van-popover-light-action-disabled-text-color | _var(--van-gray-5)_ | - | | --van-popover-dark-text-color | _var(--van-white)_ | - | | --van-popover-dark-background-color | _#4a4a4a_ | - | -| --van-popover-dark-action-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-popover-dark-action-disabled-text-color | _var(--van-text-color-secondary)_ | - | diff --git a/packages/vant/src/popover/README.zh-CN.md b/packages/vant/src/popover/README.zh-CN.md index 595b6a024..ce825469b 100644 --- a/packages/vant/src/popover/README.zh-CN.md +++ b/packages/vant/src/popover/README.zh-CN.md @@ -301,7 +301,7 @@ import type { | --van-popover-light-action-disabled-text-color | _var(--van-gray-5)_ | - | | --van-popover-dark-text-color | _var(--van-white)_ | - | | --van-popover-dark-background-color | _#4a4a4a_ | - | -| --van-popover-dark-action-disabled-text-color | _var(--van-gray-6)_ | - | +| --van-popover-dark-action-disabled-text-color | _var(--van-text-color-secondary)_ | - | ## 常见问题 diff --git a/packages/vant/src/popover/var.less b/packages/vant/src/popover/var.less index d0cbf7f4a..1c1e03c17 100644 --- a/packages/vant/src/popover/var.less +++ b/packages/vant/src/popover/var.less @@ -12,4 +12,4 @@ @popover-light-action-disabled-text-color: var(--van-gray-5); @popover-dark-text-color: var(--van-white); @popover-dark-background-color: #4a4a4a; -@popover-dark-action-disabled-text-color: var(--van-gray-6); +@popover-dark-action-disabled-text-color: var(--van-text-color-secondary); diff --git a/packages/vant/src/pull-refresh/README.md b/packages/vant/src/pull-refresh/README.md index 148c47dc1..ad17d9df3 100644 --- a/packages/vant/src/pull-refresh/README.md +++ b/packages/vant/src/pull-refresh/README.md @@ -153,5 +153,5 @@ The component provides the following CSS variables, which can be used to customi | --- | --- | --- | | --van-pull-refresh-head-height | _50px_ | - | | --van-pull-refresh-head-font-size | _var(--van-font-size-md)_ | - | -| --van-pull-refresh-head-text-color | _var(--van-gray-6)_ | - | +| --van-pull-refresh-head-text-color | _var(--van-text-color-secondary)_ | - | | --van-pull-refresh-loading-icon-size | _16px_ | - | diff --git a/packages/vant/src/pull-refresh/README.zh-CN.md b/packages/vant/src/pull-refresh/README.zh-CN.md index 5bf8982c2..8fb6ba86d 100644 --- a/packages/vant/src/pull-refresh/README.zh-CN.md +++ b/packages/vant/src/pull-refresh/README.zh-CN.md @@ -152,12 +152,12 @@ import type { PullRefreshProps } from 'vant'; 组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。 -| 名称 | 默认值 | 描述 | -| ------------------------------------ | ------------------------- | ---- | -| --van-pull-refresh-head-height | _50px_ | - | -| --van-pull-refresh-head-font-size | _var(--van-font-size-md)_ | - | -| --van-pull-refresh-head-text-color | _var(--van-gray-6)_ | - | -| --van-pull-refresh-loading-icon-size | _16px_ | - | +| 名称 | 默认值 | 描述 | +| --- | --- | --- | +| --van-pull-refresh-head-height | _50px_ | - | +| --van-pull-refresh-head-font-size | _var(--van-font-size-md)_ | - | +| --van-pull-refresh-head-text-color | _var(--van-text-color-secondary)_ | - | +| --van-pull-refresh-loading-icon-size | _16px_ | - | ## 常见问题 diff --git a/packages/vant/src/pull-refresh/var.less b/packages/vant/src/pull-refresh/var.less index 504c542b7..a74204beb 100644 --- a/packages/vant/src/pull-refresh/var.less +++ b/packages/vant/src/pull-refresh/var.less @@ -2,5 +2,5 @@ @pull-refresh-head-height: 50px; @pull-refresh-head-font-size: var(--van-font-size-md); -@pull-refresh-head-text-color: var(--van-gray-6); +@pull-refresh-head-text-color: var(--van-text-color-secondary); @pull-refresh-loading-icon-size: 16px; diff --git a/packages/vant/src/share-sheet/README.md b/packages/vant/src/share-sheet/README.md index 59c0fba78..241dca69e 100644 --- a/packages/vant/src/share-sheet/README.md +++ b/packages/vant/src/share-sheet/README.md @@ -239,7 +239,7 @@ The component provides the following CSS variables, which can be used to customi | --van-share-sheet-title-color | _var(--van-text-color)_ | - | | --van-share-sheet-title-font-size | _var(--van-font-size-md)_ | - | | --van-share-sheet-title-line-height | _var(--van-line-height-md)_ | - | -| --van-share-sheet-description-color | _var(--van-gray-6)_ | - | +| --van-share-sheet-description-color | _var(--van-text-color-secondary)_ | - | | --van-share-sheet-description-font-size | _var(--van-font-size-sm)_ | - | | --van-share-sheet-description-line-height | _16px_ | - | | --van-share-sheet-icon-size | _48px_ | - | diff --git a/packages/vant/src/share-sheet/README.zh-CN.md b/packages/vant/src/share-sheet/README.zh-CN.md index 1e4870077..c8681c05d 100644 --- a/packages/vant/src/share-sheet/README.zh-CN.md +++ b/packages/vant/src/share-sheet/README.zh-CN.md @@ -253,7 +253,7 @@ import type { | --van-share-sheet-title-color | _var(--van-text-color)_ | - | | --van-share-sheet-title-font-size | _var(--van-font-size-md)_ | - | | --van-share-sheet-title-line-height | _var(--van-line-height-md)_ | - | -| --van-share-sheet-description-color | _var(--van-gray-6)_ | - | +| --van-share-sheet-description-color | _var(--van-text-color-secondary)_ | - | | --van-share-sheet-description-font-size | _var(--van-font-size-sm)_ | - | | --van-share-sheet-description-line-height | _16px_ | - | | --van-share-sheet-icon-size | _48px_ | - | diff --git a/packages/vant/src/share-sheet/var.less b/packages/vant/src/share-sheet/var.less index 27b45aeba..4f25346c6 100644 --- a/packages/vant/src/share-sheet/var.less +++ b/packages/vant/src/share-sheet/var.less @@ -5,7 +5,7 @@ @share-sheet-title-color: var(--van-text-color); @share-sheet-title-font-size: var(--van-font-size-md); @share-sheet-title-line-height: var(--van-line-height-md); -@share-sheet-description-color: var(--van-gray-6); +@share-sheet-description-color: var(--van-text-color-secondary); @share-sheet-description-font-size: var(--van-font-size-sm); @share-sheet-description-line-height: 16px; @share-sheet-icon-size: 48px; diff --git a/packages/vant/src/sidebar/demo/index.vue b/packages/vant/src/sidebar/demo/index.vue index 3502b4c8f..d4f025c5c 100644 --- a/packages/vant/src/sidebar/demo/index.vue +++ b/packages/vant/src/sidebar/demo/index.vue @@ -79,7 +79,7 @@ const onChange = (index: number) => Toast(`${t('title')} ${index + 1}`); &-title { margin-bottom: 16px; - color: var(--van-gray-6); + color: var(--van-text-color-secondary); font-weight: normal; font-size: 14px; } diff --git a/packages/vant/src/step/var.less b/packages/vant/src/step/var.less index 2422b79e5..2f7b55c18 100644 --- a/packages/vant/src/step/var.less +++ b/packages/vant/src/step/var.less @@ -1,6 +1,6 @@ @import '../style/var.less'; -@step-text-color: var(--van-gray-6); +@step-text-color: var(--van-text-color-secondary); @step-active-color: var(--van-success-color); @step-process-text-color: var(--van-text-color); @step-font-size: var(--van-font-size-md); diff --git a/packages/vant/src/steps/README.md b/packages/vant/src/steps/README.md index c02eef013..de1bc1b00 100644 --- a/packages/vant/src/steps/README.md +++ b/packages/vant/src/steps/README.md @@ -117,7 +117,7 @@ The component provides the following CSS variables, which can be used to customi | Name | Default Value | Description | | --- | --- | --- | -| --van-step-text-color | _var(--van-gray-6)_ | - | +| --van-step-text-color | _var(--van-text-color-secondary)_ | - | | --van-step-active-color | _var(--van-success-color)_ | - | | --van-step-process-text-color | _var(--van-text-color)_ | - | | --van-step-font-size | _var(--van-font-size-md)_ | - | diff --git a/packages/vant/src/steps/README.zh-CN.md b/packages/vant/src/steps/README.zh-CN.md index 9869ffe12..1fc3e5c57 100644 --- a/packages/vant/src/steps/README.zh-CN.md +++ b/packages/vant/src/steps/README.zh-CN.md @@ -123,7 +123,7 @@ import type { StepsProps, StepsDirection } from 'vant'; | 名称 | 默认值 | 描述 | | --- | --- | --- | -| --van-step-text-color | _var(--van-gray-6)_ | - | +| --van-step-text-color | _var(--van-text-color-secondary)_ | - | | --van-step-active-color | _var(--van-success-color)_ | - | | --van-step-process-text-color | _var(--van-text-color)_ | - | | --van-step-font-size | _var(--van-font-size-md)_ | - | diff --git a/packages/vant/src/style/var.less b/packages/vant/src/style/var.less index 42f92081f..b39bae0aa 100644 --- a/packages/vant/src/style/var.less +++ b/packages/vant/src/style/var.less @@ -26,6 +26,7 @@ @danger-color: var(--van-red); @warning-color: var(--van-orange); @text-color: var(--van-gray-8); +@text-color-secondary: var(--van-gray-6); @active-color: var(--van-gray-2); @active-opacity: 0.7; @disabled-opacity: 0.5; diff --git a/packages/vant/src/submit-bar/demo/index.vue b/packages/vant/src/submit-bar/demo/index.vue index 54624ffcb..8866af83c 100644 --- a/packages/vant/src/submit-bar/demo/index.vue +++ b/packages/vant/src/submit-bar/demo/index.vue @@ -73,7 +73,6 @@ const onClickLink = () => Toast(t('clickLink')); -Ï