From 273b420d1b899b360cb52c97a79e6d61cedb55ec Mon Sep 17 00:00:00 2001 From: Bahodir Mansurov Date: Tue, 13 Jan 2015 14:22:44 -0500 Subject: [PATCH] Disable styling for checkboxes and radios on non-js browsers Change-Id: I0b9691daa61fddb484b6adff759f4413d201ae03 --- resources/src/mediawiki.ui/components/checkbox.less | 5 ++++- resources/src/mediawiki.ui/components/radio.less | 7 +++++-- 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/resources/src/mediawiki.ui/components/checkbox.less b/resources/src/mediawiki.ui/components/checkbox.less index be0c638aff..089504a399 100644 --- 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 bb012ebe97..1928699bb5 100644 --- 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; -- 2.20.1