1 // scss-lint:disable QualifyingElement
9 font-weight: $btn-font-weight;
10 line-height: $btn-line-height;
13 vertical-align: middle;
15 border: $input-btn-border-width solid transparent;
16 @include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $btn-border-radius);
17 @include transition($btn-transition);
19 // Share hover and focus styles
20 @include hover-focus {
21 text-decoration: none;
26 box-shadow: $btn-focus-box-shadow;
29 // Disabled comes first so active can properly restyle
32 cursor: $cursor-disabled;
34 @include box-shadow(none);
39 background-image: none;
40 @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow);
44 // Future-proof disabling of clicks on `<a>` elements
46 fieldset[disabled] a.btn {
56 @include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border);
59 @include button-variant($btn-secondary-color, $btn-secondary-bg, $btn-secondary-border);
62 @include button-variant($btn-info-color, $btn-info-bg, $btn-info-border);
65 @include button-variant($btn-success-color, $btn-success-bg, $btn-success-border);
68 @include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border);
71 @include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border);
74 // Remove all backgrounds
75 .btn-outline-primary {
76 @include button-outline-variant($btn-primary-bg);
78 .btn-outline-secondary {
79 @include button-outline-variant($btn-secondary-border);
82 @include button-outline-variant($btn-info-bg);
84 .btn-outline-success {
85 @include button-outline-variant($btn-success-bg);
87 .btn-outline-warning {
88 @include button-outline-variant($btn-warning-bg);
91 @include button-outline-variant($btn-danger-bg);
99 // Make a button look and behave like a link
101 font-weight: $font-weight-normal;
109 background-color: transparent;
110 @include box-shadow(none);
115 border-color: transparent;
118 border-color: transparent;
120 @include hover-focus {
121 color: $link-hover-color;
122 text-decoration: $link-hover-decoration;
123 background-color: transparent;
126 color: $btn-link-disabled-color;
128 @include hover-focus {
129 text-decoration: none;
140 // line-height: ensure even-numbered height of button next to large input
141 @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $font-size-lg, $btn-border-radius-lg);
144 // line-height: ensure proper height of button next to small input
145 @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-border-radius-sm);
158 // Vertically space out multiple block buttons
159 .btn-block + .btn-block {
160 margin-top: $btn-block-spacing-y;
163 // Specificity overrides
164 input[type="submit"],
166 input[type="button"] {