diff --git a/src/button/README.md b/src/button/README.md index 4bae618d0..90c77f9c1 100644 --- a/src/button/README.md +++ b/src/button/README.md @@ -149,10 +149,13 @@ How to use: [Custom Theme](#/en-US/theme). | Name | Default Value | Description | | -------------------------------- | -------------------- | ----------- | | @button-mini-height | `24px` | - | +| @button-mini-padding | `0 @padding-base` | - | | @button-mini-font-size | `@font-size-xs` | - | | @button-small-height | `32px` | - | +| @button-small-padding | `0 @padding-xs` | - | | @button-small-font-size | `@font-size-sm` | - | | @button-normal-font-size | `@font-size-md` | - | +| @button-normal-padding | `0 15px` | - | | @button-large-height | `50px` | - | | @button-default-height | `44px` | - | | @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-plain-background-color | `@white` | - | | @button-disabled-opacity | `@disabled-opacity` | - | +| @button-icon-size | `1.2em` | - | diff --git a/src/button/README.zh-CN.md b/src/button/README.zh-CN.md index 287974058..57028098b 100644 --- a/src/button/README.zh-CN.md +++ b/src/button/README.zh-CN.md @@ -176,10 +176,13 @@ app.use(Button); | 名称 | 默认值 | 描述 | | -------------------------------- | -------------------- | ---- | | @button-mini-height | `24px` | - | +| @button-mini-padding | `0 @padding-base` | - | | @button-mini-font-size | `@font-size-xs` | - | | @button-small-height | `32px` | - | +| @button-small-padding | `0 @padding-xs` | - | | @button-small-font-size | `@font-size-sm` | - | | @button-normal-font-size | `@font-size-md` | - | +| @button-normal-padding | `0 15px` | - | | @button-large-height | `50px` | - | | @button-default-height | `44px` | - | | @button-default-line-height | `1.2` | - | @@ -204,3 +207,4 @@ app.use(Button); | @button-round-border-radius | `@border-radius-max` | - | | @button-plain-background-color | `@white` | - | | @button-disabled-opacity | `@disabled-opacity` | - | +| @button-icon-size | `1.2em` | - | diff --git a/src/button/index.less b/src/button/index.less index 41a4c657d..4f0eb6ecf 100644 --- a/src/button/index.less +++ b/src/button/index.less @@ -97,13 +97,13 @@ } &--normal { - padding: 0 15px; + padding: @button-normal-padding; font-size: @button-normal-font-size; } &--small { height: @button-small-height; - padding: 0 @padding-xs; + padding: @button-small-padding; font-size: @button-small-font-size; } @@ -114,7 +114,7 @@ &--mini { height: @button-mini-height; - padding: 0 @padding-base; + padding: @button-mini-padding; font-size: @button-mini-font-size; & + .van-button--mini { @@ -160,7 +160,7 @@ } &__icon { - font-size: 1.2em; + font-size: @button-icon-size; line-height: inherit; } diff --git a/src/style/var.less b/src/style/var.less index 95b598653..5f0e3364f 100644 --- a/src/style/var.less +++ b/src/style/var.less @@ -127,9 +127,12 @@ // Button @button-mini-height: 24px; +@button-mini-padding: 0 @padding-base; @button-mini-font-size: @font-size-xs; @button-small-height: 32px; +@button-small-padding: 0 @padding-xs; @button-small-font-size: @font-size-sm; +@button-normal-padding: 0 15px; @button-normal-font-size: @font-size-md; @button-large-height: 50px; @button-default-height: 44px; @@ -155,6 +158,7 @@ @button-round-border-radius: @border-radius-max; @button-plain-background-color: @white; @button-disabled-opacity: @disabled-opacity; +@button-icon-size: 1.2em; // Calendar @calendar-background-color: @white;