From b317c0dcd9022636bf8c4eb14c9d5915e00d05be Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Sat, 14 Mar 2026 20:06:13 +0000
Subject: [PATCH] Update src/app/page.tsx

---
 src/app/page.tsx | 74 +++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 73 insertions(+), 1 deletion(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 745a60f..85ff8b0 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -13,6 +13,54 @@ import FooterSimple from "@/components/sections/footer/FooterSimple";
 import { Award, Sparkles, Zap } from "lucide-react";
 
 export default function LandingPage() {
+  const galleryImages = [
+    {
+      id: "1",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-1.jpg",      alt: "Elegante barbershop interior - luxury seating"
+    },
+    {
+      id: "2",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-2.jpg",      alt: "Master barber at work - precision cutting"
+    },
+    {
+      id: "3",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-3.jpg",      alt: "Traditional hot shave service"
+    },
+    {
+      id: "4",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-4.jpg",      alt: "Premium grooming products display"
+    },
+    {
+      id: "5",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-5.jpg",      alt: "Elegant waiting area with leather seating"
+    },
+    {
+      id: "6",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-6.jpg",      alt: "Barber mirrors and station setup"
+    },
+    {
+      id: "7",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-7.jpg",      alt: "Client receiving beard grooming"
+    },
+    {
+      id: "8",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-8.jpg",      alt: "Professional barber tools collection"
+    },
+    {
+      id: "9",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-9.jpg",      alt: "Luxurious haircut service"
+    },
+    {
+      id: "10",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-10.jpg",      alt: "Barbershop exterior storefront"
+    },
+    {
+      id: "11",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-11.jpg",      alt: "Master barber consultation with client"
+    },
+    {
+      id: "12",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-12.jpg",      alt: "Premium aftershave product application"
+    },
+    {
+      id: "13",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-13.jpg",      alt: "Classical barbershop ambiance"
+    },
+    {
+      id: "14",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-14.jpg",      alt: "Client satisfaction moment"
+    },
+    {
+      id: "15",      src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery-15.jpg",      alt: "Elegante signature style showcase"
+    }
+  ];
+
   return (
     <ThemeProvider
       defaultButtonVariant="text-shift"
@@ -31,6 +79,7 @@ export default function LandingPage() {
           navItems={[
             { name: "Home", id: "hero" },
             { name: "Services", id: "services" },
+            { name: "Gallery", id: "gallery" },
             { name: "Team", id: "team" },
             { name: "About", id: "about" },
             { name: "Contact", id: "contact" }
@@ -110,6 +159,28 @@ export default function LandingPage() {
         />
       </div>
 
+      <div id="gallery" data-section="gallery">
+        <div className="w-full py-20 px-4 bg-gradient-to-b from-transparent to-transparent">
+          <div className="max-w-7xl mx-auto">
+            <div className="text-center mb-16">
+              <h2 className="text-4xl md:text-5xl font-bold mb-4">Our Gallery</h2>
+              <p className="text-lg text-foreground/70">Explore the elegance and craftsmanship of Elegante Barbershop</p>
+            </div>
+            <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
+              {galleryImages.map((image) => (
+                <div key={image.id} className="relative overflow-hidden rounded-lg shadow-lg hover:shadow-xl transition-shadow duration-300">
+                  <img
+                    src={image.src}
+                    alt={image.alt}
+                    className="w-full h-64 object-cover hover:scale-105 transition-transform duration-300"
+                  />
+                </div>
+              ))}
+            </div>
+          </div>
+        </div>
+      </div>
+
       <div id="team" data-section="team">
         <TeamCardTen
           title="Meet Our Master Barbers"
@@ -213,6 +284,7 @@ export default function LandingPage() {
               title: "Navigate",              items: [
                 { label: "Home", href: "#hero" },
                 { label: "Services", href: "#services" },
+                { label: "Gallery", href: "#gallery" },
                 { label: "Team", href: "#team" },
                 { label: "About", href: "#about" }
               ]
@@ -240,4 +312,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
\ No newline at end of file
+}
-- 
2.49.1