import Layout from "@/components/layout/Layout";
import GalleryLightbox from "./GalleryLightbox";

export const metadata = {
    title: "Gallery – Sixty5 Street Eats & Vibes",
    description: "Browse the Sixty5 Street gallery to see our bold bites, sizzling dishes and vibrant atmosphere. Get inspired by the food, flavor and fun.",
}

export default function GalleryPage() {
    const images = [
        "/assets/images/home/categories/combos.webp",
        "/assets/images/home/categories/milkshakes.webp",
        "/assets/images/home/categories/poutine.webp",
        "/assets/images/home/categories/salads.webp",
        "/assets/images/home/categories/shawarma.webp",
        "/assets/images/home/categories/dosa.webp"
    ];

    return (
        <Layout 
            headerStyle={2} 
            footerStyle={2} 
            breadcrumbTitle="Gallery" 
            bgImage="/assets/images/about/about-banner.webp"
        >
            {/* Gallery Section Two */}
            <section className="gallery-section-two sec-pad" id="gallery">
                <div className="outer-container">
                    <GalleryLightbox images={images} />
                </div>
            </section>
            {/* End Gallery Section Two */}
        </Layout>
    );
}