From e9dfadcbe4a9a07ea1899ceff020a61ed64e208e Mon Sep 17 00:00:00 2001 From: =?utf8?q?Bartosz=20Dziewo=C5=84ski?= Date: Mon, 15 Apr 2019 21:52:13 +0200 Subject: [PATCH] Tweak margins for collapsible OOUI HTMLForms some more * Move the code from mediawiki.action.history.styles, as it's theoretically applicable to other similar forms * Fix it so that it actually only applies when JS is available * Make top and bottom margins/paddings even Follow-up to 32bca54dc94b1befcf21483d9f08017a91ad73eb. Change-Id: Ifde2303f78f971f1e82418c9bd5feddbd6f1f25d --- .../mediawiki.action.history.styles.less | 5 ----- resources/src/mediawiki.htmlform.ooui.styles.less | 11 +++++++++++ 2 files changed, 11 insertions(+), 5 deletions(-) diff --git a/resources/src/mediawiki.action/mediawiki.action.history.styles.less b/resources/src/mediawiki.action/mediawiki.action.history.styles.less index 12656378f0..c6f5b49ae7 100644 --- a/resources/src/mediawiki.action/mediawiki.action.history.styles.less +++ b/resources/src/mediawiki.action/mediawiki.action.history.styles.less @@ -4,11 +4,6 @@ /* stylelint-disable selector-class-pattern */ -// Trigger only when collapsible & JS is available via `.mw-collapsed`. -#mw-history-search.mw-collapsed .oo-ui-fieldsetLayout-header .oo-ui-labelElement-label { - margin-bottom: 0; -} - #pagehistory .history-user { margin-left: 0.4em; margin-right: 0.2em; diff --git a/resources/src/mediawiki.htmlform.ooui.styles.less b/resources/src/mediawiki.htmlform.ooui.styles.less index f356fa2ffe..470d826446 100644 --- a/resources/src/mediawiki.htmlform.ooui.styles.less +++ b/resources/src/mediawiki.htmlform.ooui.styles.less @@ -12,7 +12,18 @@ @ooui-padding-vertical: 4 / @ooui-font-size-browser / @ooui-font-size-base; // equals `0.285714em`≈`4px` .mw-htmlform-ooui-wrapper.oo-ui-panelLayout-padded { + // Reducing `padding-top`, as the heading's `line-height` provides similar distance. padding: @ooui-spacing-medium @ooui-spacing-large @ooui-spacing-large; + + // Trigger only when collapsible & JS is available via `.mw-collapsed`. + .client-js & .oo-ui-fieldsetLayout.mw-collapsed .oo-ui-fieldsetLayout-header { + // Negative margin to match the reduced distance on the top caused by the previous rule. + margin-bottom: -( @ooui-spacing-large - @ooui-spacing-medium ); + + .oo-ui-labelElement-label { + margin-bottom: 0; + } + } } .mw-htmlform-ooui { -- 2.20.1