commit

2026-03-26 19:12:59 -04:00
commit d741a30495
24 changed files with 5975 additions and 0 deletions
--- a/cmd/web/base.templ
+++ b/cmd/web/base.templ
@@ -0,0 +1,57 @@
+package web
+
+templ Base() {
+	<!DOCTYPE html>
+	<html lang="en" class="h-screen bg-crema-50">
+		<head>
+			<meta charset="utf-8"/>
+			<meta name="viewport" content="width=device-width,initial-scale=1"/>
+			<title>Latin Garden</title>
+			<link href="assets/css/output.css" rel="stylesheet"/>
+			<script src="assets/js/htmx.min.js"></script>
+		</head>
+
+		<body class="min-h-screen font-latin text-ink-800">
+
+			<!-- STICKY NAVBAR -->
+			<nav class="sticky top-0 z-50 bg-crema-100 border-b border-crema-200 shadow-md transition-shadow duration-300">
+				<div class="max-w-6xl mx-auto px-6 py-4 flex items-center justify-between">
+					
+					<a href="/" class="text-xl font-semibold tracking-wide text-terracotta-500 hover:text-terracotta-600 transition-colors duration-200">
+						Latin Garden
+					</a>
+
+					<div class="hidden md:flex space-x-8 text-ink-700">
+						<a href="/" class="hover:text-terracotta-500 transition-colors duration-200 relative group">
+							Home
+							<span class="absolute bottom-0 left-0 w-0 h-0.5 bg-terracotta-500 group-hover:w-full transition-all duration-300"></span>
+						</a>
+						<a href="#plants" class="hover:text-terracotta-500 transition-colors duration-200 relative group">
+							Plants
+							<span class="absolute bottom-0 left-0 w-0 h-0.5 bg-terracotta-500 group-hover:w-full transition-all duration-300"></span>
+						</a>
+						<a href="#about" class="hover:text-terracotta-500 transition-colors duration-200 relative group">
+							About
+							<span class="absolute bottom-0 left-0 w-0 h-0.5 bg-terracotta-500 group-hover:w-full transition-all duration-300"></span>
+						</a>
+					</div>
+
+					<!-- Mobile toggle -->
+					<div class="md:hidden">
+						<button 
+							hx-get="/"
+							class="text-terracotta-500 text-2xl hover:text-terracotta-600 transition-colors duration-200">
+							☰
+						</button>
+					</div>
+				</div>
+			</nav>
+
+			<!-- CONTENT -->
+			<main class="max-w-6xl mx-auto px-6 py-10">
+				{ children... }
+			</main>
+
+		</body>
+	</html>
+}