69 lines
2.5 KiB
Plaintext
69 lines
2.5 KiB
Plaintext
{{! The header includes the site's logo, wordmark, search bar and user menu. }}
|
|
|
|
<header id="site-header">
|
|
|
|
<div id="site-header-marks">
|
|
{{#data-logos}}
|
|
<img id="site-header-icon" src="{{{icon}}}" />
|
|
<a href="https://phialfantasy.wiki">
|
|
<img id="site-header-wordmark" src="{{{wordmark.src}}}" />
|
|
</a>
|
|
{{/data-logos}}
|
|
</div>
|
|
|
|
<div id="site-header-container">
|
|
|
|
<div id="site-header-search">
|
|
{{#data-search-box}}
|
|
<form action="{{{form-action}}}">
|
|
<input id="site-header-search-bar" {{{html-input-attributes}}}>
|
|
<input value="" {{{html-button-go-attributes}}}>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" id="site-header-search-icon">
|
|
<title>
|
|
Search
|
|
</title>
|
|
<path fill="currentColor" d="M12.2 13.6a7 7 0 1 1 1.4-1.4l5.4 5.4-1.4 1.4zM3 8a5 5 0 1 0 10 0A5 5 0 0 0 3 8"/>
|
|
</svg>
|
|
</form>
|
|
{{/data-search-box}}
|
|
</div>
|
|
|
|
<div class="site-header-user layout-mouse">
|
|
<button class="user-clientpref-1">User</button> {{! This button's content is a fallback, replaced with the user's username via Javascript. }}
|
|
<div id="site-header-user-links">
|
|
<ul class="drop-link-list">
|
|
{{#data-portlets.data-user-menu}}
|
|
{{{html-items}}}
|
|
{{/data-portlets.data-user-menu}}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="site-header-user layout-touch">
|
|
<button>User</button> {{! This button's content is a fallback, replaced with the user's username via Javascript. }}
|
|
<div id="site-header-user-links">
|
|
<ul class="drop-link-list">
|
|
{{#data-portlets.data-user-menu}}
|
|
{{{html-items}}}
|
|
{{/data-portlets.data-user-menu}}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<noscript>
|
|
<style>
|
|
.color-scheme-toggle {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</noscript>
|
|
|
|
{{! These buttons are for a possible on-site color scheme toggle, currently hidden with CSS. }}
|
|
<button id="toggle-to-light" class="color-scheme-toggle">☀️</button>
|
|
<button id="toggle-to-dark" class="color-scheme-toggle">🌙</button>
|
|
|
|
</header>
|
|
|