Merge version_3 into main

Merge version_3 into main

src/app/contact/page.tsx

@@ -0,0 +1,106 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { useRouter } from 'next/navigation';
+
+export default function ContactPage() {
+  const router = useRouter();
+
+  const handleSubmit = (data: Record<string, string>) => {
+    console.log('Contact form submitted:', data);
+    // Here you would typically send the data to a backend service
+    // For now, we'll just log it and redirect
+    alert('Thank you for contacting us! We will get back to you soon.');
+    router.push('/');
+  };
+
+  return (
+    <ThemeProvider
+      defaultButtonVariant="elastic-effect"
+      defaultTextAnimation="entrance-slide"
+      borderRadius="soft"
+      contentWidth="compact"
+      sizing="mediumSizeLargeTitles"
+      background="none"
+      cardStyle="inset"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="layered"
+      headingFontWeight="semibold"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleFullscreen
+          navItems={[
+            { name: "Services", id: "services" },
+            { name: "Why Us", id: "why-us" },
+            { name: "Reviews", id: "reviews" },
+            { name: "Book Now", id: "booking" }
+          ]}
+          brandName="OnSpot Mobile Detailing"
+          bottomLeftText="Ottawa, Ontario"
+          bottomRightText="(613) 716-5686"
+        />
+      </div>
+
+      <div id="contact-form" data-section="contact-form">
+        <ContactSplitForm
+          title="Get In Touch"
+          description="Have questions about our services? Want to book a detailing appointment? Fill out the form below and we'll get back to you as soon as possible. We're available 24/7 to serve you."
+          inputs={[
+            { name: 'name', type: 'text', placeholder: 'Full Name', required: true },
+            { name: 'email', type: 'email', placeholder: 'Email Address', required: true },
+            { name: 'phone', type: 'tel', placeholder: 'Phone Number', required: true }
+          ]}
+          textarea={{
+            name: 'message',
+            placeholder: 'Tell us about your vehicle and what service you\'re interested in...',
+            rows: 6,
+            required: true
+          }}
+          useInvertedBackground={false}
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772731614404-shlb5j8d.jpg"
+          imageAlt="OnSpot Mobile Detailing mobile detailing service"
+          mediaAnimation="none"
+          mediaPosition="right"
+          buttonText="Send Message"
+          onSubmit={handleSubmit}
+        />
+      </div>
+
+      <div id="footer" data-section="footer">
+        <FooterBaseCard
+          logoText="OnSpot Mobile Detailing Mobile Detailing"
+          copyrightText="© 2025 OnSpot Mobile Detailing Mobile Detailing. All rights reserved."
+          columns={[
+            {
+              title: "Service",              items: [
+                { label: "Interior Detailing", href: "/" },
+                { label: "Exterior Wash & Wax", href: "/" },
+                { label: "Deep Cleaning", href: "/" },
+                { label: "Stain Removal", href: "/" }
+              ]
+            },
+            {
+              title: "Company",              items: [
+                { label: "About Us", href: "/" },
+                { label: "Reviews", href: "/" },
+                { label: "Home", href: "/" }
+              ]
+            },
+            {
+              title: "Contact",              items: [
+                { label: "Phone: (613) 716-5686", href: "tel:+16137165686" },
+                { label: "180 Beausoleil Dr, Ottawa, ON K1N 8X8", href: "#" },
+                { label: "Available 24/7", href: "#" },
+                { label: "Service Area: Ottawa & Surrounding", href: "#" }
+              ]
+            }
+          ]}
+          onPrivacyClick={() => console.log('Privacy clicked')}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -6,12 +6,22 @@ import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleC
 import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
 import SplitAbout from '@/components/sections/about/SplitAbout';
 import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
-import ProductCardFour from '@/components/sections/product/ProductCardFour';
 import ContactSplit from '@/components/sections/contact/ContactSplit';
 import FooterMedia from '@/components/sections/footer/FooterMedia';
 import { Sparkles, Quote, Star, Clock, MapPin, Users, DollarSign, Calendar } from 'lucide-react';
+import { useRouter } from 'next/navigation';
 
 export default function LandingPage() {
+  const router = useRouter();
+
+  const handleBookNowClick = () => {
+    router.push('/contact');
+  };
+
+  const handleCallClick = () => {
+    window.location.href = 'tel:+16137165686';
+  };
+
   return (
     <ThemeProvider
       defaultButtonVariant="elastic-effect"
@@ -31,10 +41,9 @@ export default function LandingPage() {
             { name: "Services", id: "services" },
             { name: "Why Us", id: "why-us" },
             { name: "Reviews", id: "reviews" },
-            { name: "Book Now", id: "booking" },
-            { name: "Contact", id: "contact" }
+            { name: "Book Now", id: "booking" }
           ]}
-          brandName="OnSpot"
+          brandName="OnSpot Mobile Detailing"
           bottomLeftText="Ottawa, Ontario"
           bottomRightText="(613) 716-5686"
         />
@@ -53,32 +62,32 @@ export default function LandingPage() {
               imageSrc: "http://img.b2bpic.net/free-photo/man-car-clean-using-brush-clean-up-all-details-inside-vehicle_1303-30586.jpg?_wi=1",              imageAlt: "Luxury car detailing showcase"
             },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2004.jpg?_wi=1",              imageAlt: "Professional interior detailing"
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675821741-3eplo34k.jpg",              imageAlt: "Professional interior detailing"
             },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/man-polishing-car-with-orbital-applicator_1303-30576.jpg?_wi=1",              imageAlt: "Premium exterior car wash"
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675790472-1svjrma5.jpg",              imageAlt: "Premium exterior car wash"
             },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2004.jpg?_wi=2",              imageAlt: "Deep cleaning service"
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675772643-tqizhj0e.jpg",              imageAlt: "Deep cleaning service"
             }
           ]}
           rightCarouselItems={[
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg?_wi=1",              imageAlt: "Stain and odor removal"
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675781170-wlr87fjc.jpg",              imageAlt: "Stain and odor removal"
             },
             {
               imageSrc: "http://img.b2bpic.net/free-photo/two-asian-brothers-man-wear-all-black-posed-near-suv-cars-smoke-hookah_627829-3723.jpg?_wi=1",              imageAlt: "Mobile on-site detailing"
             },
             {
-              imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-cleaning-car-exterior_23-2148194135.jpg?_wi=1",              imageAlt: "Before and after transformation"
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675834775-5uq5zh9z.jpg",              imageAlt: "Before and after transformation"
             },
             {
               imageSrc: "http://img.b2bpic.net/free-photo/person-working-car-wrapping_23-2149342625.jpg?_wi=1",              imageAlt: "Car detailing results"
             }
           ]}
           buttons={[
-            { text: "Book Now", href: "booking" },
-            { text: "Call (613) 716-5686", href: "tel:+16137165686" }
+            { text: "Book Now", onClick: handleBookNowClick },
+            { text: "Call (613) 716-5686", onClick: handleCallClick }
           ]}
           buttonAnimation="slide-up"
           carouselPosition="right"
