Files
myeasycms-v2/apps/web/app/[locale]/club/[slug]/newsletter/subscribe/page.tsx

55 lines
1.8 KiB
TypeScript

import { Mail } from 'lucide-react';
import { Button } from '@kit/ui/button';
import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
import { Input } from '@kit/ui/input';
import { Label } from '@kit/ui/label';
interface Props {
params: Promise<{ slug: string }>;
}
export default async function NewsletterSubscribePage({ params }: Props) {
const { slug } = await params;
return (
<div className="bg-muted/30 flex min-h-screen items-center justify-center p-6">
<Card className="w-full max-w-md">
<CardHeader className="text-center">
<div className="bg-primary/10 mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full">
<Mail className="text-primary h-6 w-6" />
</div>
<CardTitle>Newsletter abonnieren</CardTitle>
<p className="text-muted-foreground text-sm">
Bleiben Sie über Neuigkeiten informiert.
</p>
</CardHeader>
<CardContent>
<form className="space-y-4">
<div className="space-y-2">
<Label>Name (optional)</Label>
<Input name="name" placeholder="Max Mustermann" />
</div>
<div className="space-y-2">
<Label>E-Mail-Adresse *</Label>
<Input
name="email"
type="email"
placeholder="ihre@email.de"
required
/>
</div>
<Button type="submit" className="w-full">
Abonnieren
</Button>
<p className="text-muted-foreground text-center text-xs">
Sie können sich jederzeit abmelden. Wir senden Ihnen eine
Bestätigungs-E-Mail.
</p>
</form>
</CardContent>
</Card>
</div>
);
}