mediawiki-skins-MinervaNeue/includes/Skins/Header.mustache
bwang 0bee6a1eb6 Move the form element in Minerva's header and apply core checkbox hack consistently to toggle lists
- Factors out Header and SearchBox partials

Bug: T294164
Depends-on: I16d1dfba1b6d0745afff14f1b79586bb17ecdd69
Change-Id: I997f3c2de5cf813db63220580e7cb3fe09aa6932
2022-01-04 11:01:17 -06:00

43 lines
1.9 KiB
Plaintext

<header class="header-container header-chrome">
<div class="minerva-header">
<nav class="navigation-drawer toggle-list view-border-box">
<input type="checkbox" id="main-menu-input" class="toggle-list__checkbox" role="button" aria-haspopup="true" aria-expanded="false" aria-labelledby="mw-mf-main-menu-button">
<label for="main-menu-input" id="mw-mf-main-menu-button" aria-hidden="true"
class=" mw-ui-button mw-ui-quiet mw-ui-icon mw-ui-icon-element mw-ui-icon-wikimedia-menu-base20 mw-ui-icon-flush-left toggle-list__toggle"
title="{{msg-mobile-frontend-main-menu-button-tooltip}}" data-event-name="ui.mainmenu">{{msg-mobile-frontend-main-menu-button-tooltip}}</label>
{{#data-minerva-main-menu}}{{>menu}}{{/data-minerva-main-menu}}
<label class="main-menu-mask" for="main-menu-input"></label>
</nav>
<div class="branding-box">
<a href="{{link-mainpage}}">
{{#data-logos}}
<span>{{>Logo}}</span>
{{/data-logos}}
{{#is-minerva-beta}}<sup>&beta;</sup>{{/is-minerva-beta}}
</a>
</div>
{{#data-search-box}}
{{>SearchBox}}
{{/data-search-box}}
<nav class="minerva-user-navigation" aria-label="{{msg-minerva-user-navigation}}">
<div>
{{!
A button when clicked will submit the form
This is used so that on tablet devices with JS disabled the search button
passes the value of input to the search
We avoid using input[type=submit] as these cannot be easily styled as mediawiki ui icons
which is problematic in Opera Mini (see T140490)
}}
<button id="searchIcon" class="mw-ui-icon mw-ui-icon-element mw-ui-icon-wikimedia-search-base20 skin-minerva-search-trigger mw-ui-button mw-ui-quiet">{{msg-searchbutton}}</button>
</div>
{{^is-anon}}
<div class="minerva-user-notifications" id="pt-notifications-alert">
{{{html-minerva-user-notifications}}}
</div>
{{/is-anon}}
{{#html-minerva-user-menu}}{{{html-minerva-user-menu}}}{{/html-minerva-user-menu}}
</nav>
</div>
</header>