@@ -95,23 +104,23 @@ export default function LandingPage() {
           features={[
             {
               id: 1,
-              tag: "Interior Care",              title: "Full Interior Detailing",              subtitle: "Deep clean your vehicle's interior",              description: "We meticulously vacuum, shampoo, and condition every surface inside your car. From carpets to upholstery, our professional-grade products and attention to detail ensure your interior looks and feels pristine.",              imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2004.jpg?_wi=3",              imageAlt: "Full interior detailing service"
+              tag: "Interior Care",              title: "Full Interior Detailing",              subtitle: "Deep clean your vehicle's interior",              description: "We meticulously vacuum, shampoo, and condition every surface inside your car. From carpets to upholstery, our professional-grade products and attention to detail ensure your interior looks and feels pristine.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772745623873-vs4wh2ar.jpg",              imageAlt: "Full interior detailing service"
             },
             {
               id: 2,
-              tag: "Exterior Excellence",              title: "Exterior Wash & Wax",              subtitle: "Professional shine and protection",              description: "Our exterior service includes thorough washing, clay treatment, and premium wax application. We use only professional-grade products to protect your vehicle's paint and deliver a showroom-quality shine.",              imageSrc: "http://img.b2bpic.net/free-photo/man-polishing-car-with-orbital-applicator_1303-30576.jpg?_wi=2",              imageAlt: "Exterior wash and wax service"
+              tag: "Exterior Excellence",              title: "Exterior Wash & Wax",              subtitle: "Professional shine and protection",              description: "Our exterior service includes thorough washing, clay treatment, and premium wax application. We use only professional-grade products to protect your vehicle's paint and deliver a showroom-quality shine.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675923969-bt0mfkkr.jpg",              imageAlt: "Exterior wash and wax service"
             },
             {
               id: 3,
-              tag: "Premium Treatment",              title: "Deep Cleaning Packages",              subtitle: "Comprehensive restoration service",              description: "Our deep cleaning packages combine interior and exterior services with advanced treatments. Perfect for vehicles needing full restoration or maintenance. Includes engine bay cleaning and comprehensive detailing.",              imageSrc: "http://img.b2bpic.net/free-photo/young-man-washing-car-carwash-station-outdoor_651396-2004.jpg?_wi=4",              imageAlt: "Deep cleaning package"
+              tag: "Premium Treatment",              title: "Deep Cleaning Packages",              subtitle: "Comprehensive restoration service",              description: "Our deep cleaning packages combine interior and exterior services with advanced treatments. Perfect for vehicles needing full restoration or maintenance. Includes engine bay cleaning and comprehensive detailing.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675949307-fbueypyj.jpg",              imageAlt: "Deep cleaning package"
             },
             {
               id: 4,
-              tag: "Specialized Care",              title: "Stain & Odor Removal",              subtitle: "Eliminate stubborn issues",              description: "We tackle tough stains and odors with professional-grade treatments. Whether it's pet odors, spills, or lingering smells, our specialized solutions restore your car to like-new condition.",              imageSrc: "http://img.b2bpic.net/free-photo/man-car-clean-vacuuming-car-inside_1303-30580.jpg?_wi=2",              imageAlt: "Stain and odor removal service"
+              tag: "Specialized Care",              title: "Stain & Odor Removal",              subtitle: "Eliminate stubborn issues",              description: "We tackle tough stains and odors with professional-grade treatments. Whether it's pet odors, spills, or lingering smells, our specialized solutions restore your car to like-new condition.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675973704-bb4yci82.jpg",              imageAlt: "Stain and odor removal service"
             },
             {
               id: 5,
-              tag: "Convenience",              title: "Mobile On-Site Service",              subtitle: "We come directly to you",              description: "Skip the drive to a detail shop. Our mobile service comes to your home or workplace with full equipment and professional supplies. Same exceptional quality, maximum convenience.",              imageSrc: "http://img.b2bpic.net/free-photo/two-asian-brothers-man-wear-all-black-posed-near-suv-cars-smoke-hookah_627829-3723.jpg?_wi=2",              imageAlt: "Mobile on-site detailing service"
+              tag: "Convenience",              title: "Mobile On-Site Service",              subtitle: "We come directly to you",              description: "Skip the drive to a detail shop. Our mobile service comes to your home or workplace with full equipment and professional supplies. Same exceptional quality, maximum convenience.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772675987825-quglvmr6.jpg",              imageAlt: "Mobile on-site detailing service"
             }
           ]}
         />
@@ -119,14 +128,14 @@ export default function LandingPage() {
 
       <div id="why-us" data-section="why-us">
         <SplitAbout
-          title="Why Choose OnSpot Mobile Detailing"
+          title="Why Choose OnSpot Mobile Detailing Mobile Detailing"
           description="We deliver exceptional results with a commitment to professionalism, quality, and your convenience"
           tag="Trust & Quality"
           textboxLayout="default"
           useInvertedBackground={false}
           imagePosition="right"
           imageSrc="http://img.b2bpic.net/free-photo/man-car-clean-using-brush-clean-up-all-details-inside-vehicle_1303-30586.jpg?_wi=2"
-          imageAlt="Premium OnSpot detailing results"
+          imageAlt="Premium OnSpot Mobile Detailing detailing results"
           mediaAnimation="none"
           bulletPoints={[
             {
@@ -187,32 +196,6 @@ export default function LandingPage() {
         />
       </div>
 
-      <div id="gallery" data-section="gallery">
-        <ProductCardFour
-          title="Before & After Gallery"
-          description="See the stunning transformations we deliver for our clients"
-          tag="Results Showcase"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          gridVariant="bento-grid"
-          animationType="slide-up"
-          products={[
-            {
-              id: "1",              name: "Luxury SUV Transformation",              price: "Complete Detail",              variant: "Before & After",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-cleaning-car-exterior_23-2148194135.jpg?_wi=2",              imageAlt: "Luxury SUV before and after detailing"
-            },
-            {
-              id: "2",              name: "Executive Sedan Shine",              price: "Premium Service",              variant: "Before & After",              imageSrc: "http://img.b2bpic.net/free-photo/person-working-car-wrapping_23-2149342625.jpg?_wi=2",              imageAlt: "Executive sedan before and after detailing"
-            },
-            {
-              id: "3",              name: "Interior Restoration",              price: "Deep Clean",              variant: "Before & After",              imageSrc: "http://img.b2bpic.net/free-photo/man-hoovering-car-cabin-garage_1157-36597.jpg",              imageAlt: "Interior restoration before and after"
-            },
-            {
-              id: "4",              name: "Sports Car Polish",              price: "Full Detail",              variant: "Before & After",              imageSrc: "http://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30596.jpg",              imageAlt: "Sports car polish and shine before and after"
-            }
-          ]}
-        />
-      </div>
-
       <div id="booking" data-section="booking">
         <ContactSplit
           tag="Book Your Service"
@@ -221,8 +204,8 @@ export default function LandingPage() {
           tagIcon={Calendar}
           background={{ variant: "plain" }}
           useInvertedBackground={false}
-          imageSrc="http://img.b2bpic.net/free-photo/man-car-clean-using-brush-clean-up-all-details-inside-vehicle_1303-30586.jpg?_wi=3"
-          imageAlt="OnSpot mobile detailing service"
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772731614404-shlb5j8d.jpg"
+          imageAlt="OnSpot Mobile Detailing mobile detailing service"
           inputPlaceholder="Enter your email"
           buttonText="Book Now"
           termsText="By booking, you agree to our service terms. We respect your privacy."
@@ -233,10 +216,10 @@ export default function LandingPage() {
 
       <div id="footer" data-section="footer">
         <FooterMedia
-          imageSrc="http://img.b2bpic.net/free-photo/man-car-clean-using-brush-clean-up-all-details-inside-vehicle_1303-30586.jpg?_wi=4"
-          imageAlt="OnSpot Mobile Detailing premium service"
-          logoText="OnSpot Mobile Detailing"
-          copyrightText="© 2025 OnSpot Mobile Detailing. All rights reserved."
+          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AUbn1UnBHb2aQXLcOGDwOlxMhC/uploaded-1772676061551-xlogpyzm.jpg"
+          imageAlt="OnSpot Mobile Detailing Mobile Detailing premium service"
+          logoText="OnSpot Mobile Detailing Mobile Detailing"
+          copyrightText="© 2025 OnSpot Mobile Detailing Mobile Detailing. All rights reserved."
           columns={[
             {
               title: "Service",              items: [
@@ -250,7 +233,6 @@ export default function LandingPage() {
               title: "Company",              items: [
                 { label: "About Us", href: "#why-us" },
                 { label: "Reviews", href: "#reviews" },
-                { label: "Gallery", href: "#gallery" },
                 { label: "Contact", href: "tel:+16137165686" }
               ]
             },
@@ -267,4 +249,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}