25 lines
1.1 KiB
TypeScript
25 lines
1.1 KiB
TypeScript
import Image from 'next/image';
|
|
|
|
export default function GalleryPage() {
|
|
const photos = [
|
|
{ src: '/images/Ka.1-2.3-4 Argo Bromo Anggrek.jpg', caption: 'THE KINGDOM OF NORTHERN LINE' },
|
|
{ src: '/images/Ka 5-6 Argo Semeru.jpg', caption: 'THE KINGDOM OF SOUTHERN LINE' },
|
|
{ src: '/images/Ka 7-8 Bima Argo Bima.jpg', caption: 'THE KINGDOM OF SOUTHERN Biru Malam LINE' },
|
|
];
|
|
|
|
return (
|
|
<section className="space-y-8">
|
|
<h1 className="text-3xl font-bold border-b border-zinc-800 pb-2">Galeri Foto</h1>
|
|
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
|
|
{photos.map((item, index) => (
|
|
<div key={index} className="bg-zinc-900 border border-zinc-800 rounded-lg overflow-hidden p-2">
|
|
<div className="h-56 relative rounded-md overflow-hidden">
|
|
<Image src={item.src} alt={item.caption} fill className="object-cover" />
|
|
</div>
|
|
<p className="text-center text-sm text-zinc-400 mt-3">{item.caption}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</section>
|
|
);
|
|
} |