Added contact form with email sending

This commit is contained in:
Jose Selesan
2026-07-13 12:27:44 -03:00
parent f923dd2f56
commit 915c8928c8
4 changed files with 1584 additions and 2 deletions

1550
pnpm-lock.yaml generated Normal file

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

30
src/gracias.njk Normal file
View File

@@ -0,0 +1,30 @@
---
layout: false
title: Gracias | 2piDev
---
<!doctype html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ title }}</title>
<link rel="icon" href="/images/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="/css/styles.css">
</head>
<body class="min-h-screen bg-gradient-to-br from-orange-50 via-white to-blue-50">
<div class="flex min-h-screen items-center justify-center px-4">
<div class="max-w-md text-center">
<div class="mx-auto mb-6 flex h-20 w-20 items-center justify-center rounded-full bg-green-100">
<svg class="h-10 w-10 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg>
</div>
<h1 class="font-display text-4xl font-bold text-slate-900">¡Gracias!</h1>
<p class="mt-4 text-lg text-slate-600">Hemos recibido tu mensaje y te contactaremos pronto.</p>
<a href="/" class="mt-8 inline-flex items-center gap-2 rounded-lg bg-orange-600 px-6 py-3 text-sm font-bold text-white hover:bg-orange-700 transition-colors">
← Volver al inicio
</a>
</div>
</div>
</body>
</html>

View File

@@ -322,7 +322,9 @@ posthog.capture('$pageview');
<p class="flex items-center gap-3"><span class="h-2.5 w-2.5 rounded-full bg-white"></span>Sede Central, Hub de Innovación Digital</p>
</div>
</div>
<form class="rounded-xl border border-white/20 bg-white p-6 text-ink shadow-panel">
<form action="https://formsubmit.co/hola@2pidev.com" method="POST" class="rounded-xl border border-white/20 bg-white p-6 text-ink shadow-panel">
<input type="hidden" name="_next" value="https://2pidev.com/gracias">
<input type="hidden" name="_captcha" value="false">
<div class="grid gap-4 sm:grid-cols-2">
<label class="text-sm font-bold">Nombre
<input class="mt-2 w-full rounded-md border border-line px-4 py-3 font-normal outline-none focus:border-azure focus:ring-2 focus:ring-blue-100" type="text" name="nombre" placeholder="Juan Pérez">