add(web): basic layout and ui

web/templates/pages/home.templ

@@ -0,0 +1,31 @@
+package pages
+
+import (
+	"maot-shortner/web/templates/components/button"
+	"maot-shortner/web/templates/components/icon"
+	"maot-shortner/web/templates/components/input"
+	"maot-shortner/web/templates/layouts"
+)
+
+templ Home() {
+	@layouts.MainLayout() {
+		<div class="h-full flex justify-center items-center flex-col">
+			@icon.Link(icon.Props{Class: "w-24 h-24"})
+			<h2 class="text-4xl font-bold py">shorten your urls...</h2>
+			<div class="flex gap-4 items-center justify-center mt-4 px-4 w-full max-w-2xl">
+				@input.Input(input.Props{
+					ID:          "URL",
+					Type:        input.TypeURL,
+					Placeholder: "https://very-long-url.com/",
+				})
+				@button.Button(button.Props{
+					ID:      "Shorten",
+					Variant: button.VariantGhost,
+					Type:    button.TypeSubmit,
+				}) {
+					@icon.Send(icon.Props{Size: 20})
+				}
+			</div>
+		</div>
+	}
+}