45 lines
1.3 KiB
HTML
45 lines
1.3 KiB
HTML
|
<header class="fixed top-0 left-0 right-0 z-sticky bg-surface-0/80 backdrop-blur-md border-b border-border">
|
||
|
|
<nav class="container-wide flex items-center justify-between h-16">
|
||
|
|
{{/* Logo */}}
|
||
|
|
<a
|
||
|
|
href="{{ "/" | relURL }}"
|
||
|
|
class="flex items-center gap-3 group"
|
||
|
|
aria-label="{{ .Site.Title }} - Home"
|
||
|
|
>
|
||
|
|
<canvas
|
||
|
|
id="logo-canvas"
|
||
|
|
hx-preserve="true"
|
||
|
|
class="w-8 h-8"
|
||
|
|
width="32"
|
||
|
|
height="32"
|
||
|
|
aria-hidden="true"
|
||
|
|
></canvas>
|
||
|
|
<span class="text-lg font-medium tracking-tight group-hover:text-accent transition-colors">
|
||
|
|
VALKNAR'S
|
||
|
|
</span>
|
||
|
|
</a>
|
||
|
|
|
||
|
|
{{/* Navigation */}}
|
||
|
|
<ul
|
||
|
|
class="flex items-center gap-4 md:gap-8"
|
||
|
|
x-data="{ path: window.location.pathname }"
|
||
|
|
@htmx:after-settle.window="path = window.location.pathname"
|
||
|
|
>
|
||
|
|
{{- range .Site.Menus.main }}
|
||
|
|
<li>
|
||
|
|
<a
|
||
|
|
href="{{ .URL }}"
|
||
|
|
class="text-sm transition-colors"
|
||
|
|
:class="path.startsWith('{{ .URL }}') ? 'text-text-primary border-b border-text-primary' : 'text-text-secondary hover:text-text-primary link-hover'"
|
||
|
|
>
|
||
|
|
{{ .Name }}
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
{{- end }}
|
||
|
|
</ul>
|
||
|
|
</nav>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
{{/* Spacer for fixed header */}}
|
||
|
|
<div class="h-16" aria-hidden="true"></div>
|