init

2026-03-08 02:22:40 +09:00
commit 83fdf3134c
25 changed files with 918 additions and 0 deletions
--- a/components/icons/icons.templ
+++ b/components/icons/icons.templ
@@ -0,0 +1,14 @@
+package icons
+
+templ ArrowUpRight(className string) {
+	<svg
+		xmlns="http://www.w3.org/2000/svg"
+		fill="none"
+		viewBox="0 0 24 24"
+		stroke-width="1.5"
+		stroke="currentColor"
+		class={ className }
+	>
+		<path stroke-linecap="round" stroke-linejoin="round" d="m4.5 19.5 15-15m0 0H8.25m11.25 0v11.25"></path>
+	</svg>
+}
--- a/components/layout.templ
+++ b/components/layout.templ
@@ -0,0 +1,75 @@
+package components
+
+import (
+	"fmt"
+	"personal-site/constants"
+	"time"
+)
+
+templ navbar(params *constants.LayoutParams) {
+	<header class="sticky top-0 z-50 w-full border-b border-zinc-800 bg-bg-100/80 backdrop-blur-sm">
+		<div class="max-w-3xl mx-auto h-12 flex items-center justify-between">
+			<a
+				href="/"
+				class="font-mono text-xs text-fg-200 tracking-widest uppercase hover:text-fg-100 transition-colors duration-150"
+			>
+				{ params.NavTitle }
+			</a>
+			<nav class="flex items-center gap-5">
+				<a
+					href="/projects"
+					class="text-xs text-fg-300 hover:text-fg-100 transition-colors duration-150"
+				>projects</a>
+				<a
+					href="https://github.com"
+					class="text-xs text-fg-300 hover:text-fg-100 transition-colors duration-150 flex items-center gap-1.5"
+				>
+					<svg width="12" height="12" viewBox="0 0 32 32" fill="currentColor">
+						<path
+							d="M16 0C7.163 0 0 7.163 0 16c0 8.836 7.163 16 16 16 8.836 0 16-7.163 16-16C32 7.163 24.837 0 16 0zm7.68 21.155a1.06 1.06 0 01-1.458.387l-4.514-2.607a1.842 1.842 0 01-.638.223v4.017a1.06 1.06 0 01-2.12 0v-4.017a1.842 1.842 0 01-1.3-1.787 1.843 1.843 0 011.842-1.842c.347 0 .671.097.948.264l4.418-2.551a1.06 1.06 0 011.457.387 1.06 1.06 0 01-.387 1.457l-4.418 2.551c.01.09.016.181.016.274 0 .093-.006.184-.016.274l4.514 2.607a1.06 1.06 0 01.387 1.457l-.731-.695zm-13.512-8.24a1.06 1.06 0 011.457-.387l4.418 2.551c.277-.167.601-.264.948-.264.347 0 .671.097.948.264l4.418-2.551a1.06 1.06 0 011.457.387 1.06 1.06 0 01-.387 1.457l-4.418 2.551c.01.09.016.181.016.274a1.843 1.843 0 01-1.842 1.842 1.843 1.843 0 01-1.842-1.842c0-.093.006-.184.016-.274l-4.418-2.551a1.06 1.06 0 01-.387-1.457h.616z"
+						></path>
+					</svg>
+					gitea
+				</a>
+				<a
+					href="https://github.com"
+					class="text-xs text-fg-300 hover:text-fg-100 transition-colors duration-150 flex items-center gap-1.5"
+				>
+					<svg width="12" height="12" viewBox="0 0 24 24" fill="currentColor">
+						<path
+							d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+						></path>
+					</svg>
+					github
+				</a>
+			</nav>
+		</div>
+	</header>
+}
+
+templ MainLayout(params *constants.LayoutParams) {
+	<!DOCTYPE html>
+	<html lang="en">
+		<head>
+			<meta charset="UTF-8"/>
+			<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+			<link rel="stylesheet" href={ fmt.Sprintf("/static/css/app.css?v=%d", time.Now().Unix()) }/>
+			<title>{ params.Title }</title>
+		</head>
+		<body class="relative bg-linear-to-b from-bg-400 to-bg-100 text-fg-100 overflow-hidden font-sans">
+			<div class="h-screen grid grid-rows-[auto_1fr_auto] overflow-y-auto overflow-x-hidden">
+				@navbar(params)
+				// base container
+				<div class="p-4 mt-6 flex flex-col gap-6 max-w-3xl mx-auto">
+					{ children... }
+				</div>
+				<footer class="w-full text-center py-4">
+					<p class="text-xs text-secondary text-fg-200">
+						&copy; { fmt.Sprintf("%d", time.Now().Year()) } derrickgee.dev - Built
+						with Golang
+					</p>
+				</footer>
+			</div>
+		</body>
+	</html>
+}