blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-06 03:58:05 +08:00
Code Issues Projects Releases Wiki Activity

[new feature] Button: add info type (#1340)

Browse Source
This commit is contained in:
neverland 2019-02-24 16:50:34 +08:00 committed by GitHub
parent ca636d329b
commit 082fcbb0db
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
example/pages/button/index.wxml
View File

@ -1,10 +1,11 @@
<demo-section>
<demo-block title="按钮类型" padding>
<view class="row">
<van-button class="demo-margin-right">默认按钮</van-button>
<van-button type="primary" class="demo-margin-right">主要按钮</van-button>
<van-button type="danger">危险按钮</van-button>
<van-button type="info" class="demo-margin-right">信息按钮</van-button>
</view>
<van-button class="demo-margin-right">默认按钮</van-button>
<van-button type="danger" class="demo-margin-right">危险按钮</van-button>
<van-button type="warning">警告按钮</van-button>
</demo-block>

6
packages/button/README.md
View File

@ -11,11 +11,13 @@
### 代码演示
#### 按钮类型
支持`default`、`primary`、`warning`、`danger`四种类型，默认为`default`
支持`default`、`primary`、`info`、`warning`、`danger`五种类型，默认为`default`
```html
<van-button type="default">默认按钮</van-button>
<van-button type="primary">主要按钮</van-button>
<van-button type="info">信息按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>
```
@ -65,7 +67,7 @@
| 参数 | 说明 | 类型 | 默认值 |
|-----------|-----------|-----------|-------------|
| id | 标识符 | `String` | - |
| type | 按钮类型，可选值为 `primary` `warning` `danger` | `String` | `default` |
| type | 按钮类型，可选值为 `primary` `info` `warning` `danger` | `String` | `default` |
| size | 按钮尺寸，可选值为 `normal` `large` `small` `mini` | `String` | `normal` |
| plain | 是否为朴素按钮 | `Boolean` | `false` |
| block | 是否为块级元素 | `Boolean` | `false` |

10
packages/button/index.less
View File

@ -49,6 +49,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;
@ -68,6 +74,10 @@
color: @button-primary-background-color;
}
&.van-button--info {
color: @button-info-background-color;
}
&.van-button--danger {
color: @button-danger-background-color;
}

3
packages/common/style/var.less
View File

@ -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;