Bartosz Dziewoński has uploaded a new change for review.
https://gerrit.wikimedia.org/r/175030
Change subject: mediawiki.ui: Synchronise checkbox and radio code
......................................................................
mediawiki.ui: Synchronise checkbox and radio code
Get rid of tiny meaningless differences.
Change-Id: I78b3bf378bae1fce11b6ef4f85f7449421211721
---
M resources/src/mediawiki.ui/components/checkbox.less
M resources/src/mediawiki.ui/components/radio.less
2 files changed, 17 insertions(+), 13 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/mediawiki/core
refs/changes/30/175030/1
diff --git a/resources/src/mediawiki.ui/components/checkbox.less
b/resources/src/mediawiki.ui/components/checkbox.less
index b479020..d66a0e4 100644
--- a/resources/src/mediawiki.ui/components/checkbox.less
+++ b/resources/src/mediawiki.ui/components/checkbox.less
@@ -11,16 +11,20 @@
//
// Markup:
// <div class="mw-ui-checkbox">
-// <input type="checkbox" id="kss-example-5"><label
for="kss-example-5">Standard checkbox</label>
+// <input type="checkbox" id="kss-example-5">
+// <label for="kss-example-5">Standard checkbox</label>
// </div>
// <div class="mw-ui-checkbox">
-// <input type="checkbox" id="kss-example-5-checked" checked><label
for="kss-example-5-checked">Standard checked checkbox</label>
+// <input type="checkbox" id="kss-example-5-checked" checked>
+// <label for="kss-example-5-checked">Standard checked checkbox</label>
// </div>
// <div class="mw-ui-checkbox">
-// <input type="checkbox" id="kss-example-5-disabled" disabled><label
for="kss-example-5-disabled">Disabled checkbox</label>
+// <input type="checkbox" id="kss-example-5-disabled" disabled>
+// <label for="kss-example-5-disabled">Disabled checkbox</label>
// </div>
// <div class="mw-ui-checkbox">
-// <input type="checkbox" id="kss-example-5-disabled-checked" disabled
checked><label for="kss-example-5-disabled-checked">Disabled checked
checkbox</label>
+// <input type="checkbox" id="kss-example-5-disabled-checked" disabled
checked>
+// <label for="kss-example-5-disabled-checked">Disabled checked
checkbox</label>
// </div>
//
// Styleguide 5.
@@ -58,6 +62,7 @@
& + label::before {
content: '';
cursor: pointer;
+ .box-sizing(border-box);
position: absolute;
left: 0;
border-radius: @borderRadius;
@@ -65,7 +70,6 @@
height: @checkboxSize;
background-color: #fff;
border: 1px solid @colorGray7;
- .box-sizing(border-box);
}
// when the input is checked, style the label pseudo before
element that followed as a checked checkbox
@@ -77,6 +81,10 @@
background-origin: border-box;
}
+ &:hover + label::before {
+ border-bottom-width: 3px;
+ }
+
&:active + label::before {
background-color: @colorGray13;
border-color: @colorGray13;
@@ -84,10 +92,6 @@
&:focus + label::before {
border-width: 2px;
- }
-
- &:hover + label::before {
- border-bottom-width: 3px;
}
// disabled checkboxes have a gray background
diff --git a/resources/src/mediawiki.ui/components/radio.less
b/resources/src/mediawiki.ui/components/radio.less
index 13544dd..b48ca17 100644
--- a/resources/src/mediawiki.ui/components/radio.less
+++ b/resources/src/mediawiki.ui/components/radio.less
@@ -42,7 +42,6 @@
line-height: @radioSize;
* {
- font: inherit;
vertical-align: middle;
}
@@ -59,8 +58,8 @@
// the pseudo before element of the label after the radio now
looks like a radio
& + label::before {
- cursor: pointer;
content: '';
+ cursor: pointer;
.box-sizing(border-box);
position: absolute;
left: 0;
@@ -86,6 +85,7 @@
&:active + label::before {
background-color: @colorGray13;
+ border-color: @colorGray13;
}
&:focus + label::before {
@@ -95,11 +95,11 @@
// disabled checked boxes have a gray background
&:disabled + label::before {
cursor: default;
- border-color: @colorGray14;
background-color: @colorGray14;
+ border-color: @colorGray14;
}
- // disables and checked boxes have a white circle
+ // disabled and checked boxes have a white circle
&:disabled:checked + label::before {
.background-image-svg('images/radio_disabled.svg',
'images/radio_disabled.png');
}
--
To view, visit https://gerrit.wikimedia.org/r/175030
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I78b3bf378bae1fce11b6ef4f85f7449421211721
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/core
Gerrit-Branch: master
Gerrit-Owner: Bartosz Dziewoński <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
