font-size: 1em;
// Container layout
display: inline-block;
+ min-width: 4em;
+ max-width: 28.75em; // equivalent to 460px, @see T95367
padding: .5em 1em;
margin: 0;
+ border-radius: @borderRadius;
.box-sizing( border-box );
// Disable weird iOS styling
*display: inline;
zoom: 1;
- // Container styling
- .button-colors( #fff, #ccc, #777 );
- border-radius: @borderRadius;
- min-width: 4em;
-
// Ensure that buttons and inputs are nicely aligned when they have differing heights
vertical-align: middle;
// Content styling
+ .button-colors( #fff, @colorGray12, @colorGray7 );
text-align: center;
font-weight: bold;
&.mw-ui-block {
display: block;
width: 100%;
+ margin-left: auto;
+ margin-right: auto;
}
// Progressive buttons
}
}
- // Constructive buttons
+ // Constructive buttons (deprecated, consolidated with `progressive` – see T110555)
//
// Use constructive buttons for actions which result in a final action in the process that results
// in a change of state.
//
// Styleguide 2.1.2.
&.mw-ui-constructive {
- .button-colors( @colorConstructive, @colorConstructiveHighlight, @colorConstructiveActive );
+ .button-colors( @colorProgressive, @colorProgressiveHighlight, @colorProgressiveActive );
&.mw-ui-quiet {
- .button-colors-quiet( @colorConstructive, @colorConstructiveHighlight, @colorConstructiveActive );
+ .button-colors-quiet( @colorProgressive, @colorProgressiveHighlight, @colorProgressiveActive );
}
}