Merge "Disable styling for checkboxes and radios on non-js browsers"

diff --git a/resources/src/mediawiki.ui/components/checkbox.less b/resources/src/mediawiki.ui/components/checkbox.less
index be0c638..089504a 100644 (file)
--- a/resources/src/mediawiki.ui/components/checkbox.less
+++ b/resources/src/mediawiki.ui/components/checkbox.less
@@ -36,7 +36,10 @@
 @checkboxSize: 2em;
 
 // We use the not selector to cancel out styling on IE 8 and below
-.mw-ui-checkbox:not(#noop) {
+// We also disable this styling on javascript disabled devices. This fixes the issue with
+// Opera Mini where checking/unchecking doesn't apply styling but potentially leaves other
+// more capable browsers with unstyled checkboxes.
+.client-js .mw-ui-checkbox:not(#noop) {
        // Position relatively so we can make use of absolute pseudo elements
        position: relative;
        line-height: @checkboxSize;

diff --git a/resources/src/mediawiki.ui/components/radio.less b/resources/src/mediawiki.ui/components/radio.less
index bb012eb..1928699 100644 (file)
--- a/resources/src/mediawiki.ui/components/radio.less
+++ b/resources/src/mediawiki.ui/components/radio.less
@@ -35,8 +35,11 @@
 
 @radioSize: 2em;
 
-// We use the not selector to cancel out styling on IE 8 and below
-.mw-ui-radio:not(#noop) {
+// We use the not selector to cancel out styling on IE 8 and below.
+// We also disable this styling on javascript disabled devices. This fixes the issue with
+// Opera Mini where checking/unchecking doesn't apply styling but potentially leaves other
+// more capable browsers with unstyled radio buttons.
+.client-js .mw-ui-radio:not(#noop) {
        // Position relatively so we can make use of absolute pseudo elements
        position: relative;
        line-height: @radioSize;