add form

superpage/src/pages/_components/Contact.Astro

@@ -0,0 +1,35 @@
+---
+import Label from './_label.astro'
+import Input from './_input.astro'
+import Textarea from './_textarea.astro'
+
+// https://n8n.eduseg.com.br/webhook/a377b3e0-b159-4536-98ab-e13822b60562
+
+if (Astro.request.method === 'POST') {
+    try {
+        const data = await Astro.request.formData()
+        console.log(data)
+    } catch (error) {
+        if (error instanceof Error) {
+            console.error(error.message)
+        }
+    }
+}
+---
+
+<form method="POST" class="lg:w-6/12 mx-auto flex flex-col gap-2.5">
+    <Label>
+        <span class="lg:w-14">Nome</span>
+        <Input name="name" />
+    </Label>
+    <Label>
+        <span class="lg:w-14">Email</span>
+        <Input name="email" />
+    </Label>
+    <Label class="flex-col !items-start !gap-1">
+        <span>Mensagem</span>
+        <Textarea name="message" class="h-26" />
+    </Label>
+
+    <button type="submit">Enviar</button>
+</form>

superpage/src/pages/_components/_input.astro

@@ -0,0 +1,7 @@
+<input
+    class:list={[
+        'bg-white/10 focus:bg-white focus:text-black rounded-xl p-4 w-full focus:outline-none transition duration-150',
+        Astro.props.class,
+    ]}
+    {...Astro.props}
+/>

superpage/src/pages/_components/_label.astro

@@ -0,0 +1,3 @@
+<label class:list={['flex max-lg:flex-col lg:items-center gap-1 lg:gap-2.5', Astro.props.class]}>
+    <slot />
+</label>

superpage/src/pages/_components/_textarea.astro

@@ -0,0 +1,8 @@
+<textarea
+    class:list={[
+        'bg-white/10 focus:bg-white focus:text-black rounded-xl p-4 w-full focus:outline-none transition duration-150',
+        Astro.props.class,
+    ]}
+    {...Astro.props}
+>
+</textarea>