ant-design/style/components/button.less
2015-10-28 10:35:48 +08:00

86 lines
1.6 KiB
Plaintext

@import "../mixins/index";
@btn-prefix-cls: ~"@{css-prefix}btn";
// Button styles
// -----------------------------
.@{btn-prefix-cls} {
.btn;
.btn-default;
&-primary {
.btn-primary;
.@{btn-prefix-cls}-group &:not(:first-child):not(:last-child) {
border-right-color: @btn-group-border;
border-left-color: @btn-group-border;
}
.@{btn-prefix-cls}-group &:first-child {
&:not(:last-child) {
border-right-color: @btn-group-border;
}
}
.@{btn-prefix-cls}-group &:last-child:not(:first-child) {
border-left-color: @btn-group-border;
}
.@{btn-prefix-cls}-group & + .@{btn-prefix-cls} {
border-left-color: @btn-group-border;
}
}
&-ghost {
.btn-ghost;
}
&-circle, &-circle-outline {
.btn-circle(@btn-prefix-cls);
}
&-circle-outline {
.btn-circle-outline;
}
&:after {
font-family: anticon;
content: "\e610";
position: absolute;
opacity: 0;
visibility: hidden;
transition: opacity 0.5s ease;
}
&-loading {
padding-right: 31px;
pointer-events: none;
opacity: 0.75;
&:after {
.animation(loadingCircle 1s infinite linear);
height: 12px;
line-height: 12px;
right: 12px;
top: 50%;
margin-top: -6px;
opacity: 1;
visibility: visible;
}
}
&-sm&-loading {
padding-right: 24px;
&:after {
right: 8px;
}
}
&-group {
.btn-group(@btn-prefix-cls);
}
// To ensure that a space will be placed between character and `Icon`.
> .@{iconfont-css-prefix} + span, > span + .@{iconfont-css-prefix} {
margin-left: 0.5em;
}
}