Cleanup mw ui checkbox margins

The margin right should apply to the checkbox itself to create a
gap between the pseudo element checkbox and the label.

The existing setup causes rendering issues on io8 and is unnecessary
here. The purpose is to create a space for the checkbox. margin-right
doesn't make any difference to an absolutely positioned element and applying
margins to the label interferes with the pseudo elements themselves.

Bug: 72727
Change-Id: I72af4a53e22b1adb3a70af85f5453a1bc9830eb9

diff --git a/resources/src/mediawiki.ui/components/checkbox.less b/resources/src/mediawiki.ui/components/checkbox.less
index 6868ab6..35a44cb 100644 (file)
--- a/resources/src/mediawiki.ui/components/checkbox.less
+++ b/resources/src/mediawiki.ui/components/checkbox.less
@@ -50,11 +50,11 @@
                height: @checkboxSize;
                // This is needed for Firefox mobile (See bug 71750 to workaround default Firefox stylesheet)
                max-width: none;
+               margin-right: .4em;
 
                // the pseudo before element of the label after the checkbox now looks like a checkbox
                & + label {
                        cursor: pointer;
-                       margin: 0 0.4em;
 
                        &::before {
                                content: '';