first commit
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
import { setRequestLocale } from "next-intl/server";
|
||||
import Image from "next/image";
|
||||
import { mockData } from "@/lib/mock-data";
|
||||
|
||||
export default async function GaleriPage({ params }: { params: Promise<{ locale: string }> }) {
|
||||
const { locale } = await params;
|
||||
setRequestLocale(locale);
|
||||
|
||||
// Combine hero slides and accommodation images for a rich gallery
|
||||
const allImages = [
|
||||
...mockData.heroSlides.map((url, i) => ({ id: `slide-${i}`, url, title: "Kordon Apart" })),
|
||||
...mockData.accommodations.map(r => ({ id: r.id, url: r.image, title: r.name }))
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="pt-32 min-h-screen max-w-7xl mx-auto px-4 md:px-12 pb-24">
|
||||
<div className="mb-16 text-center max-w-2xl mx-auto">
|
||||
<h1 className="font-heading text-4xl md:text-5xl font-bold text-primary dark:text-primary-fixed-dim mb-4">Galeri</h1>
|
||||
<p className="font-body-md text-on-surface-variant dark:text-outline text-lg">
|
||||
Kordon Apart'ın eşsiz atmosferini, mimarisini ve Fethiye'nin güzelliklerini keşfedin.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
|
||||
{allImages.map((img) => (
|
||||
<div key={img.id} className="relative aspect-square w-full rounded-xl overflow-hidden group cursor-pointer shadow-md hover:shadow-xl transition-shadow duration-300">
|
||||
<Image
|
||||
src={img.url}
|
||||
alt={img.title}
|
||||
fill
|
||||
className="object-cover transition-transform duration-500 group-hover:scale-110"
|
||||
sizes="(max-width: 640px) 100vw, (max-width: 768px) 50vw, 33vw"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300" />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user