Full-stack Next.js 15 application with: - Landing page with marketing components (Hero, Testimonials, Pricing, FAQ) - Multi-step candidature form with API route - Stripe Checkout integration (subscription + webhooks) - Supabase Auth (login/register) with middleware protection - Dashboard with progress tracking and module system - Formations pages with completion tracking - Profile management with password change - Database schema with RLS policies - Resend email integration for transactional emails Stack: Next.js 15, TypeScript, Tailwind CSS v4, Supabase, Stripe, Resend https://claude.ai/code/session_01H2aRGDaKgarPvhay2HxN6Y
80 lines
2.6 KiB
TypeScript
80 lines
2.6 KiB
TypeScript
import Link from "next/link";
|
|
import Button from "@/components/ui/Button";
|
|
|
|
export default function MerciPage() {
|
|
return (
|
|
<main className="min-h-screen flex items-center justify-center px-4">
|
|
<div className="text-center max-w-lg">
|
|
{/* Success icon */}
|
|
<div className="w-20 h-20 gradient-bg rounded-full flex items-center justify-center mx-auto mb-8">
|
|
<svg
|
|
className="w-10 h-10 text-white"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
viewBox="0 0 24 24"
|
|
>
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M5 13l4 4L19 7"
|
|
/>
|
|
</svg>
|
|
</div>
|
|
|
|
<h1 className="text-3xl md:text-4xl font-bold tracking-[-0.02em] mb-4">
|
|
Candidature <span className="gradient-text">envoyee !</span>
|
|
</h1>
|
|
|
|
<p className="text-white/60 text-lg mb-2">
|
|
Merci pour ta candidature. Notre equipe va etudier ton profil
|
|
attentivement.
|
|
</p>
|
|
|
|
<p className="text-white/40 mb-8">
|
|
Tu recevras une reponse par email sous 24 heures. Pense a verifier
|
|
tes spams !
|
|
</p>
|
|
|
|
{/* Étapes suivantes */}
|
|
<div className="bg-dark-light border border-dark-border rounded-[20px] p-6 mb-8 text-left">
|
|
<h2 className="text-white font-semibold mb-4">Prochaines etapes</h2>
|
|
<div className="space-y-4">
|
|
{[
|
|
{
|
|
step: "1",
|
|
title: "Analyse de ton profil",
|
|
desc: "Notre equipe evalue ta candidature",
|
|
},
|
|
{
|
|
step: "2",
|
|
title: "Email de confirmation",
|
|
desc: "Tu recois un email avec le lien de paiement",
|
|
},
|
|
{
|
|
step: "3",
|
|
title: "Acces au programme",
|
|
desc: "Tu commences ta formation immediatement",
|
|
},
|
|
].map((item) => (
|
|
<div key={item.step} className="flex items-start gap-3">
|
|
<div className="w-7 h-7 gradient-bg rounded-lg flex items-center justify-center shrink-0 text-xs font-bold text-white">
|
|
{item.step}
|
|
</div>
|
|
<div>
|
|
<p className="text-white text-sm font-medium">{item.title}</p>
|
|
<p className="text-white/40 text-xs">{item.desc}</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
<Link href="/">
|
|
<Button variant="secondary">Retour a l'accueil</Button>
|
|
</Link>
|
|
</div>
|
|
</main>
|
|
);
|
|
}
|