From 9bd14811130bbb0339f2199de7719250152c68eb Mon Sep 17 00:00:00 2001
From: "Gustavo L de Mello (Guz)" <contact@guz.one>
Date: Tue, 17 Dec 2024 00:00:11 -0300
Subject: [PATCH] feat: add signature to footer

---
 handlers/pages/home.templ | 81 ++++++++++++++++++++++++---------------
 1 file changed, 51 insertions(+), 30 deletions(-)

diff --git a/handlers/pages/home.templ b/handlers/pages/home.templ
index 73b1bca..966acbd 100644
--- a/handlers/pages/home.templ
+++ b/handlers/pages/home.templ
@@ -7,6 +7,7 @@ import (
 	"forge.capytal.company/capytalcode/project-comicverse/lib/router/rerrors"
 
 	"keikos.work/templates/layouts"
+	"keikos.work/assets"
 )
 
 type Home struct{}
@@ -140,42 +141,54 @@ templ (p *Home) page() {
 			class={ "relative w-full h-screen bg-heropattern bg-black bg-top overflow-x-hidden",
 					"md:flex justify-center items-center" }
 		>
-			<div class={ "relative z-3 w-full h-full flex justify-between md:w-fit md:h-fit md:gap-7" }>
-				<h2
-					class={ "relative z-4 m-4 mb-8 text-5xl vertical-rl rotate-180 text-white",
+			<div class={ "relative z-3 md:flex flex-col items-end" }>
+				<div class="hidden md:block" aria-label="Signature">
+					<div class="w-15rem h-15rem" aria-hidden="true">
+						@p.sign()
+					</div>
+				</div>
+				<div class="relative w-full h-full flex justify-between md:w-fit md:h-fit md:gap-7">
+					<h2
+						class={ "relative z-4 m-4 mb-8 text-5xl vertical-rl rotate-180 text-white",
 							"md:horizontal-tb md:text-center md:rotate-0 md:m-0 md:flex md:items-center" }
-				>
-					<a
-						class="text-current no-underline"
-						href="mailto:contact@keikos.work"
-						rel="author"
 					>
-						contact@keikos.work
-					</a>
-				</h2>
-				<div class="flex flex-col justify-end m-4 mb-4 text-right md:m-0 md:justify-center">
-					<p class="mb-0">{ time.Now().Format("2006") } &copy; Helena "Keiko" Ayrim</p>
-					<p class="text-xs opacity-50 md:mt-1">
-						Made & managed with
-						<span class="i-pixelarticons:heart h-0.75rem">love</span> by 
 						<a
-							class="relative text-current underline-offset-3"
-							href="https://guz.one"
-							referrerpolicy="no-referrer-when-downgrade"
-							rel="external"
-							target="_blank"
+							class="relative z-1 text-current no-underline"
+							href="mailto:contact@keikos.work"
+							rel="author"
 						>
-							Gustavo "Guz" L Mello
-							<span
-								class={ "absolute inline-block i-pixelarticons:external-link",
+							contact@keikos.work
+						</a>
+					</h2>
+					<div class="flex flex-col justify-end m-4 mb-4 text-right md:m-0 md:justify-center">
+						<div class="w-full flex justify-end md:hidden" aria-label="Signature">
+							<div class="w-15rem h-15rem" aria-hidden="true">
+								@p.sign()
+							</div>
+						</div>
+						<p class="mb-0">{ time.Now().Format("2006") } &copy; Helena "Keiko" Ayrim</p>
+						<p class="text-xs opacity-50 md:mt-1">
+							Made & managed with
+							<span class="i-pixelarticons:heart h-0.75rem">love</span> by 
+							<a
+								class="relative text-current underline-offset-3"
+								href="https://guz.one"
+								referrerpolicy="no-referrer-when-downgrade"
+								rel="external"
+								target="_blank"
+							>
+								Gustavo "Guz" L Mello
+								<span
+									class={ "absolute inline-block i-pixelarticons:external-link",
 										"w-0.5rem h-0.5rem top-0 right-0 translate-x-100% opacity-50",
 										"md:translate-x-100% md:opacity-100" }
-								aria-label="(Opens in new tab)"
-							></span>
-						</a>
-						<span class="inline-block md:hidden pl-3">(Work In Progress)</span>
-						<span class="hidden md:inline-block pl-3">(WIP)</span>
-					</p>
+									aria-label="(Opens in new tab)"
+								></span>
+							</a>
+							<span class="inline-block md:hidden pl-3">(Work In Progress)</span>
+							<span class="hidden md:inline-block pl-3">(WIP)</span>
+						</p>
+					</div>
 				</div>
 			</div>
 			<span
@@ -185,3 +198,11 @@ templ (p *Home) page() {
 		</footer>
 	}
 }
+
+func (p *Home) sign() templ.Component {
+	f, err := assets.ASSETS.ReadFile("img/sign.svg")
+	if err != nil {
+		return templ.Raw("<img src=\"/assets/img/sign.svg\"/>")
+	}
+	return templ.Raw(string(f))
+}