From 8351c88c50900c514e1e54084dbf6c92c199df7c Mon Sep 17 00:00:00 2001 From: jdlrobson Date: Thu, 5 Jul 2018 16:03:04 -0700 Subject: [PATCH] Move overlay-header styles to Overlay .header > form matches no element on the page all other selectors are linked to the mobile Overlay so should be shipped along with those styles. Remove .header-action rule, given that header-action's only appear inside Overlays (Editor, Category and Talk) A more generic rule already exists (.overlay .header-action > *) for overlays that sets the min-height Change-Id: I114fe80e50bb833e9e6bb0fb6b13c2e929244ddf --- resources/skins.minerva.base.styles/ui.less | 17 ----------------- skinStyles/mobile.startup/Overlay.less | 12 ++++++++++++ 2 files changed, 12 insertions(+), 17 deletions(-) diff --git a/resources/skins.minerva.base.styles/ui.less b/resources/skins.minerva.base.styles/ui.less index 01fa5ed..c10c9c8 100644 --- a/resources/skins.minerva.base.styles/ui.less +++ b/resources/skins.minerva.base.styles/ui.less @@ -108,23 +108,6 @@ body { > .header-title { vertical-align: middle; } - - .header-action > * { - min-height: @headerHeight; - } -} - -.header > form, -.overlay-header .overlay-title { - padding: 0.15em 0; - - &:last-child { - // Reserve space to the right in case the search form in the header or - // overlay title in the overlay header is the last element. Use @iconGutterWidth - // because there is a hamburger or close/back icon next to this element and - // the space between them is exactly that. - padding-right: @iconGutterWidth; - } } #searchInput { diff --git a/skinStyles/mobile.startup/Overlay.less b/skinStyles/mobile.startup/Overlay.less index 7c54128..dbbc2ec 100644 --- a/skinStyles/mobile.startup/Overlay.less +++ b/skinStyles/mobile.startup/Overlay.less @@ -24,6 +24,18 @@ } } +.overlay-header .overlay-title { + padding: 0.15em 0; + + &:last-child { + // Reserve space to the right in case the search form in the header or + // overlay title in the overlay header is the last element. Use @iconGutterWidth + // because there is a hamburger or close/back icon next to this element and + // the space between them is exactly that. + padding-right: @iconGutterWidth; + } +} + @media all and ( min-width: @width-breakpoint-desktop ) { .overlay-header { // Make sure the close button and secondary button icon images are aligned