83 lines
3.1 KiB
TypeScript
83 lines
3.1 KiB
TypeScript
import { useTranslations } from 'next-intl';
|
||
import Navbar from '@/components/Navbar';
|
||
import Footer from '@/components/Footer';
|
||
import Image from 'next/image';
|
||
|
||
export default function AboutPage() {
|
||
const t = useTranslations('About');
|
||
|
||
return (
|
||
<main className="min-h-screen bg-bone">
|
||
<Navbar />
|
||
|
||
{/* Hero Section */}
|
||
<section className="pt-40 pb-20 px-6 max-w-7xl mx-auto">
|
||
<div className="text-center mb-16">
|
||
<span className="text-salmakis-blue font-bold tracking-[0.3em] uppercase text-xs mb-4 block">
|
||
Salmakis Villas
|
||
</span>
|
||
<h1 className="text-5xl md:text-7xl font-serif text-aegean-dark mb-8">
|
||
{t('title')}
|
||
</h1>
|
||
<div className="w-24 h-[1px] bg-aegean-dark/20 mx-auto" />
|
||
</div>
|
||
|
||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
|
||
<div className="space-y-8 text-aegean-dark/80 text-lg leading-relaxed font-sans">
|
||
<p className="font-bold text-aegean-dark">
|
||
{t('paragraph1')}
|
||
</p>
|
||
<p>
|
||
{t('paragraph2')}
|
||
</p>
|
||
<p>
|
||
{t('paragraph3')}
|
||
</p>
|
||
<p className="bg-sand/10 p-6 rounded-2xl border border-sand/30 italic text-aegean-dark">
|
||
{t('paragraph4')}
|
||
</p>
|
||
</div>
|
||
|
||
<div className="relative aspect-square rounded-3xl overflow-hidden shadow-2xl">
|
||
<Image
|
||
src="https://images.unsplash.com/photo-1542718610-a1d656d1884c?q=80&w=2070&auto=format&fit=crop"
|
||
alt="Dereköy Villas"
|
||
fill
|
||
className="object-cover"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
{/* Location Details Section */}
|
||
<section className="py-20 bg-aegean-dark text-bone">
|
||
<div className="max-w-7xl mx-auto px-6 grid grid-cols-1 md:grid-cols-3 gap-12 text-center">
|
||
<div className="space-y-4">
|
||
<div className="text-4xl font-serif text-sand">01</div>
|
||
<h3 className="text-xl font-serif">{t('location_title')}</h3>
|
||
<p className="text-sm opacity-60 leading-relaxed font-sans">
|
||
Ortakent, Turgutreis ve Gümüşlük üçgeninin tam merkezinde huzurlu bir konum.
|
||
</p>
|
||
</div>
|
||
<div className="space-y-4">
|
||
<div className="text-4xl font-serif text-sand">02</div>
|
||
<h3 className="text-xl font-serif">{t('tradition_title')}</h3>
|
||
<p className="text-sm opacity-60 leading-relaxed font-sans">
|
||
Geleneksel Bodrum mimarisi ile modern konforun buluştuğu taş yapılar.
|
||
</p>
|
||
</div>
|
||
<div className="space-y-4">
|
||
<div className="text-4xl font-serif text-sand">03</div>
|
||
<h3 className="text-xl font-serif">{t('service_title')}</h3>
|
||
<p className="text-sm opacity-60 leading-relaxed font-sans">
|
||
Aynı arazide ikamet eden villa görevlisi ile 24 saat kesintisiz hizmet.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<Footer />
|
||
</main>
|
||
);
|
||
}
|