refactor: refactor authentication pages into their own modules

pkg/webapp/pages/home/internal/header.templ

@@ -0,0 +1,46 @@
+package internal
+
+import models "github.com/onsonr/sonr/pkg/webapp/models"
+
+templ Header(header *models.NavHeader) {
+	<!-- Site header -->
+	<header class="absolute top-2 md:top-6 w-full z-30">
+		<div class="px-4 sm:px-6">
+			<div class="max-w-3xl mx-auto">
+				<div class="flex items-center justify-between h-14 border border-transparent [background:linear-gradient(theme(colors.white),theme(colors.white))_padding-box,linear-gradient(120deg,theme(colors.zinc.300),theme(colors.zinc.100),theme(colors.zinc.300))_border-box] rounded-lg px-3">
+					<!-- Site branding -->
+					<div class="shrink-0 mr-4">
+						<!-- Logo -->
+						<a class="flex items-center justify-center bg-zinc-800 border-zinc-600 border-1 w-8 h-8 rounded shadow-sm shadow-zinc-950/20" href="/">
+							<img src={ header.Logo.Src } width={ header.Logo.Width } height={ header.Logo.Height } alt="Logo"/>
+						</a>
+					</div>
+					<!-- Desktop navigation -->
+					<nav class="flex grow">
+						<!-- Desktop sign in links -->
+						<ul class="flex grow justify-end flex-wrap items-center">
+							<ul class="flex grow justify-center items-center">
+								for _, item := range header.Items {
+									<li class="ml-1 px-2">
+										@navButton(item, false)
+									</li>
+								}
+							</ul>
+							<li>
+								@navButton(header.Primary, true)
+							</li>
+						</ul>
+					</nav>
+				</div>
+			</div>
+		</div>
+	</header>
+}
+
+templ navButton(item *models.NavItem, isPrimary bool) {
+	if isPrimary {
+		<div class="btn-sm text-zinc-100 cursor-pointer bg-zinc-900 hover:bg-zinc-800 w-full shadow" hx-swap="afterend" hx-get={ item.Href }>{ item.Text }</div>
+	} else {
+		<a class="text-sm cursor-pointer font-medium text-zinc-500 hover:text-zinc-900 px-3 lg:px-5 py-2 flex items-center transition" hx-swap="afterend" href={ templ.URL(item.Href) }>{ item.Text }</a>
+	}
+}