'name' => 'wpSave',
'tabindex' => ++$tabindex,
] + Linker::tooltipAndAccesskeyAttribs( 'save' );
- $buttons['save'] = Html::submitButton( $buttonLabel, $attribs, [ 'mw-ui-constructive' ] );
+ $buttons['save'] = Html::submitButton( $buttonLabel, $attribs, [ 'mw-ui-progressive' ] );
++$tabindex; // use the same for preview and live preview
$attribs = [
/**
* Convenience function to build an HTML submit button
- * When $wgUseMediaWikiUIEverywhere is true it will default to a constructive button
+ * When $wgUseMediaWikiUIEverywhere is true it will default to a progressive button
* @param string $value Label text for the button
* @param array $attribs Optional custom attributes
* @return string HTML
// some submit forms
// might need to be mw-ui-destructive (e.g. delete a page)
if ( $wgUseMediaWikiUIEverywhere ) {
- $baseAttrs['class'] = 'mw-ui-button mw-ui-constructive';
+ $baseAttrs['class'] = 'mw-ui-button mw-ui-progressive';
}
// Any custom attributes will take precendence of anything in baseAttrs e.g. override the class
$attribs = $attribs + $baseAttrs;
protected $mFieldTree;
protected $mShowReset = false;
protected $mShowSubmit = true;
- protected $mSubmitFlags = [ 'constructive', 'primary' ];
+ protected $mSubmitFlags = [ 'primary', 'progressive' ];
protected $mShowCancel = false;
protected $mCancelTarget;
class HTMLSubmitField extends HTMLButtonField {
protected $buttonType = 'submit';
- protected $mFlags = [ 'primary', 'constructive' ];
+ protected $mFlags = [ 'primary', 'progressive' ];
public function skipLoadData( $request ) {
return !$request->getCheck( $this->mName );
'name' => 'op',
'value' => 'create',
'label-message' => 'botpasswords-label-create',
- 'flags' => [ 'primary', 'constructive' ],
+ 'flags' => [ 'primary', 'progressive' ],
] );
}
'name' => 'wpMove',
'value' => $this->msg( 'movepagebtn' )->text(),
'label' => $this->msg( 'movepagebtn' )->text(),
- 'flags' => [ 'constructive', 'primary' ],
+ 'flags' => [ 'primary', 'progressive' ],
'type' => 'submit',
] ),
[
fullscreenButton.$element,
new OO.ui.ButtonWidget( {
label: mw.message( 'apisandbox-submit' ).text(),
- flags: [ 'primary', 'constructive' ]
+ flags: [ 'primary', 'progressive' ]
} ).on( 'click', ApiSandbox.sendRequest ).$element,
new OO.ui.ButtonWidget( {
label: mw.message( 'apisandbox-reset' ).text(),
dynamicParamNameWidget,
new OO.ui.ButtonWidget( {
icon: 'add',
- flags: 'constructive'
+ flags: 'progressive'
} ).on( 'click', addDynamicParamWidget ),
{
label: mw.message( 'apisandbox-dynamic-parameters-add-label' ).text(),
// Neutral button styling
//
-// These are the main actions on the page/workflow. The page should have only one of progressive, constructive and desctructive buttons, the rest being quiet.
+// These are the main actions on the page/workflow. The page should have only one of progressive and destructive buttons, the rest being quiet.
//
// Markup:
// <div>
// <button class="mw-ui-button mw-ui-progressive mw-ui-big">.mw-ui-progressive</button>
// </div>
// <div>
- // <button class="mw-ui-button mw-ui-constructive mw-ui-big">.mw-ui-constructive</button>
- // </div>
- // <div>
// <button class="mw-ui-button mw-ui-destructive mw-ui-big">.mw-ui-destructive</button>
// </div>
//
// <button class="mw-ui-button mw-ui-progressive mw-ui-block">.mw-ui-progressive</button>
// </div>
// <div>
- // <button class="mw-ui-button mw-ui-constructive mw-ui-block">.mw-ui-constructive</button>
- // </div>
- // <div>
// <button class="mw-ui-button mw-ui-destructive mw-ui-block">.mw-ui-destructive</button>
// </div>
//
// Quiet buttons
//
- // Use quiet buttons when they are less important and alongside other constructive, progressive or destructive buttons. It should be used for an action that exits the user from the current view/workflow.
+ // Use quiet buttons when they are less important and alongside other progressive or destructive buttons. It should be used for an action that exits the user from the current view/workflow.
// Its use is not recommended on mobile/tablet due to lack of hover state.
//
// Markup:
// <button class="mw-ui-button mw-ui-quiet">.mw-ui-button</button>
// </div>
// <div>
- // <button class="mw-ui-button mw-ui-constructive mw-ui-quiet">.mw-ui-constructive</button>
- // </div>
- // <div>
- // <button class="mw-ui-button mw-ui-constructive mw-ui-quiet" disabled>.mw-ui-constructive</button>
- // </div>
- // <div>
// <button class="mw-ui-button mw-ui-destructive mw-ui-quiet">.mw-ui-destructive</button>
// </div>
// <div>
// <input class="mw-ui-input" value="input">
// </div>
// <div class="mw-ui-vform-field">
-// <button class="mw-ui-button mw-ui-constructive">Button in vform</button>
+// <button class="mw-ui-button mw-ui-progressive">Button in vform</button>
// </div>
// </form>
//
//
// Markup:
// <input class="mw-ui-input mw-ui-input-inline">
-// <button class="mw-ui-button mw-ui-constructive">Submit</button>
+// <button class="mw-ui-button mw-ui-progressive">Submit</button>
//
// Styleguide 1.2.
input[type="number"],
Context classes may be used on elements with only plain-text content with the mw-ui-text base. When the context classes
are used on interactive and block-level elements, the appropriate alternative base type classes should also be used. For
example, mw-ui-anchor with A, or mw-ui-button with buttons.
+'Constructive' is deprecated and merged with 'Progressive'.
Markup:
<span class="mw-ui-text mw-ui-progressive">Progressive</span>
-<span class="mw-ui-text mw-ui-constructive">Constructive</span>
<span class="mw-ui-text mw-ui-destructive">Destructive</span>
Styleguide 6.1.
.mw-ui-text {
// The selector order is like this on purpose; IE 6 ignores the second selector,
// so we don't want to accidentally apply this color on all mw-ui-CONTEXT classes
- .mw-ui-progressive& {
- color: @colorProgressive;
- }
+ .mw-ui-progressive&,
.mw-ui-constructive& {
- color: @colorConstructive;
+ color: @colorProgressive;
}
.mw-ui-destructive& {
color: @colorDestructive;
modes: 'insert'
},
{
- flags: [ 'primary', 'constructive' ],
+ flags: [ 'primary', 'progressive' ],
label: mw.msg( 'upload-dialog-button-save' ),
action: 'save',
modes: 'info'
{
action: 'submit',
label: mw.msg( 'feedback-submit' ),
- flags: [ 'primary', 'constructive' ]
+ flags: [ 'primary', 'progressive' ]
},
{
action: 'external',
label: mw.msg( 'feedback-external-bug-report-button' ),
- flags: 'constructive'
+ flags: 'progressive'
},
{
action: 'cancel',