From d2902bcd489ee3f3672cfed0412a9aa3f51528e5 Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Mon, 2 Mar 2026 18:25:12 +0000
Subject: [PATCH] Update src/app/gallery/page.tsx

---
 src/app/gallery/page.tsx | 198 +++++++++++++--------------------------
 1 file changed, 64 insertions(+), 134 deletions(-)

diff --git a/src/app/gallery/page.tsx b/src/app/gallery/page.tsx
index 953e1de..a8134fc 100644
--- a/src/app/gallery/page.tsx
+++ b/src/app/gallery/page.tsx
@@ -3,17 +3,10 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
 import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
+import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
+import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
 import FooterMedia from "@/components/sections/footer/FooterMedia";
-import Link from "next/link";
-import { Sparkles } from "lucide-react";
-
-const navItems = [
-  { name: "Home", id: "/" },
-  { name: "Services", id: "/services" },
-  { name: "Pricing", id: "/pricing" },
-  { name: "Gallery", id: "/gallery" },
-  { name: "Contact", id: "/contact" },
-];
+import { Sparkles, Check, Shield, Star } from "lucide-react";
 
 export default function GalleryPage() {
   return (
@@ -23,161 +16,104 @@ export default function GalleryPage() {
       borderRadius="rounded"
       contentWidth="small"
       sizing="mediumLargeSizeMediumTitles"
-      background="fluid"
+      background="circleGradient"
       cardStyle="gradient-bordered"
       primaryButtonStyle="gradient"
       secondaryButtonStyle="glass"
       headingFontWeight="medium"
     >
+      {/* Navbar */}
       <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
-          navItems={navItems}
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "Services", id: "/services" },
+            { name: "Pricing", id: "/pricing" },
+            { name: "Gallery", id: "/gallery" },
+            { name: "Contact", id: "#contact" },
+          ]}
           brandName="Elite Auto Detailing"
           bottomLeftText="Professional Auto Detailing"
           bottomRightText="(###) ###-#### or text us"
         />
       </div>
 
-      <div id="gallery-before-after" data-section="gallery-before-after">
+      {/* Before & After Gallery */}
+      <div id="before-after" data-section="before-after">
         <FeatureCardTwentyFive
-          title="Before & After Gallery"
-          description="See the transformation our professional detailing services deliver. Browse real results from satisfied customers across all service types."
-          tag="Our Work"
+          title="Before & After Transformations"
+          description="See the incredible results we achieve for our customers. Every detail matters."
+          tag="Gallery"
           tagAnimation="slide-up"
           features={[
             {
-              title: "Exterior Detailing Results",
-              description:
-                "Professional wash, clay bar treatment, and wax application bring out the shine in every vehicle. Watch how dull, dirty exteriors become showroom-quality finishes.",
-              icon: Sparkles,
+              title: "Interior Transformation",              description: "Complete interior refresh showing the dramatic difference professional detailing makes for your cabin's appearance and cleanliness.",              icon: Sparkles,
               mediaItems: [
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/image-dirty-car-after-trip-off-road-stands-against-brick-wall-old-part-town_613910-6302.jpg?_wi=3",
-                  imageAlt: "Exterior detailing before",
-                },
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193557.jpg?_wi=3",
-                  imageAlt: "Exterior detailing after",
-                },
+                { imageSrc: "http://img.b2bpic.net/free-photo/woman-cleaning-her-car-dashboard-with-rag_23-2150318453.jpg?_wi=3", imageAlt: "Interior before cleaning" },
+                { imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2795.jpg?_wi=3", imageAlt: "Interior after cleaning" },
               ],
             },
             {
-              title: "Interior Detailing Transformation",
-              description:
-                "Deep cleaning, stain removal, and conditioning restore interiors to like-new condition. From dusty cabins to pristine spaces, see the dramatic difference.",
-              icon: Sparkles,
+              title: "Full Detail Results",              description: "Experience the complete transformation of a full detail package - interior and exterior restored to showroom condition.",              icon: Check,
               mediaItems: [
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/woman-cleaning-her-car-dashboard-with-rag_23-2150318453.jpg?_wi=3",
-                  imageAlt: "Interior detailing before",
-                },
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2795.jpg?_wi=3",
-                  imageAlt: "Interior detailing after",
-                },
+                { imageSrc: "http://img.b2bpic.net/free-photo/man-white-shirt-wipes-car-car-wash_1157-27235.jpg?_wi=2", imageAlt: "Full detail before" },
+                { imageSrc: "http://img.b2bpic.net/free-photo/stylish-elegant-couple-car-salon_1157-22274.jpg?_wi=2", imageAlt: "Full detail after" },
               ],
             },
             {
-              title: "Full Detail Packages",
-              description:
-                "Complete vehicle transformations combining interior and exterior services. These vehicles show the comprehensive results of our most popular packages.",
-              icon: Sparkles,
+              title: "Paint Correction Excellence",              description: "Professional paint correction removes swirls, scratches, and oxidation to reveal a flawless, glossy finish.",              icon: Shield,
               mediaItems: [
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/man-white-shirt-wipes-car-car-wash_1157-27235.jpg?_wi=3",
-                  imageAlt: "Full detail before",
-                },
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/stylish-elegant-couple-car-salon_1157-22274.jpg?_wi=3",
-                  imageAlt: "Full detail after",
-                },
+                { imageSrc: "http://img.b2bpic.net/free-photo/photo-metal-texture-pattern_58702-16073.jpg?_wi=3", imageAlt: "Paint before correction" },
+                { imageSrc: "http://img.b2bpic.net/free-photo/car-wrapping-with-foil-car-service_1303-32335.jpg?_wi=3", imageAlt: "Paint after correction" },
               ],
             },
           ]}
           animationType="blur-reveal"
           textboxLayout="default"
           useInvertedBackground={false}
