mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
style(Tabs): using primary color by default
This commit is contained in:
parent
41b1cd7185
commit
3b10d66bb9
@ -8,4 +8,16 @@
|
||||
|
||||
**Style**
|
||||
|
||||
以下组件的默认色值调整为 `--van-primary-color`:
|
||||
|
||||
- Calendar
|
||||
- Cascader
|
||||
- Dialog
|
||||
- DropdownMenu
|
||||
- IndexBar
|
||||
- Sidebar
|
||||
- Tabs
|
||||
|
||||
其他:
|
||||
|
||||
- Button: 默认圆角大小从 `2px` 调整为 `4px`
|
||||
|
@ -5,7 +5,7 @@ import VanGridItem from '../../grid-item';
|
||||
import { ref } from 'vue';
|
||||
import { useTranslate } from '../../../docs/site/use-translate';
|
||||
import { Toast } from '../../toast';
|
||||
import type { CountDownInstance } from '../CountDown';
|
||||
import type { CountDownInstance } from '..';
|
||||
|
||||
const t = useTranslate({
|
||||
'zh-CN': {
|
||||
@ -100,7 +100,7 @@ const onFinish = () => Toast(t('finished'));
|
||||
.colon {
|
||||
display: inline-block;
|
||||
margin: 0 4px;
|
||||
color: var(--van-red);
|
||||
color: var(--van-primary-color);
|
||||
}
|
||||
|
||||
.block {
|
||||
@ -109,7 +109,7 @@ const onFinish = () => Toast(t('finished'));
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
background-color: var(--van-red);
|
||||
background-color: var(--van-primary-color);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
|
@ -239,7 +239,7 @@ export default {
|
||||
| --- | --- | --- | --- |
|
||||
| v-model:active | Index of active tab | _number \| string_ | `0` |
|
||||
| type | Can be set to `line` `card` | _string_ | `line` |
|
||||
| color | Tab color | _string_ | `#ee0a24` |
|
||||
| color | Tab color | _string_ | `#1989fa` |
|
||||
| background | Background color | _string_ | `white` |
|
||||
| duration | Toggle tab's animation time | _number \| string_ | `0.3` |
|
||||
| line-width | Width of tab line | _number \| string_ | `40px` |
|
||||
@ -339,10 +339,10 @@ The component provides the following CSS variables, which can be used to customi
|
||||
| --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)_ | - |
|
||||
| --van-tabs-default-color | _var(--van-primary-color)_ | - |
|
||||
| --van-tabs-line-height | _44px_ | - |
|
||||
| --van-tabs-card-height | _30px_ | - |
|
||||
| --van-tabs-nav-background | _var(--van-background-light)_ | - |
|
||||
| --van-tabs-bottom-bar-width | _40px_ | - |
|
||||
| --van-tabs-bottom-bar-height | _3px_ | - |
|
||||
| --van-tabs-bottom-bar-color | _var(--van-danger-color)_ | - |
|
||||
| --van-tabs-bottom-bar-color | _var(--van-primary-color)_ | - |
|
||||
|
@ -252,7 +252,7 @@ export default {
|
||||
| --- | --- | --- | --- |
|
||||
| v-model:active | 绑定当前选中标签的标识符 | _number \| string_ | `0` |
|
||||
| type | 样式风格类型,可选值为 `card` | _string_ | `line` |
|
||||
| color | 标签主题色 | _string_ | `#ee0a24` |
|
||||
| color | 标签主题色 | _string_ | `#1989fa` |
|
||||
| background | 标签栏背景色 | _string_ | `white` |
|
||||
| duration | 动画时间,单位秒,设置为 0 可以禁用动画 | _number \| string_ | `0.3` |
|
||||
| line-width | 底部条宽度,默认单位 `px` | _number \| string_ | `40px` |
|
||||
@ -354,13 +354,13 @@ tabsRef.value?.scrollTo(0);
|
||||
| --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)_ | - |
|
||||
| --van-tabs-default-color | _var(--van-primary-color)_ | - |
|
||||
| --van-tabs-line-height | _44px_ | - |
|
||||
| --van-tabs-card-height | _30px_ | - |
|
||||
| --van-tabs-nav-background | _var(--van-background-light)_ | - |
|
||||
| --van-tabs-bottom-bar-width | _40px_ | - |
|
||||
| --van-tabs-bottom-bar-height | _3px_ | - |
|
||||
| --van-tabs-bottom-bar-color | _var(--van-danger-color)_ | - |
|
||||
| --van-tabs-bottom-bar-color | _var(--van-primary-color)_ | - |
|
||||
|
||||
## 常见问题
|
||||
|
||||
|
@ -4,13 +4,13 @@
|
||||
--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);
|
||||
--van-tabs-default-color: var(--van-primary-color);
|
||||
--van-tabs-line-height: 44px;
|
||||
--van-tabs-card-height: 30px;
|
||||
--van-tabs-nav-background: var(--van-background-light);
|
||||
--van-tabs-bottom-bar-width: 40px;
|
||||
--van-tabs-bottom-bar-height: 3px;
|
||||
--van-tabs-bottom-bar-color: var(--van-danger-color);
|
||||
--van-tabs-bottom-bar-color: var(--van-primary-color);
|
||||
}
|
||||
|
||||
.van-tab {
|
||||
|
Loading…
x
Reference in New Issue
Block a user