Initial commit

2026-05-13 19:42:49 -07:00
commit cfa01bd4ef
54 changed files with 11718 additions and 0 deletions
--- a/templates/layout.templ
+++ b/templates/layout.templ
@@ -0,0 +1,86 @@
+package templates
+
+import "veola/internal/models"
+
+// Page is the data carrier for any rendered page; concrete handlers populate
+// only the fields they use.
+type Page struct {
+	Title       string
+	Active      string
+	CSRFToken   string
+	CurrentUser *models.User
+	Flash       string
+	FlashError  string
+}
+
+templ head(title string) {
+	<head>
+		<meta charset="utf-8"/>
+		<meta name="viewport" content="width=device-width, initial-scale=1"/>
+		<title>{ title } · Veola</title>
+		<script src="https://cdn.tailwindcss.com"></script>
+		<link rel="preconnect" href="https://fonts.googleapis.com"/>
+		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/>
+		<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet"/>
+		<link rel="stylesheet" href="/static/css/app.css"/>
+		<script src="/static/vendor/htmx.min.js" defer></script>
+	</head>
+}
+
+templ Sidebar(active string) {
+	<nav class="v-side-nav flex flex-col">
+		<div class="px-4 py-5 flex items-center gap-2">
+			<span class="text-2xl">🐝</span>
+			<span class="text-xl font-semibold tracking-wide">Veola</span>
+		</div>
+		<a href="/" class={ navClass("dashboard", active) }>Dashboard</a>
+		<a href="/items" class={ navClass("items", active) }>Items</a>
+		<a href="/results" class={ navClass("results", active) }>Results</a>
+		<a href="/settings" class={ navClass("settings", active) }>Settings</a>
+		<div class="mt-auto px-4 py-4 v-muted text-xs">
+			Track. Watch. Notice.
+		</div>
+	</nav>
+}
+
+func navClass(key, active string) string {
+	if key == active {
+		return "active"
+	}
+	return ""
+}
+
+templ Layout(p Page, body templ.Component) {
+	<!DOCTYPE html>
+	<html lang="en">
+		@head(p.Title)
+		<body class="min-h-screen flex">
+			@Sidebar(p.Active)
+			<main class="flex-1 p-6 max-w-6xl">
+				if p.Flash != "" {
+					<div class="v-flash">{ p.Flash }</div>
+				}
+				if p.FlashError != "" {
+					<div class="v-flash-error">{ p.FlashError }</div>
+				}
+				@body
+			</main>
+		</body>
+	</html>
+}
+
+// Bare is a chrome-less layout used by /login and /setup.
+templ Bare(p Page, body templ.Component) {
+	<!DOCTYPE html>
+	<html lang="en">
+		@head(p.Title)
+		<body class="min-h-screen">
+			@body
+		</body>
+	</html>
+}
+
+// CSRFInput is the hidden form field for state-changing forms.
+templ CSRFInput(token string) {
+	<input type="hidden" name="csrf_token" value={ token }/>
+}