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(Button): add some less vars (#8281)

Browse Source
This commit is contained in:
neverland 2021-03-04 20:57:38 +08:00 committed by GitHub
parent 6d8ed45608
commit 391ccd4240
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/button/README.md
View File

@ -149,10 +149,13 @@ How to use: [Custom Theme](#/en-US/theme).
| Name | Default Value | Description | | Name | Default Value | Description |
| -------------------------------- | -------------------- | ----------- | | -------------------------------- | -------------------- | ----------- |
| @button-mini-height | `24px` | - | | @button-mini-height | `24px` | - |
| @button-mini-padding | `0 @padding-base` | - |
| @button-mini-font-size | `@font-size-xs` | - | | @button-mini-font-size | `@font-size-xs` | - |
| @button-small-height | `32px` | - | | @button-small-height | `32px` | - |
| @button-small-padding | `0 @padding-xs` | - |
| @button-small-font-size | `@font-size-sm` | - | | @button-small-font-size | `@font-size-sm` | - |
| @button-normal-font-size | `@font-size-md` | - | | @button-normal-font-size | `@font-size-md` | - |
| @button-normal-padding | `0 15px` | - |
| @button-large-height | `50px` | - | | @button-large-height | `50px` | - |
| @button-default-height | `44px` | - | | @button-default-height | `44px` | - |
| @button-default-line-height | `1.2` | - | | @button-default-line-height | `1.2` | - |
@ -177,3 +180,4 @@ How to use: [Custom Theme](#/en-US/theme).
| @button-round-border-radius | `@border-radius-max` | - | | @button-round-border-radius | `@border-radius-max` | - |
| @button-plain-background-color | `@white` | - | | @button-plain-background-color | `@white` | - |
| @button-disabled-opacity | `@disabled-opacity` | - | | @button-disabled-opacity | `@disabled-opacity` | - |
| @button-icon-size | `1.2em` | - |

4
src/button/README.zh-CN.md
View File

@ -176,10 +176,13 @@ app.use(Button);
| 名称 | 默认值 | 描述 | | 名称 | 默认值 | 描述 |
| -------------------------------- | -------------------- | ---- | | -------------------------------- | -------------------- | ---- |
| @button-mini-height | `24px` | - | | @button-mini-height | `24px` | - |
| @button-mini-padding | `0 @padding-base` | - |
| @button-mini-font-size | `@font-size-xs` | - | | @button-mini-font-size | `@font-size-xs` | - |
| @button-small-height | `32px` | - | | @button-small-height | `32px` | - |
| @button-small-padding | `0 @padding-xs` | - |
| @button-small-font-size | `@font-size-sm` | - | | @button-small-font-size | `@font-size-sm` | - |
| @button-normal-font-size | `@font-size-md` | - | | @button-normal-font-size | `@font-size-md` | - |
| @button-normal-padding | `0 15px` | - |
| @button-large-height | `50px` | - | | @button-large-height | `50px` | - |
| @button-default-height | `44px` | - | | @button-default-height | `44px` | - |
| @button-default-line-height | `1.2` | - | | @button-default-line-height | `1.2` | - |
@ -204,3 +207,4 @@ app.use(Button);
| @button-round-border-radius | `@border-radius-max` | - | | @button-round-border-radius | `@border-radius-max` | - |
| @button-plain-background-color | `@white` | - | | @button-plain-background-color | `@white` | - |
| @button-disabled-opacity | `@disabled-opacity` | - | | @button-disabled-opacity | `@disabled-opacity` | - |
| @button-icon-size | `1.2em` | - |

8
src/button/index.less
View File

@ -97,13 +97,13 @@
} }
&--normal { &--normal {
padding: 0 15px; padding: @button-normal-padding;
font-size: @button-normal-font-size; font-size: @button-normal-font-size;
} }
&--small { &--small {
height: @button-small-height; height: @button-small-height;
padding: 0 @padding-xs; padding: @button-small-padding;
font-size: @button-small-font-size; font-size: @button-small-font-size;
} }
@ -114,7 +114,7 @@
&--mini { &--mini {
height: @button-mini-height; height: @button-mini-height;
padding: 0 @padding-base; padding: @button-mini-padding;
font-size: @button-mini-font-size; font-size: @button-mini-font-size;
& + .van-button--mini { & + .van-button--mini {
@ -160,7 +160,7 @@
} }
&__icon { &__icon {
font-size: 1.2em; font-size: @button-icon-size;
line-height: inherit; line-height: inherit;
} }

4
src/style/var.less
View File

@ -127,9 +127,12 @@
// Button // Button
@button-mini-height: 24px; @button-mini-height: 24px;
@button-mini-padding: 0 @padding-base;
@button-mini-font-size: @font-size-xs; @button-mini-font-size: @font-size-xs;
@button-small-height: 32px; @button-small-height: 32px;
@button-small-padding: 0 @padding-xs;
@button-small-font-size: @font-size-sm; @button-small-font-size: @font-size-sm;
@button-normal-padding: 0 15px;
@button-normal-font-size: @font-size-md; @button-normal-font-size: @font-size-md;
@button-large-height: 50px; @button-large-height: 50px;
@button-default-height: 44px; @button-default-height: 44px;
@ -155,6 +158,7 @@
@button-round-border-radius: @border-radius-max; @button-round-border-radius: @border-radius-max;
@button-plain-background-color: @white; @button-plain-background-color: @white;
@button-disabled-opacity: @disabled-opacity; @button-disabled-opacity: @disabled-opacity;
@button-icon-size: 1.2em;
// Calendar // Calendar
@calendar-background-color: @white; @calendar-background-color: @white;