-          buttons={[{ text: "Book Your Transformation", href: "#contact" }]}
           buttonAnimation="slide-up"
         />
       </div>
 
-      <div id="gallery-specialty" data-section="gallery-specialty">
-        <FeatureCardTwentyFive
-          title="Specialty Service Results"
-          description="Advanced treatments and protection services showcased with before and after comparisons. See paint correction, ceramic coating, and fleet detailing excellence."
-          tag="Premium Results"
-          tagAnimation="slide-up"
-          features={[
-            {
-              title: "Paint Correction Excellence",
-              description:
-                "Remove swirls, scratches, and oxidation to restore original paint brilliance. Professional multi-stage correction for vehicles that need more than a wash.",
-              icon: Sparkles,
-              mediaItems: [
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/photo-metal-texture-pattern_58702-16073.jpg?_wi=3",
-                  imageAlt: "Paint correction before",
-                },
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/car-wrapping-with-foil-car-service_1303-32335.jpg?_wi=3",
-                  imageAlt: "Paint correction after",
-                },
-              ],
-            },
-            {
-              title: "Ceramic Coating Protection",
-              description:
-                "Long-lasting paint protection with hydrophobic properties. Vehicles maintain their shine for years with minimal maintenance after professional ceramic application.",
-              icon: Sparkles,
-              mediaItems: [
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30596.jpg?_wi=5",
-                  imageAlt: "Ceramic coating application",
-                },
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/person-working-car-wrapping_23-2149342625.jpg?_wi=3",
-                  imageAlt: "Ceramic coating finish",
-                },
-              ],
-            },
-            {
-              title: "Fleet Detailing Services",
-              description:
-                "Professional detailing for multiple vehicles and commercial fleets. Bulk services keep company vehicles looking professional and well-maintained.",
-              icon: Sparkles,
-              mediaItems: [
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/transport-concept-with-cars-aerial-view_23-2148959733.jpg?_wi=3",
-                  imageAlt: "Fleet before detailing",
-                },
-                {
-                  imageSrc:
-                    "http://img.b2bpic.net/free-photo/photo-automobile-production-line-welding-car-body-modern-car-assembly-plant-auto-industry-interior-hightech-factory-modern-production_645730-278.jpg?_wi=3",
-                  imageAlt: "Fleet after detailing",
-                },
-              ],
-            },
+      {/* Testimonials */}
+      <div id="testimonials" data-section="testimonials">
+        <TestimonialCardTwelve
+          testimonials={[
+            { id: "1", name: "Sarah Johnson", imageSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-attractive-woman-showing-thumb-up-outdoors_1262-12526.jpg?_wi=3", imageAlt: "Sarah Johnson" },
+            { id: "2", name: "Michael Chen", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport-terminal_107420-85070.jpg?_wi=2", imageAlt: "Michael Chen" },
+            { id: "3", name: "Emily Rodriguez", imageSrc: "http://img.b2bpic.net/free-photo/happy-businesswoman-smiling-looking-camera-successful-confident-grey-haired-manager-sitting-office-room-workplace-business-management-concept_74855-7343.jpg?_wi=2", imageAlt: "Emily Rodriguez" },
+            { id: "4", name: "David Kim", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg?_wi=2", imageAlt: "David Kim" },
           ]}
-          animationType="blur-reveal"
-          textboxLayout="default"
+          cardTitle="Our customers love the transformation we deliver"
+          cardTag="Customer Satisfaction"
+          cardTagIcon={Star}
+          cardAnimation="slide-up"
           useInvertedBackground={false}
-          buttons={[{ text: "Get Your Vehicle Detailed", href: "#contact" }]}
-          buttonAnimation="slide-up"
         />
       </div>
 
+      {/* Contact CTA */}
+      <div id="contact" data-section="contact">
+        <ContactSplitForm
+          title="Get Your Vehicle Transformed"
+          description="Book your detailing appointment today and join thousands of satisfied customers."
+          inputs={[
+            { name: "name", type: "text", placeholder: "Your Name", required: true },
+            { name: "phone", type: "tel", placeholder: "(###) ###-####", required: true },
+            { name: "email", type: "email", placeholder: "your@email.com", required: true },
+            { name: "vehicleType", type: "text", placeholder: "Vehicle Type", required: true },
+          ]}
+          textarea={{ name: "notes", placeholder: "What services are you interested in?", rows: 4 }}
+          useInvertedBackground={false}
+          imageSrc="http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193588.jpg?_wi=4"
+          imageAlt="Professional detailing equipment"
+          mediaAnimation="slide-up"
+          mediaPosition="right"
+          buttonText="Schedule Now"
+        />
+      </div>
+
+      {/* Footer */}
       <div id="footer" data-section="footer">
         <FooterMedia
           imageSrc="http://img.b2bpic.net/free-photo/luxury-car-interior-brown-black-colors_181624-31177.jpg?_wi=4"
@@ -186,8 +122,7 @@ export default function GalleryPage() {
           copyrightText="© 2025 Elite Auto Detailing & Mobile Services LLC. All rights reserved."
           columns={[
             {
-              title: "Services",
-              items: [
+              title: "Services",              items: [
                 { label: "Interior Detailing", href: "/services" },
                 { label: "Exterior Detailing", href: "/services" },
                 { label: "Paint Correction", href: "/services" },
@@ -196,8 +131,7 @@ export default function GalleryPage() {
               ],
             },
             {
-              title: "Company",
-              items: [
+              title: "Company",              items: [
                 { label: "Home", href: "/" },
                 { label: "About Us", href: "/about" },
                 { label: "Gallery", href: "/gallery" },
@@ -206,14 +140,10 @@ export default function GalleryPage() {
               ],
             },
             {
-              title: "Contact",
-              items: [
+              title: "Contact",              items: [
                 { label: "Call: (###) ###-####", href: "tel:+1-###-###-####" },
                 { label: "Text Us", href: "sms:+1-###-###-####" },
-                {
-                  label: "Email: info@eliteautodetailing.com",
-                  href: "mailto:info@eliteautodetailing.com",
-                },
+                { label: "Email: info@eliteautodetailing.com", href: "mailto:info@eliteautodetailing.com" },
                 { label: "Service Area: [City/Region]", href: "#" },
                 { label: "Hours: Mon-Sun, By Appointment", href: "#" },
               ],