Initial commit

src/components/ContactMeForm.astro

@@ -0,0 +1,37 @@
+---
+// TODO form
+// TODO self-host email server
+import "../styles/global.css"
+import Input from "../components/Input.astro"
+import * as console from "node:console"
+
+if (Astro.request.method === "POST") {
+  try {
+    const data = await Astro.request.formData()
+    const name = data.get("name")
+    const subject = data.get("subject")
+    const email = data.get("email")
+    const message = data.get("message")
+    // TODO Do something with the data
+    console.info({ name, subject, email, message })
+  } catch (error) {
+    if (error instanceof Error) {
+      console.error(error.message)
+    }
+  }
+}
+---
+
+<div class="text-red-600 text-center">In development</div>
+
+<form class="flex flex-col gap-2 max-w-[500px] mx-auto" method="post">
+  <Input label="Name" type="text" name="name" required />
+  <Input label="Subject" name="subject" required />
+  <Input label="Email" name="email" />
+  <label class="flex flex-col"
+    >Message
+    <textarea name="message" class="textarea textarea-bordered" required
+    ></textarea>
+  </label>
+  <button type="submit">Send</button>
+</form>