6 a.button { // a.button is required to override link formatting, such as drop-down buttons
7 background-color: $wcfButtonBackground;
10 color: $wcfButtonText;
12 display: inline-block;
16 text-decoration: none;
18 // input elements do not inherit font family, size and line-height from body
19 font-family: $wcfFontFamily;
20 @include wcfFontDefault;
21 @include wcfLineHeight;
23 // removes UA styling enforced by Safari on iOS
24 -webkit-appearance: none;
26 @include userSelectNone;
33 background-color: $wcfButtonBackgroundActive;
34 color: $wcfButtonTextActive;
35 text-decoration: none;
39 text-transform: uppercase;
46 @include wcfFontSmall;
55 input[type="button"].buttonPrimary,
57 .button.buttonPrimary,
58 a.button.buttonPrimary { // a.button is required to override link formatting, such as dropdown buttons
59 background-color: $wcfButtonPrimaryBackground;
60 color: $wcfButtonPrimaryText;
63 background-color: $wcfButtonPrimaryBackgroundActive;
64 color: $wcfButtonPrimaryTextActive;
68 /* hover states are only applied to non-touch devices to avoid "leftover" hover states after taps */
77 background-color: $wcfButtonBackgroundActive;
78 color: $wcfButtonTextActive;
79 text-decoration: none;
84 input[type="button"].buttonPrimary,
86 .button.buttonPrimary,
87 a.button.buttonPrimary { // a.button is required to override link formatting, such as dropdown buttons
89 background-color: $wcfButtonPrimaryBackgroundActive;
90 color: $wcfButtonPrimaryTextActive;
104 background-color: $wcfButtonDisabledBackground !important;
105 color: $wcfButtonDisabledText !important;
106 cursor: not-allowed !important;
107 pointer-events: none;
111 /* force active state for buttons toggling a dropdown */
114 > input[type="button"],
115 > input[type="reset"],
116 > input[type="submit"],
119 background-color: $wcfButtonBackgroundActive;
120 color: $wcfButtonTextActive;
123 > button.buttonPrimary,
124 > input[type="button"].buttonPrimary,
125 > input[type="submit"],
126 > .button.buttonPrimary,
127 > a.button.buttonPrimary {
128 background-color: $wcfButtonPrimaryBackgroundActive;
129 color: $wcfButtonPrimaryTextActive;
136 &.smallButtons .button {
138 text-transform: none;
140 @include wcfFontSmall;
145 margin-bottom: -10px;
158 min-width: -moz-min-content;
159 min-width: -webkit-min-content;
160 min-width: min-content;
167 .buttonGroupNavigation > ul {
183 &:first-child .button {
184 border-top-left-radius: 2px;
185 border-bottom-left-radius: 2px;
188 &:last-child .button {
189 border-top-right-radius: 2px;
190 border-bottom-right-radius: 2px;