tweak button design

This commit is contained in:
afc163 2018-09-08 13:44:21 +08:00
parent 02af08951a
commit 318737584a
2 changed files with 7 additions and 4 deletions

View File

@ -9,14 +9,10 @@ title:
按钮有四种类型:主按钮、次按钮、虚线按钮、危险按钮。主按钮在同一个操作区域最多出现一次。
> `danger``antd@2.7` 后支持。
## en-US
There are `primary` button, `default` button, `dashed` button and `danger` button in antd.
> `danger` is supported after `antd@2.7`.
````jsx
import { Button } from 'antd';

View File

@ -16,12 +16,17 @@
&:active,
&.active {
.button-color(@btn-disable-color; @btn-disable-bg; @btn-disable-border);
text-shadow: none;
box-shadow: none;
}
}
}
.button-variant-primary(@color; @background) {
.button-color(@color; @background; @background);
text-shadow: 0 -1px 0 rgba(0, 0, 0, .12);
box-shadow: 0 2px 0 rgba(0, 0, 0, .035);
&:hover,
&:focus {
.button-color(@color; ~`colorPalette("@{background}", 5)`; ~`colorPalette("@{background}", 5)`);
@ -158,6 +163,7 @@
user-select: none;
transition: all .3s @ease-in-out;
position: relative;
box-shadow: 0 2px 0 rgba(0, 0, 0, .015);
> .@{iconfont-css-prefix} {
line-height: 1;
@ -176,6 +182,7 @@
&:not([disabled]):active {
outline: 0;
transition: none;
box-shadow: none;
}
&.disabled,