mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
Merge branch 'dev' into next
This commit is contained in:
commit
722f73dfbe
@ -243,15 +243,15 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-action-sheet-description-color | _var(--van-text-color-2)_ | - |
|
||||
| --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-light)_ | - |
|
||||
| --van-action-sheet-item-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --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-text-color-tertiary)_ | - |
|
||||
| --van-action-sheet-subname-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-action-sheet-item-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-action-sheet-subname-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -255,15 +255,15 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-action-sheet-description-color | _var(--van-text-color-2)_ | - |
|
||||
| --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-light)_ | - |
|
||||
| --van-action-sheet-item-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --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-text-color-tertiary)_ | - |
|
||||
| --van-action-sheet-subname-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-action-sheet-item-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-action-sheet-subname-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -4,15 +4,15 @@
|
||||
--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-text-color-secondary);
|
||||
--van-action-sheet-description-color: var(--van-text-color-2);
|
||||
--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-light);
|
||||
--van-action-sheet-item-font-size: var(--van-font-size-lg);
|
||||
--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-text-color-tertiary);
|
||||
--van-action-sheet-subname-color: var(--van-text-color-secondary);
|
||||
--van-action-sheet-item-disabled-text-color: var(--van-text-color-3);
|
||||
--van-action-sheet-subname-color: var(--van-text-color-2);
|
||||
--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;
|
||||
|
@ -138,14 +138,14 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-address-list-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
| --van-address-list-add-button-z-index | _999_ | - |
|
||||
| --van-address-list-item-padding | _var(--van-padding-sm)_ | - |
|
||||
| --van-address-list-item-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-address-list-item-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-address-list-item-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-address-list-item-font-size | _13px_ | - |
|
||||
| --van-address-list-item-line-height | _var(--van-line-height-sm)_ | - |
|
||||
| --van-address-list-item-radio-icon-color | _var(--van-danger-color)_ | - |
|
||||
|
@ -138,14 +138,14 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-address-list-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
| --van-address-list-add-button-z-index | _999_ | - |
|
||||
| --van-address-list-item-padding | _var(--van-padding-sm)_ | - |
|
||||
| --van-address-list-item-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-address-list-item-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-address-list-item-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-address-list-item-font-size | _13px_ | - |
|
||||
| --van-address-list-item-line-height | _var(--van-line-height-sm)_ | - |
|
||||
| --van-address-list-item-radio-icon-color | _var(--van-danger-color)_ | - |
|
||||
|
@ -1,13 +1,13 @@
|
||||
:root {
|
||||
--van-address-list-padding: var(--van-padding-sm) var(--van-padding-sm) 80px;
|
||||
--van-address-list-disabled-text-color: var(--van-text-color-secondary);
|
||||
--van-address-list-disabled-text-color: var(--van-text-color-2);
|
||||
--van-address-list-disabled-text-padding: calc(var(--van-padding-base) * 5) 0;
|
||||
--van-address-list-disabled-text-font-size: var(--van-font-size-md);
|
||||
--van-address-list-disabled-text-line-height: var(--van-line-height-md);
|
||||
--van-address-list-add-button-z-index: 999;
|
||||
--van-address-list-item-padding: var(--van-padding-sm);
|
||||
--van-address-list-item-text-color: var(--van-text-color);
|
||||
--van-address-list-item-disabled-text-color: var(--van-text-color-tertiary);
|
||||
--van-address-list-item-disabled-text-color: var(--van-text-color-3);
|
||||
--van-address-list-item-font-size: 13px;
|
||||
--van-address-list-item-line-height: var(--van-line-height-sm);
|
||||
--van-address-list-item-radio-icon-color: var(--van-danger-color);
|
||||
|
@ -403,6 +403,6 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-calendar-info-font-size | _var(--van-font-size-xs)_ | - |
|
||||
| --van-calendar-info-line-height | _var(--van-line-height-xs)_ | - |
|
||||
| --van-calendar-selected-day-background | _var(--van-danger-color)_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-confirm-button-height | _36px_ | - |
|
||||
| --van-calendar-confirm-button-margin | _7px 0_ | - |
|
||||
|
@ -409,7 +409,7 @@ calendarRef.value?.reset();
|
||||
| --van-calendar-info-font-size | _var(--van-font-size-xs)_ | - |
|
||||
| --van-calendar-info-line-height | _var(--van-line-height-xs)_ | - |
|
||||
| --van-calendar-selected-day-background | _var(--van-danger-color)_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-calendar-day-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-calendar-confirm-button-height | _36px_ | - |
|
||||
| --van-calendar-confirm-button-margin | _7px 0_ | - |
|
||||
|
||||
|
@ -21,7 +21,7 @@
|
||||
--van-calendar-info-font-size: var(--van-font-size-xs);
|
||||
--van-calendar-info-line-height: var(--van-line-height-xs);
|
||||
--van-calendar-selected-day-background: var(--van-danger-color);
|
||||
--van-calendar-day-disabled-color: var(--van-text-color-tertiary);
|
||||
--van-calendar-day-disabled-color: var(--van-text-color-3);
|
||||
--van-calendar-confirm-button-height: 36px;
|
||||
--van-calendar-confirm-button-margin: 7px 0;
|
||||
}
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-card-num-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-card-origin-price-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-card-num-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-card-num-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-card-origin-price-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-card-num-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -9,8 +9,8 @@
|
||||
--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-text-color-secondary);
|
||||
--van-card-num-color: var(--van-text-color-secondary);
|
||||
--van-card-origin-price-color: var(--van-text-color-2);
|
||||
--van-card-num-color: var(--van-text-color-2);
|
||||
--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);
|
||||
|
@ -311,4 +311,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-text-color-secondary)_ | - |
|
||||
| --van-cascader-unselected-tab-color | _var(--van-text-color-2)_ | - |
|
||||
|
@ -311,7 +311,7 @@ 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)_ | - |
|
||||
@ -322,6 +322,6 @@ import type { CascaderProps, CascaderOption, CascaderFieldNames } from 'vant';
|
||||
| --van-cascader-tabs-height | _48px_ | - |
|
||||
| --van-cascader-active-color | _var(--van-danger-color)_ | - |
|
||||
| --van-cascader-options-height | _384px_ | - |
|
||||
| --van-cascader-option-disabled-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-cascader-option-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-cascader-tab-color | _var(--van-text-color)_ | - |
|
||||
| --van-cascader-unselected-tab-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-cascader-unselected-tab-color | _var(--van-text-color-2)_ | - |
|
||||
|
@ -9,9 +9,9 @@
|
||||
--van-cascader-tabs-height: 48px;
|
||||
--van-cascader-active-color: var(--van-danger-color);
|
||||
--van-cascader-options-height: 384px;
|
||||
--van-cascader-option-disabled-color: var(--van-text-color-tertiary);
|
||||
--van-cascader-option-disabled-color: var(--van-text-color-3);
|
||||
--van-cascader-tab-color: var(--van-text-color);
|
||||
--van-cascader-unselected-tab-color: var(--van-text-color-secondary);
|
||||
--van-cascader-unselected-tab-color: var(--van-text-color-2);
|
||||
}
|
||||
|
||||
.van-cascader {
|
||||
|
@ -1,6 +1,6 @@
|
||||
:root {
|
||||
--van-cell-group-background: var(--van-background-light);
|
||||
--van-cell-group-title-color: var(--van-text-color-secondary);
|
||||
--van-cell-group-title-color: var(--van-text-color-2);
|
||||
--van-cell-group-title-padding: var(--van-padding-md) var(--van-padding-md);
|
||||
--van-cell-group-title-font-size: var(--van-font-size-md);
|
||||
--van-cell-group-title-line-height: 16px;
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-cell-label-color | _var(--van-text-color-2)_ | - |
|
||||
| --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-text-color-secondary)_ | - |
|
||||
| --van-cell-value-color | _var(--van-text-color-2)_ | - |
|
||||
| --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 | _var(--van-background-light)_ | - |
|
||||
| --van-cell-group-title-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-cell-group-title-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-cell-label-color | _var(--van-text-color-2)_ | - |
|
||||
| --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-text-color-secondary)_ | - |
|
||||
| --van-cell-value-color | _var(--van-text-color-2)_ | - |
|
||||
| --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 | _var(--van-background-light)_ | - |
|
||||
| --van-cell-group-title-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-cell-group-title-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -10,11 +10,11 @@
|
||||
--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-text-color-secondary);
|
||||
--van-cell-label-color: var(--van-text-color-2);
|
||||
--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-text-color-secondary);
|
||||
--van-cell-value-color: var(--van-text-color-2);
|
||||
--van-cell-icon-size: 16px;
|
||||
--van-cell-right-icon-color: var(--van-gray-6);
|
||||
--van-cell-large-vertical-padding: var(--van-padding-sm);
|
||||
|
@ -372,5 +372,5 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-checkbox-label-color | _var(--van-text-color)_ | - |
|
||||
| --van-checkbox-checked-icon-color | _var(--van-primary-color)_ | - |
|
||||
| --van-checkbox-disabled-icon-color | _var(--van-gray-5)_ | - |
|
||||
| --van-checkbox-disabled-label-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-checkbox-disabled-label-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-checkbox-disabled-background | _var(--van-border-color)_ | - |
|
||||
|
@ -382,7 +382,7 @@ checkboxGroupRef.value?.toggleAll();
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| ----------------------------------- | -------------------------- | ---- |
|
||||
| --van-checkbox-size | _20px_ | - |
|
||||
| --van-checkbox-border-color | _var(--van-gray-5)_ | - |
|
||||
| --van-checkbox-duration | _var(--van-duration-fast)_ | - |
|
||||
@ -390,5 +390,5 @@ checkboxGroupRef.value?.toggleAll();
|
||||
| --van-checkbox-label-color | _var(--van-text-color)_ | - |
|
||||
| --van-checkbox-checked-icon-color | _var(--van-primary-color)_ | - |
|
||||
| --van-checkbox-disabled-icon-color | _var(--van-gray-5)_ | - |
|
||||
| --van-checkbox-disabled-label-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-checkbox-disabled-label-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-checkbox-disabled-background | _var(--van-border-color)_ | - |
|
||||
|
@ -6,7 +6,7 @@
|
||||
--van-checkbox-label-color: var(--van-text-color);
|
||||
--van-checkbox-checked-icon-color: var(--van-primary-color);
|
||||
--van-checkbox-disabled-icon-color: var(--van-gray-5);
|
||||
--van-checkbox-disabled-label-color: var(--van-text-color-tertiary);
|
||||
--van-checkbox-disabled-label-color: var(--van-text-color-3);
|
||||
--van-checkbox-disabled-background: var(--van-border-color);
|
||||
}
|
||||
|
||||
|
@ -6,9 +6,9 @@
|
||||
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-text-color-secondary);
|
||||
--van-collapse-item-content-text-color: var(--van-text-color-2);
|
||||
--van-collapse-item-content-background: var(--van-background-light);
|
||||
--van-collapse-item-title-disabled-color: var(--van-text-color-tertiary);
|
||||
--van-collapse-item-title-disabled-color: var(--van-text-color-3);
|
||||
}
|
||||
|
||||
.van-collapse-item {
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-collapse-item-content-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-collapse-item-content-background | _var(--van-background-light)_ | - |
|
||||
| --van-collapse-item-title-disabled-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-collapse-item-title-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-collapse-item-content-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-collapse-item-content-background | _var(--van-background-light)_ | - |
|
||||
| --van-collapse-item-title-disabled-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-collapse-item-title-disabled-color | _var(--van-text-color-3)_ | - |
|
||||
|
@ -156,8 +156,8 @@ 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-color-tertiary: var(--van-gray-5);
|
||||
--van-text-color-2: var(--van-gray-6);
|
||||
--van-text-color-3: var(--van-gray-5);
|
||||
--van-link-color: #576b95;
|
||||
--van-active-color: var(--van-gray-2);
|
||||
--van-active-opacity: 0.6;
|
||||
|
@ -158,8 +158,8 @@ 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-color-tertiary: var(--van-gray-5);
|
||||
--van-text-color-2: var(--van-gray-6);
|
||||
--van-text-color-3: var(--van-gray-5);
|
||||
--van-link-color: #576b95;
|
||||
--van-active-color: var(--van-gray-2);
|
||||
--van-active-opacity: 0.6;
|
||||
|
@ -178,7 +178,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-text-color-secondary)_ | - |
|
||||
| --van-coupon-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
@ -187,7 +187,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-text-color-secondary)_ | - |
|
||||
| --van-coupon-list-empty-tip-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -180,7 +180,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-text-color-secondary)_ | - |
|
||||
| --van-coupon-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
@ -189,7 +189,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-text-color-secondary)_ | - |
|
||||
| --van-coupon-list-empty-tip-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -4,7 +4,7 @@
|
||||
--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-text-color-secondary);
|
||||
--van-coupon-list-empty-tip-color: var(--van-text-color-2);
|
||||
--van-coupon-list-empty-tip-font-size: var(--van-font-size-md);
|
||||
--van-coupon-list-empty-tip-line-height: var(--van-line-height-md);
|
||||
}
|
||||
@ -25,7 +25,7 @@
|
||||
border-radius: 17px;
|
||||
|
||||
&::placeholder {
|
||||
color: var(--van-text-color-tertiary);
|
||||
color: var(--van-text-color-3);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -14,7 +14,7 @@
|
||||
--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-text-color-secondary);
|
||||
--van-coupon-disabled-text-color: var(--van-text-color-2);
|
||||
--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);
|
||||
|
@ -84,9 +84,9 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-divider-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-divider-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-divider-line-height | _24px_ | - |
|
||||
| --van-divider-border-color | _var(--van-border-color)_ | - |
|
||||
|
@ -94,9 +94,9 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-divider-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-divider-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-divider-line-height | _24px_ | - |
|
||||
| --van-divider-border-color | _var(--van-border-color)_ | - |
|
||||
|
@ -1,6 +1,6 @@
|
||||
:root {
|
||||
--van-divider-margin: var(--van-padding-md) 0;
|
||||
--van-divider-text-color: var(--van-text-color-secondary);
|
||||
--van-divider-text-color: var(--van-text-color-2);
|
||||
--van-divider-font-size: var(--van-font-size-md);
|
||||
--van-divider-line-height: 24px;
|
||||
--van-divider-border-color: var(--van-border-color);
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-dropdown-menu-title-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-dropdown-menu-title-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -5,9 +5,7 @@
|
||||
--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-text-color-secondary
|
||||
);
|
||||
--van-dropdown-menu-title-disabled-text-color: var(--van-text-color-2);
|
||||
--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);
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-empty-description-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -106,12 +106,12 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-empty-description-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -3,7 +3,7 @@
|
||||
--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-color: var(--van-text-color-2);
|
||||
--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;
|
||||
|
@ -362,8 +362,8 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-field-label-margin-right | _var(--van-padding-sm)_ | - |
|
||||
| --van-field-input-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-field-input-error-text-color | _var(--van-danger-color)_ | - |
|
||||
| --van-field-input-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-field-placeholder-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-field-input-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-field-placeholder-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-field-icon-size | _16px_ | - |
|
||||
| --van-field-clear-icon-size | _16px_ | - |
|
||||
| --van-field-clear-icon-color | _var(--van-gray-5)_ | - |
|
||||
@ -374,5 +374,5 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-field-word-limit-color | _var(--van-gray-7)_ | - |
|
||||
| --van-field-word-limit-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-field-word-limit-line-height | _16px_ | - |
|
||||
| --van-field-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-field-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-field-required-mark-color | _var(--van-red)_ | - |
|
||||
|
@ -375,14 +375,14 @@ fieldRef.value?.focus();
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| ------------------------------------- | ------------------------- | ---- |
|
||||
| --van-field-label-width | _6.2em_ | - |
|
||||
| --van-field-label-color | _var(--van-gray-7)_ | - |
|
||||
| --van-field-label-margin-right | _var(--van-padding-sm)_ | - |
|
||||
| --van-field-input-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-field-input-error-text-color | _var(--van-danger-color)_ | - |
|
||||
| --van-field-input-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-field-placeholder-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-field-input-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-field-placeholder-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-field-icon-size | _16px_ | - |
|
||||
| --van-field-clear-icon-size | _16px_ | - |
|
||||
| --van-field-clear-icon-color | _var(--van-gray-5)_ | - |
|
||||
@ -393,7 +393,7 @@ fieldRef.value?.focus();
|
||||
| --van-field-word-limit-color | _var(--van-gray-7)_ | - |
|
||||
| --van-field-word-limit-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-field-word-limit-line-height | _16px_ | - |
|
||||
| --van-field-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-field-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-field-required-mark-color | _var(--van-red)_ | - |
|
||||
|
||||
## 常见问题
|
||||
|
@ -4,8 +4,8 @@
|
||||
--van-field-label-margin-right: var(--van-padding-sm);
|
||||
--van-field-input-text-color: var(--van-text-color);
|
||||
--van-field-input-error-text-color: var(--van-danger-color);
|
||||
--van-field-input-disabled-text-color: var(--van-text-color-tertiary);
|
||||
--van-field-placeholder-text-color: var(--van-text-color-tertiary);
|
||||
--van-field-input-disabled-text-color: var(--van-text-color-3);
|
||||
--van-field-placeholder-text-color: var(--van-text-color-3);
|
||||
--van-field-icon-size: 16px;
|
||||
--van-field-clear-icon-size: 16px;
|
||||
--van-field-clear-icon-color: var(--van-gray-5);
|
||||
@ -16,7 +16,7 @@
|
||||
--van-field-word-limit-color: var(--van-gray-7);
|
||||
--van-field-word-limit-font-size: var(--van-font-size-sm);
|
||||
--van-field-word-limit-line-height: 16px;
|
||||
--van-field-disabled-text-color: var(--van-text-color-tertiary);
|
||||
--van-field-disabled-text-color: var(--van-text-color-3);
|
||||
--van-field-required-mark-color: var(--van-red);
|
||||
}
|
||||
|
||||
|
@ -129,8 +129,8 @@ import type { ImageFit, ImageProps } 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-image-placeholder-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| ---------------------------------- | ------------------------- | ----------- |
|
||||
| --van-image-placeholder-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-image-placeholder-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-image-placeholder-background | _var(--van-background)_ | - |
|
||||
| --van-image-loading-icon-size | _32px_ | - |
|
||||
|
@ -157,8 +157,8 @@ import type { ImageFit, ImageProps } from 'vant';
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| --van-image-placeholder-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| ---------------------------------- | ------------------------- | ---- |
|
||||
| --van-image-placeholder-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-image-placeholder-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-image-placeholder-background | _var(--van-background)_ | - |
|
||||
| --van-image-loading-icon-size | _32px_ | - |
|
||||
|
@ -1,5 +1,5 @@
|
||||
:root {
|
||||
--van-image-placeholder-text-color: var(--van-text-color-secondary);
|
||||
--van-image-placeholder-text-color: var(--van-text-color-2);
|
||||
--van-image-placeholder-font-size: var(--van-font-size-md);
|
||||
--van-image-placeholder-background: var(--van-background);
|
||||
--van-image-loading-icon-size: 32px;
|
||||
|
@ -226,8 +226,8 @@ 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-text-color-secondary)_ | - |
|
||||
| ---------------------------- | ------------------------- | ----------- |
|
||||
| --van-list-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-list-text-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-list-text-line-height | _50px_ | - |
|
||||
| --van-list-loading-icon-size | _16px_ | - |
|
||||
|
@ -241,8 +241,8 @@ listRef.value?.check();
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| ---------------------------- | --------------------------------- | ---- |
|
||||
| --van-list-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| ---------------------------- | ------------------------- | ---- |
|
||||
| --van-list-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-list-text-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-list-text-line-height | _50px_ | - |
|
||||
| --van-list-loading-icon-size | _16px_ | - |
|
||||
|
@ -1,5 +1,5 @@
|
||||
:root {
|
||||
--van-list-text-color: var(--van-text-color-secondary);
|
||||
--van-list-text-color: var(--van-text-color-2);
|
||||
--van-list-text-font-size: var(--van-font-size-md);
|
||||
--van-list-text-line-height: 50px;
|
||||
--van-list-loading-icon-size: 16px;
|
||||
|
@ -100,8 +100,8 @@ import type { LoadingType, LoadingProps } 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-loading-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| ------------------------------ | ------------------------- | ----------- |
|
||||
| --van-loading-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-loading-text-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-loading-spinner-color | _var(--van-gray-5)_ | - |
|
||||
| --van-loading-spinner-size | _30px_ | - |
|
||||
|
@ -110,8 +110,8 @@ import type { LoadingType, LoadingProps } from 'vant';
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| ------------------------------ | --------------------------------- | ---- |
|
||||
| --van-loading-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| ------------------------------ | ------------------------- | ---- |
|
||||
| --van-loading-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-loading-text-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-loading-spinner-color | _var(--van-gray-5)_ | - |
|
||||
| --van-loading-spinner-size | _30px_ | - |
|
||||
|
@ -1,5 +1,5 @@
|
||||
:root {
|
||||
--van-loading-text-color: var(--van-text-color-secondary);
|
||||
--van-loading-text-color: var(--van-text-color-2);
|
||||
--van-loading-text-font-size: var(--van-font-size-md);
|
||||
--van-loading-spinner-color: var(--van-gray-5);
|
||||
--van-loading-spinner-size: 30px;
|
||||
|
@ -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-radius | _6px_ | - |
|
||||
| --van-password-input-background | _var(--van-background-light)_ | - |
|
||||
| --van-password-input-info-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-password-input-info-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -165,13 +165,13 @@ export default {
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| ------------------------------------- | ----------------------------- | ---- |
|
||||
| --van-password-input-height | _50px_ | - |
|
||||
| --van-password-input-margin | _0 var(--van-padding-md)_ | - |
|
||||
| --van-password-input-font-size | _20px_ | - |
|
||||
| --van-password-input-radius | _6px_ | - |
|
||||
| --van-password-input-background | _var(--van-background-light)_ | - |
|
||||
| --van-password-input-info-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-password-input-info-color | _var(--van-text-color-2)_ | - |
|
||||
| --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_ | - |
|
||||
|
@ -4,7 +4,7 @@
|
||||
--van-password-input-font-size: 20px;
|
||||
--van-password-input-radius: 6px;
|
||||
--van-password-input-background: var(--van-background-light);
|
||||
--van-password-input-info-color: var(--van-text-color-secondary);
|
||||
--van-password-input-info-color: var(--van-text-color-2);
|
||||
--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;
|
||||
|
@ -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-link-color)_ | - |
|
||||
| --van-picker-cancel-action-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-picker-cancel-action-color | _var(--van-text-color-2)_ | - |
|
||||
| --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-text-color)_ | - |
|
||||
|
@ -439,7 +439,7 @@ pickerRef.value?.confirm();
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| ------------------------------------ | ----------------------------- | ---- |
|
||||
| --van-picker-background | _var(--van-background-light)_ | - |
|
||||
| --van-picker-toolbar-height | _44px_ | - |
|
||||
| --van-picker-title-font-size | _var(--van-font-size-lg)_ | - |
|
||||
@ -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-link-color)_ | - |
|
||||
| --van-picker-cancel-action-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-picker-cancel-action-color | _var(--van-text-color-2)_ | - |
|
||||
| --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-text-color)_ | - |
|
||||
|
@ -6,7 +6,7 @@
|
||||
--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-link-color);
|
||||
--van-picker-cancel-action-color: var(--van-text-color-secondary);
|
||||
--van-picker-cancel-action-color: var(--van-text-color-2);
|
||||
--van-picker-option-font-size: var(--van-font-size-lg);
|
||||
--van-picker-option-padding: 0 var(--van-padding-base);
|
||||
--van-picker-option-text-color: var(--van-text-color);
|
||||
|
@ -286,7 +286,7 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-popover-action-icon-size | _20px_ | - |
|
||||
| --van-popover-light-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-popover-light-background | _var(--van-background-light)_ | - |
|
||||
| --van-popover-light-action-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-popover-light-action-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-popover-dark-text-color | _var(--van-white)_ | - |
|
||||
| --van-popover-dark-background | _#4a4a4a_ | - |
|
||||
| --van-popover-dark-action-disabled-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-popover-dark-action-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
|
@ -298,10 +298,10 @@ import type {
|
||||
| --van-popover-action-icon-size | _20px_ | - |
|
||||
| --van-popover-light-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-popover-light-background | _var(--van-background-light)_ | - |
|
||||
| --van-popover-light-action-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-popover-light-action-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-popover-dark-text-color | _var(--van-white)_ | - |
|
||||
| --van-popover-dark-background | _#4a4a4a_ | - |
|
||||
| --van-popover-dark-action-disabled-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-popover-dark-action-disabled-text-color | _var(--van-text-color-2)_ | - |
|
||||
|
||||
## 常见问题
|
||||
|
||||
|
@ -8,14 +8,10 @@
|
||||
--van-popover-action-icon-size: 20px;
|
||||
--van-popover-light-text-color: var(--van-text-color);
|
||||
--van-popover-light-background: var(--van-background-light);
|
||||
--van-popover-light-action-disabled-text-color: var(
|
||||
--van-text-color-tertiary
|
||||
);
|
||||
--van-popover-light-action-disabled-text-color: var(--van-text-color-3);
|
||||
--van-popover-dark-text-color: var(--van-white);
|
||||
--van-popover-dark-background: #4a4a4a;
|
||||
--van-popover-dark-action-disabled-text-color: var(
|
||||
--van-text-color-secondary
|
||||
);
|
||||
--van-popover-dark-action-disabled-text-color: var(--van-text-color-2);
|
||||
}
|
||||
|
||||
.van-popover {
|
||||
|
@ -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-text-color-secondary)_ | - |
|
||||
| --van-pull-refresh-head-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-pull-refresh-loading-icon-size | _16px_ | - |
|
||||
|
@ -153,10 +153,10 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-pull-refresh-head-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-pull-refresh-loading-icon-size | _16px_ | - |
|
||||
|
||||
## 常见问题
|
||||
|
@ -1,7 +1,7 @@
|
||||
:root {
|
||||
--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-head-text-color: var(--van-text-color-2);
|
||||
--van-pull-refresh-loading-icon-size: 16px;
|
||||
}
|
||||
|
||||
|
@ -220,7 +220,7 @@ import type {
|
||||
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-radio-size | _20px_ | - |
|
||||
| --van-radio-border-color | _var(--van-gray-5)_ | - |
|
||||
| --van-radio-duration | _var(--van-duration-fast)_ | - |
|
||||
@ -228,5 +228,5 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-radio-label-color | _var(--van-text-color)_ | - |
|
||||
| --van-radio-checked-icon-color | _var(--van-primary-color)_ | - |
|
||||
| --van-radio-disabled-icon-color | _var(--van-gray-5)_ | - |
|
||||
| --van-radio-disabled-label-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-radio-disabled-label-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-radio-disabled-background | _var(--van-border-color)_ | - |
|
||||
|
@ -234,7 +234,7 @@ import type {
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| -------------------------------- | -------------------------------- | ---- |
|
||||
| -------------------------------- | -------------------------- | ---- |
|
||||
| --van-radio-size | _20px_ | - |
|
||||
| --van-radio-border-color | _var(--van-gray-5)_ | - |
|
||||
| --van-radio-duration | _var(--van-duration-fast)_ | - |
|
||||
@ -242,5 +242,5 @@ import type {
|
||||
| --van-radio-label-color | _var(--van-text-color)_ | - |
|
||||
| --van-radio-checked-icon-color | _var(--van-primary-color)_ | - |
|
||||
| --van-radio-disabled-icon-color | _var(--van-gray-5)_ | - |
|
||||
| --van-radio-disabled-label-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-radio-disabled-label-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-radio-disabled-background | _var(--van-border-color)_ | - |
|
||||
|
@ -6,7 +6,7 @@
|
||||
--van-radio-label-color: var(--van-text-color);
|
||||
--van-radio-checked-icon-color: var(--van-primary-color);
|
||||
--van-radio-disabled-icon-color: var(--van-gray-5);
|
||||
--van-radio-disabled-label-color: var(--van-text-color-tertiary);
|
||||
--van-radio-disabled-label-color: var(--van-text-color-3);
|
||||
--van-radio-disabled-background: var(--van-border-color);
|
||||
}
|
||||
|
||||
|
@ -239,13 +239,13 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-share-sheet-description-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-share-sheet-description-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-share-sheet-description-line-height | _16px_ | - |
|
||||
| --van-share-sheet-icon-size | _48px_ | - |
|
||||
| --van-share-sheet-option-name-color | _var(--van-gray-7)_ | - |
|
||||
| --van-share-sheet-option-name-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-share-sheet-option-description-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-share-sheet-option-description-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-share-sheet-option-description-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-share-sheet-cancel-button-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-share-sheet-cancel-button-height | _48px_ | - |
|
||||
|
@ -253,13 +253,13 @@ 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-text-color-secondary)_ | - |
|
||||
| --van-share-sheet-description-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-share-sheet-description-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-share-sheet-description-line-height | _16px_ | - |
|
||||
| --van-share-sheet-icon-size | _48px_ | - |
|
||||
| --van-share-sheet-option-name-color | _var(--van-gray-7)_ | - |
|
||||
| --van-share-sheet-option-name-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-share-sheet-option-description-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-share-sheet-option-description-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-share-sheet-option-description-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-share-sheet-cancel-button-font-size | _var(--van-font-size-lg)_ | - |
|
||||
| --van-share-sheet-cancel-button-height | _48px_ | - |
|
||||
|
@ -5,13 +5,13 @@
|
||||
--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-text-color-secondary);
|
||||
--van-share-sheet-description-color: var(--van-text-color-2);
|
||||
--van-share-sheet-description-font-size: var(--van-font-size-sm);
|
||||
--van-share-sheet-description-line-height: 16px;
|
||||
--van-share-sheet-icon-size: 48px;
|
||||
--van-share-sheet-option-name-color: var(--van-gray-7);
|
||||
--van-share-sheet-option-name-font-size: var(--van-font-size-sm);
|
||||
--van-share-sheet-option-description-color: var(--van-text-color-tertiary);
|
||||
--van-share-sheet-option-description-color: var(--van-text-color-3);
|
||||
--van-share-sheet-option-description-font-size: var(--van-font-size-sm);
|
||||
--van-share-sheet-cancel-button-font-size: var(--van-font-size-lg);
|
||||
--van-share-sheet-cancel-button-height: 48px;
|
||||
|
@ -2,7 +2,7 @@
|
||||
--van-sidebar-font-size: var(--van-font-size-md);
|
||||
--van-sidebar-line-height: var(--van-line-height-md);
|
||||
--van-sidebar-text-color: var(--van-text-color);
|
||||
--van-sidebar-disabled-text-color: var(--van-text-color-tertiary);
|
||||
--van-sidebar-disabled-text-color: var(--van-text-color-3);
|
||||
--van-sidebar-padding: 20px var(--van-padding-sm);
|
||||
--van-sidebar-active-color: var(--van-active-color);
|
||||
--van-sidebar-background: var(--van-background);
|
||||
|
@ -144,7 +144,7 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-sidebar-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-sidebar-line-height | _var(--van-line-height-md)_ | - |
|
||||
| --van-sidebar-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-sidebar-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-sidebar-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-sidebar-padding | _20px var(--van-padding-sm)_ | - |
|
||||
| --van-sidebar-active-color | _var(--van-active-color)_ | - |
|
||||
| --van-sidebar-background | _var(--van-background)_ | - |
|
||||
|
@ -147,12 +147,12 @@ import type { SidebarProps, SidebarItemProps } from 'vant';
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| ------------------------------------ | ----------------------------- | ---- |
|
||||
| --van-sidebar-width | _80px_ | - |
|
||||
| --van-sidebar-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-sidebar-line-height | _var(--van-line-height-md)_ | - |
|
||||
| --van-sidebar-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-sidebar-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-sidebar-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-sidebar-padding | _20px var(--van-padding-sm)_ | - |
|
||||
| --van-sidebar-active-color | _var(--van-active-color)_ | - |
|
||||
| --van-sidebar-background | _var(--van-background)_ | - |
|
||||
|
@ -79,7 +79,7 @@ const onChange = (index: number) => Toast(`${t('title')} ${index + 1}`);
|
||||
|
||||
&-title {
|
||||
margin-bottom: 16px;
|
||||
color: var(--van-text-color-secondary);
|
||||
color: var(--van-text-color-2);
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
@ -1,5 +1,5 @@
|
||||
:root {
|
||||
--van-step-text-color: var(--van-text-color-secondary);
|
||||
--van-step-text-color: var(--van-text-color-2);
|
||||
--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);
|
||||
|
@ -183,6 +183,6 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-stepper-input-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-stepper-input-line-height | _normal_ | - |
|
||||
| --van-stepper-input-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-stepper-input-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-stepper-input-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-stepper-input-disabled-background | _var(--van-active-color)_ | - |
|
||||
| --van-stepper-radius | _var(--van-radius-md)_ | - |
|
||||
|
@ -192,7 +192,7 @@ import type { StepperTheme, StepperProps } from 'vant';
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| ---------------------------------------- | ------------------------- | ---- |
|
||||
| --van-stepper-background | _var(--van-active-color)_ | - |
|
||||
| --van-stepper-button-icon-color | _var(--van-text-color)_ | - |
|
||||
| --van-stepper-button-disabled-color | _var(--van-background)_ | - |
|
||||
@ -203,7 +203,7 @@ import type { StepperTheme, StepperProps } from 'vant';
|
||||
| --van-stepper-input-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-stepper-input-line-height | _normal_ | - |
|
||||
| --van-stepper-input-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-stepper-input-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-stepper-input-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-stepper-input-disabled-background | _var(--van-active-color)_ | - |
|
||||
| --van-stepper-radius | _var(--van-radius-md)_ | - |
|
||||
|
||||
|
@ -9,7 +9,7 @@
|
||||
--van-stepper-input-font-size: var(--van-font-size-md);
|
||||
--van-stepper-input-line-height: normal;
|
||||
--van-stepper-input-text-color: var(--van-text-color);
|
||||
--van-stepper-input-disabled-text-color: var(--van-text-color-tertiary);
|
||||
--van-stepper-input-disabled-text-color: var(--van-text-color-3);
|
||||
--van-stepper-input-disabled-background: var(--van-active-color);
|
||||
--van-stepper-radius: var(--van-radius-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-text-color-secondary)_ | - |
|
||||
| --van-step-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -122,8 +122,8 @@ import type { StepsProps, StepsDirection } from 'vant';
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| --- | --- | --- |
|
||||
| --van-step-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| ------------------------------------- | ----------------------------- | ---- |
|
||||
| --van-step-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --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)_ | - |
|
||||
|
@ -27,8 +27,8 @@
|
||||
--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-color-tertiary: var(--van-gray-5);
|
||||
--van-text-color-2: var(--van-gray-6);
|
||||
--van-text-color-3: var(--van-gray-5);
|
||||
--van-link-color: #576b95;
|
||||
--van-active-color: var(--van-gray-2);
|
||||
--van-active-opacity: 0.6;
|
||||
@ -54,11 +54,13 @@
|
||||
--van-line-height-sm: 18px;
|
||||
--van-line-height-md: 20px;
|
||||
--van-line-height-lg: 22px;
|
||||
--van-base-font: -apple-system, blinkmacsystemfont, 'Helvetica Neue',
|
||||
helvetica, segoe ui, arial, roboto, 'PingFang SC', 'miui',
|
||||
/* stylelint-disable */
|
||||
--van-base-font: -apple-system, BlinkMacSystemFont, 'Helvetica Neue',
|
||||
Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', 'miui',
|
||||
'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
|
||||
--van-price-font: avenir-heavy, pingfang sc, helvetica neue, arial,
|
||||
--van-price-font: avenir-heavy, 'PingFang SC', helvetica neue, arial,
|
||||
sans-serif;
|
||||
/* stylelint-enable */
|
||||
|
||||
// Animation
|
||||
--van-duration-base: 0.3s;
|
||||
|
@ -320,10 +320,10 @@ tabsRef.value?.scrollTo(0);
|
||||
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-tab-text-color | _var(--van-gray-7)_ | - |
|
||||
| --van-tab-active-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-tab-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-tab-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-tab-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-tab-line-height | _var(--van-line-height-md)_ | - |
|
||||
| --van-tabs-default-color | _var(--van-danger-color)_ | - |
|
||||
|
@ -335,10 +335,10 @@ tabsRef.value?.scrollTo(0);
|
||||
组件提供了下列 CSS 变量,可用于自定义样式,使用方法请参考 [ConfigProvider 组件](#/zh-CN/config-provider)。
|
||||
|
||||
| 名称 | 默认值 | 描述 |
|
||||
| ----------------------------- | -------------------------------- | ---- |
|
||||
| ----------------------------- | ----------------------------- | ---- |
|
||||
| --van-tab-text-color | _var(--van-gray-7)_ | - |
|
||||
| --van-tab-active-text-color | _var(--van-text-color)_ | - |
|
||||
| --van-tab-disabled-text-color | _var(--van-text-color-tertiary)_ | - |
|
||||
| --van-tab-disabled-text-color | _var(--van-text-color-3)_ | - |
|
||||
| --van-tab-font-size | _var(--van-font-size-md)_ | - |
|
||||
| --van-tab-line-height | _var(--van-line-height-md)_ | - |
|
||||
| --van-tabs-default-color | _var(--van-danger-color)_ | - |
|
||||
|
@ -1,7 +1,7 @@
|
||||
:root {
|
||||
--van-tab-text-color: var(--van-gray-7);
|
||||
--van-tab-active-text-color: var(--van-text-color);
|
||||
--van-tab-disabled-text-color: var(--van-text-color-tertiary);
|
||||
--van-tab-disabled-text-color: var(--van-text-color-3);
|
||||
--van-tab-font-size: var(--van-font-size-md);
|
||||
--van-tab-line-height: var(--van-line-height-md);
|
||||
--van-tabs-default-color: var(--van-danger-color);
|
||||
|
@ -392,7 +392,7 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --van-uploader-size | _80px_ | - |
|
||||
| --van-uploader-icon-size | _24px_ | - |
|
||||
| --van-uploader-icon-color | _var(--van-gray-4)_ | - |
|
||||
| --van-uploader-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-uploader-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-uploader-text-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-uploader-upload-background | _var(--van-gray-1)_ | - |
|
||||
| --van-uploader-upload-active-color | _var(--van-active-color)_ | - |
|
||||
|
@ -417,7 +417,7 @@ uploaderRef.value?.chooseFile();
|
||||
| --van-uploader-size | _80px_ | - |
|
||||
| --van-uploader-icon-size | _24px_ | - |
|
||||
| --van-uploader-icon-color | _var(--van-gray-4)_ | - |
|
||||
| --van-uploader-text-color | _var(--van-text-color-secondary)_ | - |
|
||||
| --van-uploader-text-color | _var(--van-text-color-2)_ | - |
|
||||
| --van-uploader-text-font-size | _var(--van-font-size-sm)_ | - |
|
||||
| --van-uploader-upload-background | _var(--van-gray-1)_ | - |
|
||||
| --van-uploader-upload-active-color | _var(--van-active-color)_ | - |
|
||||
|
@ -2,7 +2,7 @@
|
||||
--van-uploader-size: 80px;
|
||||
--van-uploader-icon-size: 24px;
|
||||
--van-uploader-icon-color: var(--van-gray-4);
|
||||
--van-uploader-text-color: var(--van-text-color-secondary);
|
||||
--van-uploader-text-color: var(--van-text-color-2);
|
||||
--van-uploader-text-font-size: var(--van-font-size-sm);
|
||||
--van-uploader-upload-background: var(--van-gray-1);
|
||||
--van-uploader-upload-active-color: var(--van-active-color);
|
||||
|
Loading…
x
Reference in New Issue
Block a user