rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-06 04:08:22 +01:00
Code Issues Actions Packages Releases Activity

Button code cleanup (#22951)

Browse Source 
* use a mixin there
* revamp .btn-link to match default and outline variants
* remove unnecessary properties
This commit is contained in:
Mark Otto 2017-08-13 14:55:28 -07:00 committed by GitHub
parent bb0cab9f10
commit cd22eb1da0
3 changed files with 37 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
scss/_button-group.scss
View File

@ -10,7 +10,6 @@
> .btn { > .btn {
position: relative; position: relative;
flex: 0 1 auto; flex: 0 1 auto;
margin-bottom: 0;
// Bring the hover, focused, and "active" buttons to the front to overlay // Bring the hover, focused, and "active" buttons to the front to overlay
// the borders properly // the borders properly
@ -66,15 +65,18 @@
.btn-group > .btn-group { .btn-group > .btn-group {
float: left; float: left;
} }
.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
border-radius: 0; border-radius: 0;
} }
.btn-group > .btn-group:first-child:not(:last-child) { .btn-group > .btn-group:first-child:not(:last-child) {
> .btn:last-child, > .btn:last-child,
> .dropdown-toggle { > .dropdown-toggle {
@include border-right-radius(0); @include border-right-radius(0);
} }
} }
.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child { .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
@include border-left-radius(0); @include border-left-radius(0);
} }
@ -129,7 +131,6 @@
// //
.btn-group-vertical { .btn-group-vertical {
display: inline-flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
justify-content: center; justify-content: center;
@ -146,30 +147,35 @@
margin-top: -$input-btn-border-width; margin-top: -$input-btn-border-width;
margin-left: 0; margin-left: 0;
} }
}
.btn-group-vertical > .btn { > .btn {
&:not(:first-child):not(:last-child) { &:not(:first-child):not(:last-child) {
border-radius: 0; border-radius: 0;
}
} }
&:first-child:not(:last-child) { &:first-child:not(:last-child) {
@include border-bottom-radius(0); @include border-bottom-radius(0);
} }
&:last-child:not(:first-child) { &:last-child:not(:first-child) {
@include border-top-radius(0); @include border-top-radius(0);
} }
}
.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { > .btn-group:not(:first-child):not(:last-child) > .btn {
border-radius: 0; border-radius: 0;
} }
.btn-group-vertical > .btn-group:first-child:not(:last-child) {
> .btn:last-child, > .btn-group:first-child:not(:last-child) {
> .dropdown-toggle { > .btn:last-child,
@include border-bottom-radius(0); > .dropdown-toggle {
@include border-bottom-radius(0);
}
}
> .btn-group:last-child:not(:first-child) > .btn:first-child {
@include border-top-radius(0);
} }
}
.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
@include border-top-radius(0);
} }

34
scss/_buttons.scss
View File

@ -71,36 +71,28 @@ fieldset[disabled] a.btn {
.btn-link { .btn-link {
font-weight: $font-weight-normal; font-weight: $font-weight-normal;
color: $link-color; color: $link-color;
background-color: transparent;
border-radius: 0; border-radius: 0;
&,
&:active,
&.active,
&:disabled {
background-color: transparent;
@include box-shadow(none);
}
&,
&:focus,
&:active {
border-color: transparent;
box-shadow: none;
}
@include hover { @include hover {
border-color: transparent;
}
@include hover-focus {
color: $link-hover-color; color: $link-hover-color;
text-decoration: $link-hover-decoration; text-decoration: $link-hover-decoration;
background-color: transparent; background-color: transparent;
border-color: transparent;
} }
&:disabled {
color: $btn-link-disabled-color;
@include hover-focus { &:focus,
text-decoration: none; &.focus {
} border-color: transparent;
box-shadow: none;
} }
&:disabled,
&.disabled {
color: $btn-link-disabled-color;
}
// No need for an active state here
} }

2
scss/mixins/_buttons.scss
View File

@ -9,7 +9,7 @@
border-color: $border; border-color: $border;
@include box-shadow($btn-box-shadow); @include box-shadow($btn-box-shadow);
&:hover { @include hover {
@include color-yiq($background); @include color-yiq($background);
background-color: $active-background; background-color: $active-background;
border-color: $active-border; border-color: $active-border;