VectorGOLEM/resources/skins.vector.styles/layout.less
jdlrobson 53d9452795 Move the personal tools and search into header
To support roll out and avoid issues with cached HTML the new
styles for the new search feature are restricted to HTML where
the body tag has `skin-vector-search-header` class.

For legacy mode, we introduce a new class
`skin-vector-search-header-legacy` and temporarily use a CSS3 `:not()`
selector to ensure the styles ship during the phase where cached
HTML can be served. While this will create some display issues in
browsers that do not support CSS3 selectors, all grade A browsers in
our compatability matrix support this.

Bug: T249363
Change-Id: I7f8059d43eaab49de362405784b34a4fe502c7b0
2020-08-11 23:36:01 +00:00

32 lines
1.1 KiB
Plaintext

// Layout rules divide the page into sections and how VectorComponents should be arranged in the skin.
// The rules here should only define the layout, not color or typography.
@import '../../variables.less';
@import 'mediawiki.mixins.less';
// Modern layout variables
@height-tabs: 2.5em; // Keep in sync with .vector-menu-tabs height.
@margin-top-sidebar: 0.5em;
// Header sizes defined in the description of T246170 and comment T246170#5957100
@padding-left-sidebar: 0.5em;
@padding-horizontal-header: @margin-end-portal +
@padding-left-sidebar +
( @margin-start-nav-main-body / @font-size-nav-main-heading );
@padding-vertical-header: 0.125em;
@margin-top-header: 0.625em;
@margin-bottom-header: 0.3125em;
@height-logo-icon: 3.125em; // Logo sizes per specification in T245190.
@height-header: @height-logo-icon +
@margin-top-header + @margin-bottom-header +
2 * @padding-vertical-header;
@width-grid-column-one: 11em;
// Default layout.
@import 'layout-default.less';
//
// Feature flag modifications to layout (additive)
//
@import 'layout-max-width.less';
@import 'layout-search-header.less';