mediawiki-skins-MinervaNeue/skinStyles/mobile.search/SearchOverlay.less
jdlrobson 4389b67989 Explicitly use LESS variable for breakpoint defined in mediawiki ui
$wgResourceLoaderLESSVars is deprecated. Let's not use it anymore.

Change-Id: If28ab6884668700bc46533c8e2c377f17e6be696
Depends-On: Ib9f843147db4473ce5590741e0fb490384b0007e
Bug: T171365
2018-02-06 22:23:32 +00:00

56 lines
1.1 KiB
Plaintext

@import 'minerva.variables';
// These styles transform the SearchOverlay appearance in the Minerva skin.
// Since SearchOverlay can be used by other skins, these styles are kept separate from
// the others.
.search-overlay {
.spinner-container {
top: @headerHeight;
}
.clear {
position: absolute;
top: ( @headerHeight / 2 ) - ( @iconSize / 2 );
right: 0;
margin-top: @headerMarginTop;
}
}
@media all and ( min-width: @width-breakpoint-tablet ) {
.search-overlay {
.search-box {
display: table-cell;
}
.spinner-container,
.search-content,
.results {
width: @searchBoxWidth;
margin-left: (@iconSize + 2 * @iconGutterWidth) + @brandingBoxWidth;
}
.overlay-title {
width: @searchBoxWidth;
padding-left: (@iconSize + 2 * @iconGutterWidth) + @brandingBoxWidth;
}
.spinner-container {
left: auto;
right: auto;
}
ul {
width: auto;
}
}
}
@media all and ( min-width: @width-breakpoint-desktop ) {
.search-overlay {
.overlay-content {
// align with the search form
max-width: @contentMaxWidthTablet + ( 2 * @iconGutterWidth );
}
}
}