100 lines
4.3 KiB
TypeScript
100 lines
4.3 KiB
TypeScript
import { getTranslations, setRequestLocale } from 'next-intl/server'
|
|
import { MapPin, Phone, Mail, Send } from 'lucide-react'
|
|
|
|
export default async function ContactPage({ params }: { params: Promise<{ locale: string }> }) {
|
|
const { locale } = await params
|
|
setRequestLocale(locale)
|
|
|
|
const t = await getTranslations('contact')
|
|
|
|
return (
|
|
<div className="container mx-auto px-4 py-24">
|
|
<div className="max-w-5xl mx-auto">
|
|
<h1 className="text-4xl md:text-5xl font-bold text-primary mb-12 text-center uppercase tracking-wider">
|
|
{t('title')}
|
|
</h1>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-12">
|
|
{/* Contact Info */}
|
|
<div className="space-y-8 bg-card p-8 rounded-lg border border-border/50">
|
|
<h2 className="text-2xl font-bold text-foreground uppercase">Teras Steakhouse</h2>
|
|
<div className="space-y-6">
|
|
<div className="flex items-start gap-4">
|
|
<MapPin className="w-6 h-6 text-primary shrink-0" />
|
|
<div>
|
|
<h3 className="font-semibold text-foreground">Adres</h3>
|
|
<p className="text-muted-foreground mt-1">{t('address')}</p>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-start gap-4">
|
|
<Phone className="w-6 h-6 text-primary shrink-0" />
|
|
<div>
|
|
<h3 className="font-semibold text-foreground">Telefon</h3>
|
|
<a href={`tel:${t('phone').replace(/\s/g, '')}`} className="text-muted-foreground hover:text-primary transition-colors mt-1 block">
|
|
{t('phone')}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-start gap-4">
|
|
<Mail className="w-6 h-6 text-primary shrink-0" />
|
|
<div>
|
|
<h3 className="font-semibold text-foreground">E-posta</h3>
|
|
<a href={`mailto:${t('email')}`} className="text-muted-foreground hover:text-primary transition-colors mt-1 block">
|
|
{t('email')}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Contact Form */}
|
|
<div className="bg-card p-8 rounded-lg border border-border/50">
|
|
<form className="space-y-6" action="#" method="POST">
|
|
<div className="space-y-2">
|
|
<label htmlFor="name" className="text-sm font-medium text-foreground">
|
|
{t('form_name')}
|
|
</label>
|
|
<input
|
|
id="name"
|
|
type="text"
|
|
required
|
|
className="w-full bg-background border border-border rounded-md px-4 py-3 focus:outline-none focus:ring-2 focus:ring-primary/50 text-foreground"
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<label htmlFor="email" className="text-sm font-medium text-foreground">
|
|
{t('form_email')}
|
|
</label>
|
|
<input
|
|
id="email"
|
|
type="email"
|
|
required
|
|
className="w-full bg-background border border-border rounded-md px-4 py-3 focus:outline-none focus:ring-2 focus:ring-primary/50 text-foreground"
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<label htmlFor="message" className="text-sm font-medium text-foreground">
|
|
{t('form_message')}
|
|
</label>
|
|
<textarea
|
|
id="message"
|
|
required
|
|
rows={5}
|
|
className="w-full bg-background border border-border rounded-md px-4 py-3 focus:outline-none focus:ring-2 focus:ring-primary/50 text-foreground resize-none"
|
|
/>
|
|
</div>
|
|
<button
|
|
type="submit"
|
|
className="w-full bg-primary text-white font-bold uppercase tracking-wider py-4 rounded-md hover:bg-primary/90 transition-colors flex items-center justify-center gap-2"
|
|
>
|
|
{t('form_submit')}
|
|
<Send className="w-4 h-4" />
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|