1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-13 17:14:04 +02:00

really fix those outline buttons

This commit is contained in:
Mark Otto
2015-08-09 23:45:36 -07:00
parent eaeee93fa3
commit 743717fbce
11 changed files with 465 additions and 19 deletions

View File

@@ -83,9 +83,23 @@ fieldset[disabled] a.btn {
}
// Remove all backgrounds
.btn-outline {
background-color: $body-bg;
background-image: transparent;
.btn-primary-outline {
@include button-outline-variant($btn-primary-bg);
}
.btn-secondary-outline {
@include button-outline-variant($btn-secondary-border);
}
.btn-info-outline {
@include button-outline-variant($btn-info-bg);
}
.btn-success-outline {
@include button-outline-variant($btn-success-bg);
}
.btn-warning-outline {
@include button-outline-variant($btn-warning-bg);
}
.btn-danger-outline {
@include button-outline-variant($btn-danger-bg);
}

View File

@@ -54,6 +54,40 @@
}
}
@mixin button-outline-variant($color) {
color: $color;
background-image: none;
background-color: $body-bg;
border-color: $color;
&:focus,
&.focus,
&:active,
&.active,
.open > &.dropdown-toggle {
color: #fff;
background-color: $color;
border-color: $color;
}
@include hover {
color: #fff;
background-color: $color;
border-color: $color;
}
&.disabled,
&:disabled,
fieldset[disabled] & {
&:focus,
&.focus {
border-color: lighten($color, 20%);
}
@include hover {
border-color: lighten($color, 20%);
}
}
}
// Button sizes
@mixin button-size($padding-vertical, $padding-horizontal, $font-size, $line-height, $border-radius) {
padding: $padding-vertical $padding-horizontal;