feat: add header navigation bar templates
This commit is contained in:
@@ -95,3 +95,35 @@
|
||||
</div>
|
||||
</nav>
|
||||
{{end}}
|
||||
|
||||
{{define "header_nav_link"}}
|
||||
{{$isActive := .isActive}}
|
||||
<a href="{{.href}}" class="group inline-flex h-full w-14 items-center justify-center bg-transparent transition-colors hover:bg-[#101113] focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-foreground-muted" title="{{.label}}" aria-label="{{.label}}" aria-current="{{if $isActive}}page{{end}}">
|
||||
{{if eq .key "watchlist"}}
|
||||
<svg class="size-6 shrink-0 text-foreground-muted/65 transition-all duration-200 group-hover:text-white group-hover:[stroke-width:2]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||||
<path d="m19 21-7-4-7 4V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v16z" />
|
||||
</svg>
|
||||
{{else if eq .key "search"}}
|
||||
<svg class="size-6 shrink-0 text-foreground-muted/65 transition-all duration-200 group-hover:text-white group-hover:[stroke-width:2]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
|
||||
<circle cx="11" cy="11" r="8" />
|
||||
<path d="m21 21-4.35-4.35" />
|
||||
</svg>
|
||||
{{end}}
|
||||
</a>
|
||||
{{end}}
|
||||
|
||||
{{define "header_navigation"}}
|
||||
{{$currentPath := .CurrentPath}}
|
||||
<header class="fixed inset-x-0 top-0 z-50 h-16 bg-background-sidebar">
|
||||
<nav class="flex h-full items-center justify-between pl-4 md:pl-8" aria-label="Primary navigation">
|
||||
<a href="/" class="inline-flex size-12 items-center justify-center focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-foreground-muted" title="Home" aria-label="Home" aria-current="{{if eq $currentPath "/"}}page{{end}}">
|
||||
<img src="/static/assets/logo.png" alt="" class="h-10 w-auto shrink-0" aria-hidden="true">
|
||||
</a>
|
||||
|
||||
<div class="flex h-full items-center">
|
||||
{{template "header_nav_link" dict "key" "watchlist" "href" "/watchlist" "label" "Watchlist" "isActive" (eq $currentPath "/watchlist")}}
|
||||
{{template "header_nav_link" dict "key" "search" "href" "/search" "label" "Search" "isActive" (eq $currentPath "/search")}}
|
||||
</div>
|
||||
</nav>
|
||||
</header>
|
||||
{{end}}
|
||||
|
||||
Reference in New Issue
Block a user