style: decentralized less var (#8369)

* style: decentralized less var

* chore: remove emtpy var file
This commit is contained in:
neverland
2021-03-17 16:14:18 +08:00
committed by GitHub
parent 3b645362d8
commit b3146b9108
157 changed files with 997 additions and 1002 deletions
+15 -15
View File
@@ -190,23 +190,23 @@ export default {
### TabbarItem Slots
| Name | Description | SlotProps |
| ---- | ----------- | -------------------------- |
| icon | Custom icon | _active: boolean_ |
| Name | Description | SlotProps |
| ---- | ----------- | ----------------- |
| icon | Custom icon | _active: boolean_ |
### Less Variables
How to use: [Custom Theme](#/en-US/theme).
| Name | Default Value | Description |
| --- | --- | --- |
| @tabbar-height | `50px` | - |
| @tabbar-z-index | `1` | - |
| @tabbar-background-color | `@white` | - |
| @tabbar-item-font-size | `@font-size-sm` | - |
| @tabbar-item-text-color | `@gray-7` | - |
| @tabbar-item-active-color | `@blue` | - |
| @tabbar-item-active-background-color | `@tabbar-background-color` | - |
| @tabbar-item-line-height | `1` | - |
| @tabbar-item-icon-size | `22px` | - |
| @tabbar-item-margin-bottom | `4px` | - |
| Name | Default Value | Description |
| ------------------------------------ | --------------- | ----------- |
| @tabbar-height | `50px` | - |
| @tabbar-z-index | `1` | - |
| @tabbar-background-color | `@white` | - |
| @tabbar-item-font-size | `@font-size-sm` | - |
| @tabbar-item-text-color | `@gray-7` | - |
| @tabbar-item-active-color | `@blue` | - |
| @tabbar-item-active-background-color | `@white` | - |
| @tabbar-item-line-height | `1` | - |
| @tabbar-item-icon-size | `22px` | - |
| @tabbar-item-margin-bottom | `4px` | - |
+16 -16
View File
@@ -187,8 +187,8 @@ export default {
### Tabbar Events
| 事件名 | 说明 | 回调参数 |
| ------ | -------------- | ---------------------------------- |
| 事件名 | 说明 | 回调参数 |
| ------ | -------------- | -------------------------- |
| change | 切换标签时触发 | _active: number \| string_ |
### TabbarItem Props
@@ -206,23 +206,23 @@ export default {
### TabbarItem Slots
| 名称 | 说明 | 参数 |
| ---- | ---------- | ---------------------- |
| 名称 | 说明 | 参数 |
| ---- | ---------- | ----------------- |
| icon | 自定义图标 | _active: boolean_ |
### 样式变量
组件提供了下列 Less 变量,可用于自定义样式,使用方法请参考[主题定制](#/zh-CN/theme)。
| 名称 | 默认值 | 描述 |
| ------------------------------------ | -------------------------- | ---- |
| @tabbar-height | `50px` | - |
| @tabbar-z-index | `1` | - |
| @tabbar-background-color | `@white` | - |
| @tabbar-item-font-size | `@font-size-sm` | - |
| @tabbar-item-text-color | `@gray-7` | - |
| @tabbar-item-active-color | `@blue` | - |
| @tabbar-item-active-background-color | `@tabbar-background-color` | - |
| @tabbar-item-line-height | `1` | - |
| @tabbar-item-icon-size | `22px` | - |
| @tabbar-item-margin-bottom | `4px` | - |
| 名称 | 默认值 | 描述 |
| ------------------------------------ | --------------- | ---- |
| @tabbar-height | `50px` | - |
| @tabbar-z-index | `1` | - |
| @tabbar-background-color | `@white` | - |
| @tabbar-item-font-size | `@font-size-sm` | - |
| @tabbar-item-text-color | `@gray-7` | - |
| @tabbar-item-active-color | `@blue` | - |
| @tabbar-item-active-background-color | `@white` | - |
| @tabbar-item-line-height | `1` | - |
| @tabbar-item-icon-size | `22px` | - |
| @tabbar-item-margin-bottom | `4px` | - |
+1 -1
View File
@@ -1,4 +1,4 @@
@import '../style/var.less';
@import './var.less';
@import '../style/mixins/safe-area.less';
.van-tabbar {
+5
View File
@@ -0,0 +1,5 @@
@import '../style/var.less';
@tabbar-height: 50px;
@tabbar-z-index: 1;
@tabbar-background-color: @white;