70 lines
3.5 KiB
HTML
70 lines
3.5 KiB
HTML
<div class="flex flex-row gap justify-between w-full max-w-4xl lg:max-w-5xl h-12 mt-3">
|
|
<div class="darkmode-toggle inline-flex items-center">
|
|
<label class="flex items-center cursor-pointer relative">
|
|
<input checked type="checkbox" class="peer h-8 w-8 cursor-pointer transition-all appearance-none rounded shadow hover:shadow-md border border-slate-300 checked:bg-slate-800 checked:border-slate-800 checked:border-0 opacity-0" />
|
|
<span class="absolute text-dark opacity-100 peer-checked:opacity-0 top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 pointer-events-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="w-6 h-6">
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M21.752 15.002A9.718 9.718 0 0118 15.75c-5.385 0-9.75-4.365-9.75-9.75 0-1.33.266-2.597.748-3.752A9.753 9.753 0 003 11.25C3 16.635 7.365 21 12.75 21a9.753 9.753 0 009.002-5.998z"
|
|
/>
|
|
</svg>
|
|
</span>
|
|
<span class="absolute text-white opacity-0 peer-checked:opacity-100 top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 pointer-events-none">
|
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth="1.5" stroke="currentColor" class="w-8 h-8">
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
d="M12 3v2.25m6.364.386l-1.591 1.591M21 12h-2.25m-.386 6.364l-1.591-1.591M12 18.75V21m-4.773-4.227l-1.591 1.591M5.25 12H3m4.227-4.773L5.636 5.636M15.75 12a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0z"
|
|
/>
|
|
</svg>
|
|
</span>
|
|
</label>
|
|
</div>
|
|
|
|
{{ if (gt .Site.Home.AllTranslations.Len 1) }}
|
|
<div class="flex-none">
|
|
<div class="h-full static">
|
|
<button id="navbar-lang-toggle" type="button" class="inline-flex items-center p-2 text-sm text-slate-800 dark:text-slate-200 rounded-lg" aria-controls="navbar-menu" aria-expanded="false">
|
|
<span class="sr-only">{{ T "open_lang_switcher" }}</span>
|
|
<i class="w-8 h-8">
|
|
{{ partial "icon.html" "language" }}
|
|
</i>
|
|
</button>
|
|
<div class="absolute hidden top-16 z-50" id="navbar-lang">
|
|
<ul class="flex flex-col rounded-sm px-3 text-base font-medium text-slate-800 dark:text-slate-200 shadow-lg bg-white dark:bg-gray-600 shadow-slate-800/5 dark:shadow-slate-200/5 ring-1 ring-slate-900/5 dark:ring-slate-100/5">
|
|
{{- $page := . -}}
|
|
{{ range .AllTranslations }}
|
|
<li class="">
|
|
{{- if (ne $page.Language.LanguageCode .Language.LanguageCode) }}
|
|
<a class="block px-3 py-3 hover:text-emerald-600"
|
|
href="{{ .RelPermalink }}" title="{{ .Language.LanguageName }}">{{ .Language.LanguageName }}</a>
|
|
{{- else }}
|
|
<span class="block px-3 py-3 cursor-default hover:text-emerald-600">{{ .Language.LanguageName }}</span>
|
|
{{ end -}}
|
|
</li>
|
|
{{ end }}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{ else }}
|
|
<div class="flex-none mx-1"></div>
|
|
{{ end }}
|
|
|
|
<div class="flex-1"></div>
|
|
<div class="flex-none">
|
|
{{ partial "menu.html" . }}
|
|
</div>
|
|
<div class="flex-none md:hidden">
|
|
<a href={{ relLangURL "search/" }} class="inline-flex items-center p-2 text-sm text-slate-800 dark:text-slate-200 rounded-lg" aria-controls="navbar-menu" aria-expanded="false">
|
|
<span class="sr-only">{{ T "search.title" }}</span>
|
|
<i class="w-8 h-8">
|
|
{{ partial "icon.html" "search" }}
|
|
</i>
|
|
</a>
|
|
</div>
|
|
|
|
</div>
|