Spage has uploaded a new change for review.
https://gerrit.wikimedia.org/r/59025
Change subject: Improve comments, remove obsolete mw-ui-formlist
......................................................................
Improve comments, remove obsolete mw-ui-formlist
".mw-ui-vform > div" replaced ".mw-ui-formlist div label" some time ago,
Change-Id: I03bdf3b1c50be732435e10193f004230a6a3bacf
---
M resources/mediawiki.ui/mediawiki.ui.default.css
M resources/mediawiki.ui/mediawiki.ui.vector.css
M resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss
3 files changed, 42 insertions(+), 36 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core
refs/changes/25/59025/1
diff --git a/resources/mediawiki.ui/mediawiki.ui.default.css
b/resources/mediawiki.ui/mediawiki.ui.default.css
index 0e0b40e..703bc48 100644
--- a/resources/mediawiki.ui/mediawiki.ui.default.css
+++ b/resources/mediawiki.ui/mediawiki.ui.default.css
@@ -128,21 +128,21 @@
border-bottom-right-radius: 3px;
}
-/* line 12, sourcefiles/scss/components/default/_forms.scss */
+/* line 14, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 290px;
}
-/* line 17, sourcefiles/scss/components/default/_forms.scss */
+/* line 19, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div {
display: block;
margin: 0 0 15px 0;
padding: 0;
width: 100%;
}
-/* line 26, sourcefiles/scss/components/default/_forms.scss */
+/* line 28, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div input,
.mw-ui-vform > div label,
.mw-ui-vform > div .mw-ui-button {
@@ -153,7 +153,7 @@
margin: 0;
width: 100%;
}
-/* line 33, sourcefiles/scss/components/default/_forms.scss */
+/* line 35, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div input {
outline: 0;
border-style: solid;
@@ -167,7 +167,7 @@
box-shadow: #4091ed 0px 0px 5px;
border-color: #4091ed;
}
-/* line 37, sourcefiles/scss/components/default/_forms.scss */
+/* line 39, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div label {
font-size: 0.9em;
color: #7d7d7d;
@@ -179,7 +179,7 @@
.mw-ui-vform > div label * {
font-weight: normal;
}
-/* line 44, sourcefiles/scss/components/default/_forms.scss */
+/* line 51, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div label.mw-ui-checkbox-label, .mw-ui-vform > div
label.mw-ui-radio-label {
margin-bottom: 0.5em;
cursor: pointer;
@@ -198,7 +198,7 @@
border-color: #c9c9c9;
cursor: pointer;
}
-/* line 51, sourcefiles/scss/components/default/_forms.scss */
+/* line 58, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div input[type="checkbox"],
.mw-ui-vform > div input[type="radio"] {
display: inline;
@@ -208,7 +208,7 @@
width: auto;
}
-/* line 66, sourcefiles/scss/components/default/_forms.scss */
+/* line 74, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-input {
outline: 0;
border-style: solid;
@@ -223,17 +223,17 @@
border-color: #4091ed;
}
-/* line 71, sourcefiles/scss/components/default/_forms.scss */
-.mw-ui-block-label, .mw-ui-formlist div label {
+/* line 81, sourcefiles/scss/components/default/_forms.scss */
+.mw-ui-block-label {
font-size: 0.9em;
color: #7d7d7d;
}
/* line 34, sourcefiles/scss/mixins/_forms.scss */
-.mw-ui-block-label *, .mw-ui-formlist div label * {
+.mw-ui-block-label * {
font-weight: normal;
}
-/* line 80, sourcefiles/scss/components/default/_forms.scss */
+/* line 86, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-checkbox-label, .mw-ui-radio-label {
margin-bottom: 0.5em;
cursor: pointer;
diff --git a/resources/mediawiki.ui/mediawiki.ui.vector.css
b/resources/mediawiki.ui/mediawiki.ui.vector.css
index 4849fb4..798aa38 100644
--- a/resources/mediawiki.ui/mediawiki.ui.vector.css
+++ b/resources/mediawiki.ui/mediawiki.ui.vector.css
@@ -257,21 +257,21 @@
text-shadow: none;
}
-/* line 12, sourcefiles/scss/components/default/_forms.scss */
+/* line 14, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 290px;
}
-/* line 17, sourcefiles/scss/components/default/_forms.scss */
+/* line 19, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div {
display: block;
margin: 0 0 15px 0;
padding: 0;
width: 100%;
}
-/* line 26, sourcefiles/scss/components/default/_forms.scss */
+/* line 28, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div input,
.mw-ui-vform > div label,
.mw-ui-vform > div .mw-ui-button {
@@ -282,7 +282,7 @@
margin: 0;
width: 100%;
}
-/* line 33, sourcefiles/scss/components/default/_forms.scss */
+/* line 35, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div input {
outline: 0;
border-style: solid;
@@ -296,7 +296,7 @@
box-shadow: #4091ed 0px 0px 5px;
border-color: #4091ed;
}
-/* line 37, sourcefiles/scss/components/default/_forms.scss */
+/* line 39, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div label {
font-size: 0.9em;
color: #7d7d7d;
@@ -308,7 +308,7 @@
.mw-ui-vform > div label * {
font-weight: normal;
}
-/* line 44, sourcefiles/scss/components/default/_forms.scss */
+/* line 51, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div label.mw-ui-checkbox-label, .mw-ui-vform > div
label.mw-ui-radio-label {
margin-bottom: 0.5em;
cursor: pointer;
@@ -327,7 +327,7 @@
border-color: #c9c9c9;
cursor: pointer;
}
-/* line 51, sourcefiles/scss/components/default/_forms.scss */
+/* line 58, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-vform > div input[type="checkbox"],
.mw-ui-vform > div input[type="radio"] {
display: inline;
@@ -337,7 +337,7 @@
width: auto;
}
-/* line 66, sourcefiles/scss/components/default/_forms.scss */
+/* line 74, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-input {
outline: 0;
border-style: solid;
@@ -352,17 +352,17 @@
border-color: #4091ed;
}
-/* line 71, sourcefiles/scss/components/default/_forms.scss */
-.mw-ui-block-label, .mw-ui-formlist div label {
+/* line 81, sourcefiles/scss/components/default/_forms.scss */
+.mw-ui-block-label {
font-size: 0.9em;
color: #7d7d7d;
}
/* line 34, sourcefiles/scss/mixins/_forms.scss */
-.mw-ui-block-label *, .mw-ui-formlist div label * {
+.mw-ui-block-label * {
font-weight: normal;
}
-/* line 80, sourcefiles/scss/components/default/_forms.scss */
+/* line 86, sourcefiles/scss/components/default/_forms.scss */
.mw-ui-checkbox-label, .mw-ui-radio-label {
margin-bottom: 0.5em;
cursor: pointer;
diff --git
a/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss
b/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss
index 440669e..bca5f86 100644
--- a/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss
+++ b/resources/mediawiki.ui/sourcefiles/scss/components/default/_forms.scss
@@ -5,10 +5,12 @@
// --------------------------------------------------------------------------
// The FancyCaptcha image CAPTCHA used on WMF wikis drives the width of the
-// 'vform' stacked div design, the form can't be narrower than this.
+// 'VForm' design, the form can't be narrower than this.
$captchaContainerWidth: 290px;
$defaultFormWidth: $captchaContainerWidth;
+// Style a compact vertical stacked form ("VForm") and the elements in divs
+// within it.
.mw-ui-vform {
@include box-sizing(border-box);
@@ -20,7 +22,7 @@
padding: 0;
width: 100%;
- // MW currently doesn't use the type attribute everywhere on inputs
+ // MW currently doesn't use the type attribute everywhere on inputs.
input,
label,
.mw-ui-button {
@@ -41,12 +43,17 @@
margin: 0 0 0.2em 0;
padding: 0;
+ // Nesting an input checkbox or radio button inside a label with
+ // this class improves alignment, e.g.
+ // <label class="mw-ui-checkbox-label">
+ // <input type="checkbox">The label text
+ // </label>
&.mw-ui-checkbox-label, &.mw-ui-radio-label {
@include agora-inline-label-styling;
}
}
- // Override the above styling just for checkboxes and radio inputs
+ // Override input styling just for checkboxes and radio inputs.
input[type="checkbox"],
input[type="radio"] {
display: inline;
@@ -61,22 +68,21 @@
// Elements
// --------------------------------------------------------------------------
-// Apply mw-ui-input to fields individually to style them
-// You don't need to use this if <input> is within a Agora form container
+// Apply mw-ui-input to individual input fields to style them.
+// You generally don't need to use this class if <input> is within an Agora
+// form container such as mw-ui-vform
.mw-ui-input {
@include agora-field-styling; // mixins/_forms.scss
}
-// Default label styling is mw-ui-block-label
-.mw-ui-block-label, .mw-ui-formlist div label {
+// Apply mw-ui-block-label to individual elements to style them.
+// You generally don't need to use this class if <label> is within an Agora
+// form container such as mw-ui-vform
+.mw-ui-block-label {
@include agora-label-styling; // mixins/_forms.scss
}
-// Checkbox and radio button label alignment hack
-// <label class="mw-ui-checkbox-label">
-// <input type="checkbox" />Label
-// </label>
-
+// Apply mw-ui-{checkbox,radio}-label to individual items to style them.
.mw-ui-checkbox-label, .mw-ui-radio-label {
@include agora-inline-label-styling;
}
--
To view, visit https://gerrit.wikimedia.org/r/59025
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I03bdf3b1c50be732435e10193f004230a6a3bacf
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/core
Gerrit-Branch: master
Gerrit-Owner: Spage <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
