From bc2d6ca07161b6f9457d3eeb02f597ebe4903940 Mon Sep 17 00:00:00 2001 From: Prateek Saxena Date: Wed, 5 Nov 2014 17:19:04 +0530 Subject: [PATCH] mediawiki.ui: checkbox: Fix gap between bevel and border Use an inset box-shadow instead of adding another pseudo element. This removes the gap and also keeps the look consistent on different zoom levels. Change-Id: Ibf75a09ef9955a5d1cb9d80bff2cce001b60d7c6 --- resources/src/mediawiki.ui/components/checkbox.less | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/resources/src/mediawiki.ui/components/checkbox.less b/resources/src/mediawiki.ui/components/checkbox.less index 35a44cb54b..913f90178b 100644 --- a/resources/src/mediawiki.ui/components/checkbox.less +++ b/resources/src/mediawiki.ui/components/checkbox.less @@ -84,14 +84,8 @@ &:active, &:focus { + label { - &::after { - content: ''; - position: absolute; - width: @checkboxSize; - height: @checkboxSize - @focusBottomBorderSize + 0.08; // offset by bottom border - // offset from the checkbox by 1px to account for left border - left: 1px; - border-bottom: solid @focusBottomBorderSize lightgrey; + &::before { + box-shadow: inset 0 -@focusBottomBorderSize 0 0 lightgrey; } } } -- 2.20.1