From 7837e3952ceb68753a1880e6ecda1adda7d0fb0c Mon Sep 17 00:00:00 2001 From: Ed Sanders Date: Tue, 12 Mar 2024 11:03:20 -0700 Subject: [PATCH] Fix overlap between preview button and edit switcher These buttons can appear in any order depending on when the code loads. Remove the default OOUI button negative margin. Replace group padding with margin now there is no negative margin on the buttons. Change-Id: Id2ebf7aa0b27da1d03d56f59e8a9a96f7656106d --- modules/jquery.wikiEditor.toolbar.less | 2 +- modules/realtimepreview/RealtimePreview.less | 16 +++++++++++----- 2 files changed, 12 insertions(+), 6 deletions(-) diff --git a/modules/jquery.wikiEditor.toolbar.less b/modules/jquery.wikiEditor.toolbar.less index eff00ca7..de0e581c 100644 --- a/modules/jquery.wikiEditor.toolbar.less +++ b/modules/jquery.wikiEditor.toolbar.less @@ -111,7 +111,7 @@ .group { padding-right: 0; - padding-left: 6px; + margin-left: 6px; border-left: 1px solid #c8ccd1; } } diff --git a/modules/realtimepreview/RealtimePreview.less b/modules/realtimepreview/RealtimePreview.less index 8183c85c..4059427b 100644 --- a/modules/realtimepreview/RealtimePreview.less +++ b/modules/realtimepreview/RealtimePreview.less @@ -1,11 +1,17 @@ @import 'mediawiki.skin.variables.less'; -.ext-WikiEditor-realtimepreview-button:hover { - background-color: @background-color-interactive; -} +.ext-WikiEditor-realtimepreview-button { + &:hover { + background-color: @background-color-interactive; + } -.ext-WikiEditor-realtimepreview-button.oo-ui-toggleWidget-on .oo-ui-labelElement-label { - color: @color-progressive; + &.oo-ui-toggleWidget-on .oo-ui-labelElement-label { + color: @color-progressive; + } + + &.oo-ui-buttonElement-frameless.oo-ui-labelElement.oo-ui-iconElement:first-child { + margin-left: 0; + } } /* stylelint-disable selector-max-id */