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:
parent
c3b698956b
commit
87184c431d
GPG Key ID:
DF629A90917D1319
@ -6,7 +6,7 @@ import { loadEnv } from "vite"
|
||||
import mdx from "@astrojs/mdx"
|
||||
import svelte from "@astrojs/svelte"
|
||||
|
||||
import icon from "astro-icon";
|
||||
import icon from "astro-icon"
|
||||
|
||||
const { url } = process.env.URL
|
||||
? loadEnv(process.env.URL, process.cwd(), "")
|
||||
@ -15,6 +15,7 @@ const { url } = process.env.URL
|
||||
// https://astro.build/config
|
||||
export default defineConfig({
|
||||
site: url,
|
||||
// output: "server", TODO server | also required for i18n
|
||||
i18n: {
|
||||
defaultLocale: "nb",
|
||||
locales: ["nb", "en"]
|
||||
|
||||
@ -13,5 +13,10 @@
|
||||
"createdAt": "Created at",
|
||||
"updatedAt": "Updated at",
|
||||
"forPersonalProjects": "For personal projects",
|
||||
"status": "Status"
|
||||
"status": "Status",
|
||||
"name": "Name",
|
||||
"subject": "Subject",
|
||||
"email": "Email",
|
||||
"message": "Message",
|
||||
"send": "Send"
|
||||
}
|
||||
|
||||
@ -13,5 +13,10 @@
|
||||
"createdAt": "Opprettet",
|
||||
"updatedAt": "Oppdatert",
|
||||
"forPersonalProjects": "For personlige prosjekter",
|
||||
"status": "Status"
|
||||
"status": "Status",
|
||||
"name": "Navn",
|
||||
"subject": "Emne",
|
||||
"email": "E-post",
|
||||
"message": "Melding",
|
||||
"send": "Send"
|
||||
}
|
||||
|
||||
@ -9,7 +9,8 @@
|
||||
"preview": "astro preview",
|
||||
"astro": "astro",
|
||||
"postinstall": "paraglide-js compile --project ./project.inlang --outdir ./src/paraglide",
|
||||
"format": "prettier --write \"./src/**/*.{js,mjs,ts,astro,svelte,css,md,json}\""
|
||||
"format": "prettier --write \"./src/**/*.{js,mjs,ts,astro,svelte,css,md,json}\"",
|
||||
"watch-translations": "paraglide-js compile --watch --project ./project.inlang --outdir ./src/paraglide"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/check": "^0.9.3",
|
||||
|
||||
@ -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>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user