Add a contact form to the resume (#1)

Reviewed-on: #1
2025-02-03 18:10:09 +10:30
parent fd4f30e33f
commit e0c12292cd
17 changed files with 3869 additions and 9 deletions
--- a/contact/index.html
+++ b/contact/index.html
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Michael Pivato | Contact</title>
+    <link
+      rel="stylesheet"
+      href="../node_modules/@picocss/pico/css/pico.min.css"
+    />
+    <link
+      rel="apple-touch-icon"
+      sizes="180x180"
+      href="../apple-touch-icon.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="32x32"
+      href="../favicon-32x32.png"
+    />
+    <link
+      rel="icon"
+      type="image/png"
+      sizes="16x16"
+      href="../favicon-16x16.png"
+    />
+    <link rel="manifest" href="../site.webmanifest" />
+    <link rel="mask-icon" href="../safari-pinned-tab.svg" color="#5bbad5" />
+    <meta name="msapplication-TileColor" content="#da532c" />
+    <meta
+      name="theme-color"
+      media="(prefers-color-scheme: dark)"
+      content="#13171f"
+    />
+    <meta
+      name="theme-color"
+      media="(prefers-color-scheme: light)"
+      content="#2a3140"
+    />
+    <meta name="description" content="Michael Pivato's Resume: Contact Form" />
+  </head>
+  <body>
+    <main class="container">
+      <header>
+        <hgroup>
+          <h1>Michael Pivato</h1>
+          <p>Send Michael a message</p>
+          <a href="../">Back to resume</a>
+        </hgroup>
+      </header>
+      <form data-static-form-name="contact">
+        <fieldset>
+          <label>
+            Name
+            <input name="name" placeholder="Name" autocomplete="name" />
+          </label>
+          <label
+            >Organisation
+            <input
+              name="org"
+              placeholder="Organisation"
+              autocomplete="organization"
+            />
+          </label>
+          <label>
+            Email
+            <input
+              type="email"
+              name="email"
+              placeholder="Email"
+              autocomplete="email"
+            />
+          </label>
+          <label>
+            Mobile
+            <input
+              type="tel"
+              name="mobile"
+              placeholder="Mobile"
+              autocomplete="mobile"
+            />
+          </label>
+          <label>
+            Message
+            <textarea name="message" placeholder="Mesage..."></textarea>
+          </label>
+        </fieldset>
+        <input type="submit" value="Send Message" />
+      </form>
+      <footer class="container">
+        <small>Michael Pivato • 2025</small>
+      </footer>
+    </main>
+  </body>
+</html>