mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/InputBox
synced 2024-11-24 07:03:41 +00:00
93351fb7d9
Remove the JavaScript module and its logic to toggle the disabled state on the submit button. Instead, let the browser handle this natively by setting the `required` attribute, which naturally prevents early submissions. Retain the current styling for 99% of cases by using the :required:invalid selector to target the submit button to make it appear disabled. This slight duplication of styles is needed because, despite the form effectively being disabled natively, the core mediawiki-ui styles only account for :disabled on the button directly and not e.g. inherited via form:invalid. It is also unclear whether we would want that, since there is some value to be had from having the form give a consistent look with a progressive button that can be submitted even at the wrong time to yield an assistive message to the required field, so hence handling this locally for now instead of with a generalised approach. In order to use the required true/false idiom, I have switched the generating of the HTML string from the old Xml::element method to Html::element. This means there is no need to store it in an array first and conditionally set it since true/false will result in absence or required="" as needed. As side-effect from this, redundant attributes like value="" and type="text" are ommitted from the output, just as MediaWiki core does more generally. Bug: T283303 Change-Id: I2c75e09dd3f89fa11fca311b4e1f8133946b01b1
32 lines
732 B
Plaintext
32 lines
732 B
Plaintext
@import 'mediawiki.ui/variables.less';
|
|
|
|
.mw-inputbox-centered {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
text-align: center;
|
|
}
|
|
|
|
.mw-inputbox-inline {
|
|
display: inline;
|
|
}
|
|
|
|
.mw-inputbox-element {
|
|
/* important is needed to overwrite display:table from mw-ui checkbox */
|
|
display: inline-table !important;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.mw-inputbox-input {
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
/* TODO: Remove first selector 30 days after May 2021 parsercache expires */
|
|
.createboxInput[type="text"]:placeholder-shown ~ .createboxButton,
|
|
.mw-inputbox-createbox:required:invalid ~ .mw-ui-button {
|
|
/* appear like .mw-ui-input:disabled */
|
|
background-color: @colorGray12;
|
|
color: @color-base--inverted;
|
|
border-color: @colorGray12;
|
|
cursor: default;
|
|
}
|