87 lines
4.6 KiB
HTML
87 lines
4.6 KiB
HTML
{{define "head"}}
|
|
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>{{if .Title}}{{.Title}} | {{end}}Archi Folio</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css">
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script src="https://unpkg.com/htmx.org@2.0.4"></script>
|
|
<link rel="stylesheet" href="/static/styles.css">
|
|
<script defer src="/static/app.js"></script>
|
|
</head>
|
|
<body class="bg-neutral-50 text-neutral-950 antialiased">
|
|
{{end}}
|
|
|
|
{{define "site_start"}}
|
|
{{template "head" .}}
|
|
<div class="drawer drawer-end">
|
|
<input id="site-drawer" type="checkbox" class="drawer-toggle">
|
|
<div class="drawer-content min-h-screen bg-neutral-50 text-neutral-950">
|
|
{{template "site_header" .}}
|
|
{{end}}
|
|
|
|
{{define "site_header"}}
|
|
<header data-site-header class="fixed inset-x-0 top-0 z-40 transition-all duration-300 {{if eq .Active "home"}}py-7 text-white{{else}}bg-neutral-50/95 py-4 shadow-sm backdrop-blur text-neutral-950{{end}}">
|
|
<div class="mx-auto flex max-w-7xl items-center justify-between px-5 md:px-8">
|
|
<a href="/" class="text-xl font-semibold tracking-normal md:text-3xl" data-header-brand hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Archi Folio</a>
|
|
<nav class="hidden items-center gap-4 text-sm uppercase tracking-[0.18em] md:flex md:gap-8" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
|
|
<a class="hover:opacity-60 {{if eq .Active "projects"}}font-semibold{{end}}" href="/projects">Projects</a>
|
|
<a class="hover:opacity-60 {{if eq .Active "about"}}font-semibold{{end}}" href="/about">Studio</a>
|
|
<a class="hover:opacity-60 {{if eq .Active "services"}}font-semibold{{end}}" href="/services">Services</a>
|
|
<a class="hover:opacity-60 {{if eq .Active "contact"}}font-semibold{{end}}" href="/contact">Contact</a>
|
|
</nav>
|
|
<label for="site-drawer" class="grid h-11 w-11 cursor-pointer place-items-center border border-current/30 md:hidden" aria-label="Open menu">
|
|
<span class="grid gap-1.5">
|
|
<span class="block h-px w-5 bg-current"></span>
|
|
<span class="block h-px w-5 bg-current"></span>
|
|
<span class="block h-px w-5 bg-current"></span>
|
|
</span>
|
|
</label>
|
|
</div>
|
|
</header>
|
|
{{end}}
|
|
|
|
{{define "footer"}}
|
|
<footer class="border-t border-neutral-200 px-5 py-10 text-sm text-neutral-500 md:px-8">
|
|
<div class="mx-auto flex max-w-7xl flex-col gap-4 md:flex-row md:items-center md:justify-between">
|
|
<p>© 2026 Archi Folio</p>
|
|
<p>{{.Content.Email}} · {{.Content.Location}}</p>
|
|
</div>
|
|
</footer>
|
|
{{end}}
|
|
|
|
{{define "site_end"}}
|
|
{{template "footer" .}}
|
|
<div id="overlay-root"></div>
|
|
</div>
|
|
<div class="drawer-side z-50 md:hidden">
|
|
<label for="site-drawer" aria-label="Close menu" class="drawer-overlay bg-neutral-950/45"></label>
|
|
<aside class="flex min-h-full w-[min(22rem,86vw)] flex-col bg-neutral-950/45 text-white shadow-2xl backdrop-blur-xl">
|
|
<div class="flex items-center justify-between border-b border-white/15 px-5 py-4">
|
|
<a href="/" class="text-xl font-semibold text-white" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">Archi Folio</a>
|
|
<label for="site-drawer" class="grid h-10 w-10 cursor-pointer place-items-center border border-white/25 text-white" aria-label="Close menu">
|
|
<span class="relative block h-5 w-5">
|
|
<span class="absolute left-0 top-1/2 block h-px w-5 rotate-45 bg-current"></span>
|
|
<span class="absolute left-0 top-1/2 block h-px w-5 -rotate-45 bg-current"></span>
|
|
</span>
|
|
</label>
|
|
</div>
|
|
<nav class="grid px-5 py-6 text-2xl font-medium text-white" hx-boost="true" hx-target="body" hx-swap="outerHTML transition:true">
|
|
<a class="border-b border-white/15 py-4 text-white {{if eq .Active "projects"}}underline underline-offset-8{{end}}" href="/projects">Projects</a>
|
|
<a class="border-b border-white/15 py-4 text-white {{if eq .Active "about"}}underline underline-offset-8{{end}}" href="/about">Studio</a>
|
|
<a class="border-b border-white/15 py-4 text-white {{if eq .Active "services"}}underline underline-offset-8{{end}}" href="/services">Services</a>
|
|
<a class="border-b border-white/15 py-4 text-white {{if eq .Active "contact"}}underline underline-offset-8{{end}}" href="/contact">Contact</a>
|
|
</nav>
|
|
<div class="mt-auto px-5 pb-6 text-sm leading-relaxed text-white">
|
|
<p>{{.Content.Email}}</p>
|
|
<p>{{.Content.Location}}</p>
|
|
</div>
|
|
</aside>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
{{end}}
|