Fix form on contact-me page.
Fix wrong link to source code. Eager loading of image on landing page. Signed-off-by: Martin Berg Alstad <git@martials.no>
This commit is contained in:
@ -1,37 +1,17 @@
|
||||
---
|
||||
// TODO form
|
||||
import Input from "@/components/Input.astro"
|
||||
import * as m from "@/paraglide/messages.js"
|
||||
// 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>
|
||||
<form class="flex flex-col gap-2 max-w-[500px] mx-auto" method="post" action="https://formspree.io/f/mknykgbn">
|
||||
<Input label={m.name()} type="text" name="name" required />
|
||||
<Input label={m.subject()} name="subject" required />
|
||||
<Input label={m.email()} name="_replyto" />
|
||||
<input name="_gotcha" type="text" class={"hidden"} /> { /*Honeypot spam filter*/}
|
||||
<label class="flex flex-col">
|
||||
{m.message()}
|
||||
<textarea name="message" class="textarea textarea-bordered" required></textarea>
|
||||
</label>
|
||||
<button type="submit">Send</button>
|
||||
<button type="submit">{m.send()}</button>
|
||||
</form>
|
||||
|
||||
@ -3,13 +3,14 @@ import GiteaLink from "./links/GiteaLink.astro"
|
||||
import ExternalLink from "./links/ExternalLink.astro"
|
||||
import PajamasIcon from "./icons/PajamasIcon.astro"
|
||||
import * as m from "@/paraglide/messages"
|
||||
|
||||
const gitUrl = import.meta.env.GIT_URL
|
||||
const statusUrl = import.meta.env.STATUS_URL
|
||||
---
|
||||
|
||||
<div class="divider"></div>
|
||||
<div class="mx-auto py-5 flex flex-col gap-1 items-center">
|
||||
<GiteaLink href={gitUrl} />
|
||||
<GiteaLink href={`${gitUrl}/martials/martials.no`} />
|
||||
<ExternalLink href={statusUrl} class="flex items-center" title="Status">
|
||||
<PajamasIcon name="pajamas:status-health" class="w-6 h-6 mr-2" />
|
||||
{m.status()}
|
||||
|
||||
@ -16,7 +16,7 @@ import "@/styles/global.css"
|
||||
</h1>
|
||||
<p class="mx-1 sm:my-10">{m.aboutMe()}</p>
|
||||
</div>
|
||||
<Image src={me} alt="Me on a hike" width="400" height="400" class="p-5 mx-auto" />
|
||||
<Image src={me} alt="Me on a hike" width="400" height="400" class="p-5 mx-auto" loading={"eager"} />
|
||||
</div>
|
||||
<!-- Mastodon verification -->
|
||||
<a rel="me" href="https://snabelen.no/@Martials" class="hidden">Mastodon</a>
|
||||
@ -1,31 +1,31 @@
|
||||
---
|
||||
import Navbar from "../components/Navbar.astro"
|
||||
import Navbar from "@/components/Navbar.astro"
|
||||
import Footer from "@/components/Footer.astro"
|
||||
import { languageTag } from "@/paraglide/runtime"
|
||||
|
||||
interface Props {
|
||||
title: string
|
||||
class?: string
|
||||
}
|
||||
const { title, class: clazz } = Astro.props
|
||||
|
||||
import { languageTag } from "../paraglide/runtime"
|
||||
import Footer from "../components/Footer.astro"
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang={languageTag()} dir={"ltr"}>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="description" content="Astro description" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="sitemap" href="/sitemap-index.xml" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body class="flex flex-col h-screen">
|
||||
<Navbar />
|
||||
<main class:list={["grow", clazz]}>
|
||||
<slot />
|
||||
</main>
|
||||
<Footer />
|
||||
</body>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="description" content="Astro description" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="sitemap" href="/sitemap-index.xml" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body class="flex flex-col h-screen">
|
||||
<Navbar />
|
||||
<main class:list={["grow", clazz]}>
|
||||
<slot />
|
||||
</main>
|
||||
<Footer />
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,11 +1,9 @@
|
||||
---
|
||||
// TODO form
|
||||
// TODO self-host email server
|
||||
import "../styles/global.css"
|
||||
import ContactMeForm from "../components/ContactMeForm.astro"
|
||||
import Layout from "../layouts/Layout.astro"
|
||||
import ContactMeForm from "@/components/ContactMeForm.astro"
|
||||
import Layout from "@/layouts/Layout.astro"
|
||||
import "@/styles/global.css"
|
||||
---
|
||||
|
||||
<Layout title="Kontakt meg">
|
||||
<!--<ContactMeForm client:load />-->
|
||||
<ContactMeForm />
|
||||
</Layout>
|
||||
|
||||
@ -1,3 +1,9 @@
|
||||
---
|
||||
import ContactMeForm from "@/components/ContactMeForm.astro"
|
||||
import Layout from "@/layouts/Layout.astro"
|
||||
import "@/styles/global.css"
|
||||
---
|
||||
|
||||
---
|
||||
<Layout title="Kontakt meg">
|
||||
<ContactMeForm />
|
||||
</Layout>
|
||||
|
||||
Reference in New Issue
Block a user