84 lines
2.9 KiB
Plaintext
84 lines
2.9 KiB
Plaintext
---
|
|
import BaseLayout from "../layouts/BaseLayout.astro";
|
|
import Navbar from "../components/Navbar.astro";
|
|
---
|
|
|
|
<BaseLayout
|
|
title="Contact - Astro Starter Kit"
|
|
description="Contactez-nous via ce formulaire"
|
|
>
|
|
<Navbar />
|
|
|
|
<main class="max-w-4xl mx-auto px-6 py-16">
|
|
<div class="mb-12">
|
|
<h1 class="text-5xl font-bold tracking-tight mb-4">Contact</h1>
|
|
<p class="text-xl text-gray-600 leading-relaxed">
|
|
Envoyez-nous un message, nous serons ravis de vous répondre.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Formulaire -->
|
|
<form class="max-w-2xl space-y-6">
|
|
<div>
|
|
<label
|
|
for="name"
|
|
class="block text-sm font-medium text-gray-900 mb-2"
|
|
>
|
|
Nom
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="name"
|
|
name="name"
|
|
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-gray-900 focus:border-transparent outline-none transition-all"
|
|
placeholder="Votre nom"
|
|
/>
|
|
</div>
|
|
|
|
<div>
|
|
<label
|
|
for="email"
|
|
class="block text-sm font-medium text-gray-900 mb-2"
|
|
>
|
|
Email
|
|
</label>
|
|
<input
|
|
type="email"
|
|
id="email"
|
|
name="email"
|
|
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-gray-900 focus:border-transparent outline-none transition-all"
|
|
placeholder="votre@email.com"
|
|
/>
|
|
</div>
|
|
|
|
<div>
|
|
<label
|
|
for="message"
|
|
class="block text-sm font-medium text-gray-900 mb-2"
|
|
>
|
|
Message
|
|
</label>
|
|
<textarea
|
|
id="message"
|
|
name="message"
|
|
rows="6"
|
|
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-gray-900 focus:border-transparent outline-none transition-all resize-none"
|
|
placeholder="Votre message..."></textarea>
|
|
</div>
|
|
|
|
<button
|
|
type="button"
|
|
onclick="alert('Ceci est un formulaire de démonstration. Aucune donnée n\'est envoyée.')"
|
|
class="w-full px-6 py-3 bg-gray-900 text-white font-medium rounded-lg hover:bg-gray-800 transition-colors"
|
|
>
|
|
Envoyer le message
|
|
</button>
|
|
|
|
<p class="text-sm text-gray-500 text-center">
|
|
Note : Ce formulaire est une démonstration et n'envoie aucune
|
|
donnée.
|
|
</p>
|
|
</form>
|
|
</main>
|
|
</BaseLayout>
|