my-dosa-place/src/components/GallerySection.js
2026-06-08 21:41:29 +05:30

43 lines
1.2 KiB
JavaScript

import Image from 'next/image';
import styles from './GallerySection.module.css';
const images = [
'/images/hero-dosa.png',
'/images/south-indian-thali.png',
'/images/sambar.png',
'/images/crispy-masala.png',
'/images/hero-dosa.png',
'/images/story-heritage.png'
];
export default function GallerySection() {
return (
<section className={styles.section}>
<div className={styles.container}>
<p className={styles.sectionTag}>📸 Follow Our Journey</p>
<h2 className={styles.sectionTitle}>Our Culinary Gallery</h2>
<div className={styles.galleryGrid}>
{images.map((src, index) => (
<div key={index} className={styles.galleryItem}>
<Image
src={src}
alt={`Gallery image ${index + 1}`}
fill
className={styles.image}
/>
<div className={styles.overlay}>
<span className={styles.icon}></span>
</div>
</div>
))}
</div>
<div className={styles.centerBtn}>
<a href="#" className={styles.btnInsta}>View on Instagram</a>
</div>
</div>
</section>
);
}