diff --git a/packages/button/demo/index.vue b/packages/button/demo/index.vue index 83a0dfe58..afb6c9b2c 100644 --- a/packages/button/demo/index.vue +++ b/packages/button/demo/index.vue @@ -2,10 +2,11 @@
+ {{ $t('default') }} {{ $t('primary') }} - {{ $t('danger') }} + {{ $t('info') }}
- {{ $t('default') }} + {{ $t('danger') }} {{ $t('warning') }}
@@ -79,6 +80,7 @@ export default { shape: '按钮形状', default: '默认按钮', primary: '主要按钮', + info: '信息按钮', danger: '危险按钮', warning: '警告按钮', large: '大号按钮', @@ -97,6 +99,7 @@ export default { shape: 'Shape', default: 'Default', primary: 'Primary', + info: 'Info', danger: 'Danger', warning: 'Warning', large: 'Large', diff --git a/packages/button/en-US.md b/packages/button/en-US.md index 9d5d1a2fd..c821924e7 100644 --- a/packages/button/en-US.md +++ b/packages/button/en-US.md @@ -12,9 +12,10 @@ Vue.use(Button); #### Type ```html -Primary -Danger Default +Primary +Info +Danger Warning ``` @@ -59,7 +60,7 @@ Vue.use(Button); | Attribute | Description | Type | Default | |------|------|------|------| -| type | Can be set to `primary` `warning` `danger` | `String` | `default` | +| type | Can be set to `primary` `info` `warning` `danger` | `String` | `default` | | size | Can be set to `large` `small` `mini` | `String` | `normal` | | text | Text | `String` | - | | tag | Tag | `String` | `button` | diff --git a/packages/button/index.less b/packages/button/index.less index c15dcf717..02bb5c2af 100644 --- a/packages/button/index.less +++ b/packages/button/index.less @@ -51,6 +51,12 @@ border: 1px solid @button-primary-border-color; } + &--info { + color: @button-info-color; + background-color: @button-info-background-color; + border: 1px solid @button-info-border-color; + } + &--danger { color: @button-danger-color; background-color: @button-danger-background-color; @@ -70,6 +76,10 @@ color: @button-primary-background-color; } + &.van-button--info { + color: @button-info-background-color; + } + &.van-button--danger { color: @button-danger-background-color; } diff --git a/packages/button/test/__snapshots__/demo.spec.js.snap b/packages/button/test/__snapshots__/demo.spec.js.snap index f295fd198..ff5d9b8d7 100644 --- a/packages/button/test/__snapshots__/demo.spec.js.snap +++ b/packages/button/test/__snapshots__/demo.spec.js.snap @@ -3,7 +3,7 @@ exports[`renders demo correctly 1`] = `
-
+
diff --git a/packages/button/zh-CN.md b/packages/button/zh-CN.md index 3a20d5868..40f4bde47 100644 --- a/packages/button/zh-CN.md +++ b/packages/button/zh-CN.md @@ -11,11 +11,12 @@ Vue.use(Button); #### 按钮类型 -支持`default`、`primary`、`warning`、`danger`四种类型,默认为`default` +支持`default`、`primary`、`info`、`warning`、`danger`五种类型,默认为`default` ```html 默认按钮 主要按钮 +信息按钮 警告按钮 危险按钮 ``` @@ -65,7 +66,7 @@ Vue.use(Button); | 参数 | 说明 | 类型 | 默认值 | 版本 | |------|------|------|------|------| -| type | 类型,可选值为 `primary` `warning` `danger` | `String` | `default` | - | +| type | 类型,可选值为 `primary` `info` `warning` `danger` | `String` | `default` | 1.6.6 | | size | 尺寸,可选值为 `large` `small` `mini` | `String` | `normal` | - | | text | 文字 | `String` | - | - | | tag | HTML 标签 | `String` | `button` | - | diff --git a/packages/style/var.less b/packages/style/var.less index 01e3a5e9d..4d45f5797 100644 --- a/packages/style/var.less +++ b/packages/style/var.less @@ -26,6 +26,9 @@ @button-primary-color: @white; @button-primary-background-color: @green; @button-primary-border-color: @green; +@button-info-color: @white; +@button-info-background-color: @blue; +@button-info-border-color: @blue; @button-danger-color: @white; @button-danger-background-color: @red; @button-danger-border-color: @red;