mediawiki-skins-MinervaNeue/resources/skins.minerva.base.styles/header.less
Jon Robson fade8ad2c2 Search icon should be part of search form for grade C browsers
Cached HTML friendly change which works by limiting styles to the new
HTML which is identified by the existence of the
minerva-search-form class

Bug: T301257
Change-Id: I61ba77a349a38e6a05f87f600ec31bcbf36f306a
2022-02-22 08:40:55 -08:00

71 lines
1.2 KiB
Plaintext

.header-container {
border-bottom: 1px solid @colorGray12;
padding: 0 @contentPadding;
&.header-chrome {
background-color: @chromeColor;
border: 0;
box-shadow: inset 0 -1px 3px rgba( 0, 0, 0, 0.08 );
}
}
.minerva-header {
.branding-box {
opacity: @opacity-icon-subtle; // T251135
a {
float: left;
margin-left: 5px;
font-size: 1em;
text-decoration: none;
color: @colorGray2;
span {
line-height: 0;
font-size: inherit;
}
> * {
float: left;
}
sup {
color: @colorGray5;
display: none;
.beta & {
display: initial;
}
}
}
}
.search-box {
// Search box should grow to fill rest of header
flex: 1 0 auto;
display: none;
}
// Fix cursor for Safari
#searchInput { // stylelint-disable-line selector-max-id
cursor: text;
}
}
@media screen and ( min-width: @width-breakpoint-tablet ) {
.minerva-header {
.branding-box {
// Handle logos that are larger than the set branding box width
// This will also cause the searchbox overlay to be misaligned with the .minerva-heading searchbox
min-width: @brandingBoxWidth;
width: auto;
}
.search-box {
display: block;
width: @searchBoxWidth;
max-width: @searchBoxWidth;
}
}
}