blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

style(Steps): update default button border color

Browse Source
This commit is contained in:
chenjiahan 2022-01-24 16:58:56 +08:00
parent 0706d464b6
commit 5a15660c77
8 changed files with 14 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/vant/docs/markdown/changelog-v4.zh-CN.md
View File

@ -16,10 +16,11 @@
- DropdownMenu
- IndexBar
- Sidebar
- Steps
- Tabs
其他：
- Button: 默认圆角大小从 `2px` 调整为 `4px`
- Button: 默认按钮的边框颜色调整为 `--van-gray-6`
- Button: 默认按钮的边框颜色调整为 `--van-gray-4`
- Button: 调整 font-smoothing，默认使用粗体文字

2
packages/vant/src/button/README.md
View File

@ -185,7 +185,7 @@ The component provides the following CSS variables, which can be used to customi
| --van-button-default-font-size | _var(--van-font-size-lg)_ | - |
| --van-button-default-color | _var(--van-text-color)_ | - |
| --van-button-default-background | _var(--van-background-light)_ | - |
| --van-button-default-border-color | _var(--van-gray-6)_ | - |
| --van-button-default-border-color | _var(--van-gray-4)_ | - |
| --van-button-primary-color | _var(--van-white)_ | - |
| --van-button-primary-background | _var(--van-primary-color)_ | - |
| --van-button-primary-border-color | _var(--van-primary-color)_ | - |

2
packages/vant/src/button/README.zh-CN.md
View File

@ -208,7 +208,7 @@ import type {
| --van-button-default-font-size | _var(--van-font-size-lg)_ | - |
| --van-button-default-color | _var(--van-text-color)_ | - |
| --van-button-default-background | _var(--van-background-light)_ | - |
| --van-button-default-border-color | _var(--van-gray-6)_ | - |
| --van-button-default-border-color | _var(--van-gray-4)_ | - |
| --van-button-primary-color | _var(--van-white)_ | - |
| --van-button-primary-background | _var(--van-primary-color)_ | - |
| --van-button-primary-border-color | _var(--van-primary-color)_ | - |

2
packages/vant/src/button/index.less
View File

@ -13,7 +13,7 @@
--van-button-default-font-size: var(--van-font-size-lg);
--van-button-default-color: var(--van-text-color);
--van-button-default-background: var(--van-background-light);
--van-button-default-border-color: var(--van-gray-6);
--van-button-default-border-color: var(--van-gray-4);
--van-button-primary-color: var(--van-white);
--van-button-primary-background: var(--van-primary-color);
--van-button-primary-border-color: var(--van-primary-color);

4
packages/vant/src/step/index.less
View File

@ -1,10 +1,10 @@
:root {
--van-step-text-color: var(--van-text-color-2);
--van-step-active-color: var(--van-success-color);
--van-step-active-color: var(--van-primary-color);
--van-step-process-text-color: var(--van-text-color);
--van-step-font-size: var(--van-font-size-md);
--van-step-line-color: var(--van-border-color);
--van-step-finish-line-color: var(--van-success-color);
--van-step-finish-line-color: var(--van-primary-color);
--van-step-finish-text-color: var(--van-text-color);
--van-step-icon-size: 12px;
--van-step-circle-size: 5px;

6
packages/vant/src/steps/README.md
View File

@ -44,7 +44,7 @@ export default {
### Custom Style
```html
<van-steps :active="active" active-icon="success" active-color="#38f">
<van-steps :active="active" active-icon="success" active-color="#07c160">
<van-step>Step1</van-step>
<van-step>Step2</van-step>
<van-step>Step3</van-step>
@ -118,11 +118,11 @@ 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-2)_ | - |
| --van-step-active-color | _var(--van-success-color)_ | - |
| --van-step-active-color | _var(--van-primary-color)_ | - |
| --van-step-process-text-color | _var(--van-text-color)_ | - |
| --van-step-font-size | _var(--van-font-size-md)_ | - |
| --van-step-line-color | _var(--van-border-color)_ | - |
| --van-step-finish-line-color | _var(--van-success-color)_ | - |
| --van-step-finish-line-color | _var(--van-primary-color)_ | - |
| --van-step-finish-text-color | _var(--van-text-color)_ | - |
| --van-step-icon-size | _12px_ | - |
| --van-step-circle-size | _5px_ | - |

6
packages/vant/src/steps/README.zh-CN.md
View File

@ -48,7 +48,7 @@ export default {
可以通过 `active-icon` 和 `active-color` 属性设置激活状态下的图标和颜色。
```html
<van-steps :active="active" active-icon="success" active-color="#38f">
<van-steps :active="active" active-icon="success" active-color="#07c160">
<van-step>买家下单</van-step>
<van-step>商家接单</van-step>
<van-step>买家提货</van-step>
@ -124,11 +124,11 @@ import type { StepsProps, StepsDirection } from 'vant';
| 名称 | 默认值 | 描述 |
| ------------------------------------- | ----------------------------- | ---- |
| --van-step-text-color | _var(--van-text-color-2)_ | - |
| --van-step-active-color | _var(--van-success-color)_ | - |
| --van-step-active-color | _var(--van-primary-color)_ | - |
| --van-step-process-text-color | _var(--van-text-color)_ | - |
| --van-step-font-size | _var(--van-font-size-md)_ | - |
| --van-step-line-color | _var(--van-border-color)_ | - |
| --van-step-finish-line-color | _var(--van-success-color)_ | - |
| --van-step-finish-line-color | _var(--van-primary-color)_ | - |
| --van-step-finish-text-color | _var(--van-text-color)_ | - |
| --van-step-icon-size | _12px_ | - |
| --van-step-circle-size | _5px_ | - |

12
packages/vant/src/steps/demo/index.vue
View File

@ -58,7 +58,7 @@ const nextStep = () => {
:active="active"
active-icon="success"
inactive-icon="arrow"
active-color="#38f"
active-color="#07c160"
>
<van-step>{{ t('step1') }}</van-step>
<van-step>{{ t('step2') }}</van-step>
@ -87,24 +87,14 @@ const nextStep = () => {
<style lang="less">
.demo-steps {
.steps-success,
.van-icon-location {
color: var(--van-green);
}
.van-button {
margin: var(--van-padding-md) 0 0 var(--van-padding-md);
}
p,
h3 {
margin: 0;
font-weight: normal;
font-size: inherit;
}
.van-steps__message + p {
margin-bottom: 10px;
}
}
</style>