mirror of
https://github.com/docker/docs.git
synced 2026-03-27 14:28:47 +07:00
39 lines
1.6 KiB
HTML
39 lines
1.6 KiB
HTML
<header class="sticky top-0 z-20 h-16 px-4 text-white bg-gradient-to-r from-accent-light to-blue-light-500 dark:from-accent-dark dark:to-blue-dark-100">
|
|
<div class="mx-auto flex h-full max-w-[1400px] items-center justify-between">
|
|
<div class="flex h-full items-center gap-8 md:gap-2">
|
|
<button x-data tabindex="4" @click="() => {
|
|
$store.showSidebar = ! $store.showSidebar;
|
|
const sidebar = document.querySelector('#sidebar');
|
|
if ($store.showSidebar) {
|
|
sidebar.classList.replace('md:hidden', 'md:block');
|
|
} else {
|
|
sidebar.classList.replace('md:block', 'md:hidden');
|
|
}
|
|
}" class="icon-svg hidden px-4 md:block" aria-label="Menu">
|
|
{{ partial "icon" "menu" }}
|
|
</button>
|
|
<div>
|
|
{{/* main logo */}}
|
|
<a href="{{ site.BaseURL }}">
|
|
<div>
|
|
{{- (resources.Get "images/docs-logo-white-full.svg").Content | safe.HTML -}}
|
|
</div>
|
|
</a>
|
|
</div>
|
|
{{ partial "top-nav.html" . }}
|
|
</div>
|
|
<div class="flex items-center gap-6">
|
|
<div id="docsearch"></div>
|
|
<button id="theme-switch" tabindex="1" class="svg-icon"
|
|
x-data="{ theme: localStorage.getItem('theme-preference') }" x-init="$watch('theme', value => {
|
|
localStorage.setItem('theme-preference', value);
|
|
document.firstElementChild.className = value;
|
|
})" @click="theme = (theme === 'dark' ? 'light' : 'dark')">
|
|
<span class="icon-svg dark:hidden">{{ partial "icon" "light_mode"}}</span>
|
|
<span class="icon-svg hidden dark:block">{{ partial "icon" "dark_mode"}}</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
</header>
|