1 // stylelint-disable selector-no-qualifying-type
9 font-weight: $btn-font-weight;
12 vertical-align: middle;
14 border: $btn-border-width solid transparent;
15 @include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $btn-line-height, $btn-border-radius);
16 @include transition($btn-transition);
18 // Share hover and focus styles
19 @include hover-focus {
20 text-decoration: none;
26 box-shadow: $btn-focus-box-shadow;
29 // Disabled comes first so active can properly restyle
32 opacity: $btn-disabled-opacity;
33 @include box-shadow(none);
36 // Opinionated: add "hand" cursor to non-disabled .btn elements
37 &:not(:disabled):not(.disabled) {
41 &:not(:disabled):not(.disabled):active,
42 &:not(:disabled):not(.disabled).active {
43 @include box-shadow($btn-active-box-shadow);
46 @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow);
51 // Future-proof disabling of clicks on `<a>` elements
53 fieldset:disabled a.btn {
62 @each $color, $value in $theme-colors {
64 @include button-variant($value, $value);
68 @each $color, $value in $theme-colors {
69 .btn-outline-#{$color} {
70 @include button-outline-variant($value);
79 // Make a button look and behave like a link
81 font-weight: $font-weight-normal;
83 background-color: transparent;
86 color: $link-hover-color;
87 text-decoration: $link-hover-decoration;
88 background-color: transparent;
89 border-color: transparent;
94 text-decoration: $link-hover-decoration;
95 border-color: transparent;
101 color: $btn-link-disabled-color;
102 pointer-events: none;
105 // No need for an active state here
114 @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
118 @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
130 // Vertically space out multiple block buttons
132 margin-top: $btn-block-spacing-y;
136 // Specificity overrides
137 input[type="submit"],
139 input[type="button"] {