Update src/app/page.tsx

2026-04-14 06:54:51 +00:00
1 changed files with 44 additions and 99 deletions
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -11,6 +11,13 @@ import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';

+const handleBookNow = () => {
+  const element = document.getElementById('contact');
+  if (element) {
+    element.scrollIntoView({ behavior: 'smooth' });
+  }
+};
+
 export default function LandingPage() {
  return (
    <ThemeProvider
@@ -30,26 +37,17 @@ export default function LandingPage() {
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
-          name: "Home",
-          id: "hero",
-        },
+          name: "Home",          id: "hero"},
        {
-          name: "Services",
-          id: "services",
-        },
+          name: "Services",          id: "services"},
        {
-          name: "Trust",
-          id: "why",
-        },
+          name: "Trust",          id: "why"},
        {
-          name: "Reviews",
-          id: "testimonials",
-        },
+          name: "Reviews",          id: "testimonials"},
      ]}
      brandName="House Of Shine"
      button={{
-        text: "Book Now",
-        href: "#contact",
+        text: "Book Now",        onClick: handleBookNow,
      }}
    />
  </div>
@@ -57,18 +55,15 @@ export default function LandingPage() {
  <div id="hero" data-section="hero">
      <HeroBillboardScroll
      background={{
-        variant: "plain",
-      }}
+        variant: "plain"}}
      title="House Of Shine Autoworks"
      description="Not the cheapest. The best. We provide showroom-quality transformations for the most discerning automotive enthusiasts."
      buttons={[
        {
-          text: "Book Appointment",
-          href: "#contact",
+          text: "Book Appointment",          onClick: handleBookNow,
        },
        {
-          text: "Get A Quote",
-          href: "#contact",
+          text: "Get A Quote",          onClick: handleBookNow,
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/headlight-lamp-car_1339-3081.jpg"
@@ -84,20 +79,11 @@ export default function LandingPage() {
      useInvertedBackground={false}
      metrics={[
        {
-          id: "m1",
-          value: "5.0",
-          description: "Star Google Rating",
-        },
+          id: "m1",          value: "5.0",          description: "Star Google Rating"},
        {
-          id: "m2",
-          value: "134+",
-          description: "Happy Clients",
-        },
+          id: "m2",          value: "134+",          description: "Happy Clients"},
        {
-          id: "m3",
-          value: "100%",
-          description: "Satisfaction Guarantee",
-        },
+          id: "m3",          value: "100%",          description: "Satisfaction Guarantee"},
      ]}
      title="Elite Standards"
      description="Unrivaled expertise for your luxury investment."
@@ -111,32 +97,17 @@ export default function LandingPage() {
      useInvertedBackground={false}
      features={[
        {
-          id: "f1",
-          title: "Ceramic Coating",
-          descriptions: [
-            "Flagship protection for years of shine.",
-            "Hydrophobic layer for easier maintenance.",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/bubbling-blue-water_23-2147798200.jpg",
-        },
+          id: "f1",          title: "Ceramic Coating",          descriptions: [
+            "Flagship protection for years of shine.",            "Hydrophobic layer for easier maintenance."],
+          imageSrc: "http://img.b2bpic.net/free-photo/bubbling-blue-water_23-2147798200.jpg"},
        {
-          id: "f2",
-          title: "Paint Correction",
-          descriptions: [
-            "Remove swirl marks and light scratches.",
-            "Restore true color intensity and clarity.",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30600.jpg",
-        },
+          id: "f2",          title: "Paint Correction",          descriptions: [
+            "Remove swirl marks and light scratches.",            "Restore true color intensity and clarity."],
+          imageSrc: "http://img.b2bpic.net/free-photo/man-working-car-detailing-coating-car_1303-30600.jpg"},
        {
-          id: "f3",
-          title: "Interior Detailing",
-          descriptions: [
-            "Immaculate restoration of all surfaces.",
-            "Deep cleaning with premium leather care.",
-          ],
-          imageSrc: "http://img.b2bpic.net/free-photo/view-3d-car-interior_23-2151138882.jpg",
-        },
+          id: "f3",          title: "Interior Detailing",          descriptions: [
+            "Immaculate restoration of all surfaces.",            "Deep cleaning with premium leather care."],
+          imageSrc: "http://img.b2bpic.net/free-photo/view-3d-car-interior_23-2151138882.jpg"},
      ]}
      title="Premium Services"
      description="Excellence in every detail, from paint protection to full interior restoration."
@@ -150,8 +121,7 @@ export default function LandingPage() {
      description="At House Of Shine, we don't just wash cars; we curate perfection. Jim's passion for automotive excellence ensures every vehicle receives unmatched attention to detail and care."
      buttons={[
        {
-          text: "Contact Our Team",
-          href: "#contact",
+          text: "Contact Our Team",          onClick: handleBookNow,
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/beautiful-small-girl-is-sitting-lifting-platform-with-car-holding-hammer_613910-17072.jpg"
@@ -167,25 +137,15 @@ export default function LandingPage() {
      author="Sarah Miller"
      avatars={[
        {
-          src: "http://img.b2bpic.net/free-photo/beautiful-woman-with-phone-car-showroom_1303-21397.jpg",
-          alt: "Customer 1",
-        },
+          src: "http://img.b2bpic.net/free-photo/beautiful-woman-with-phone-car-showroom_1303-21397.jpg",          alt: "Customer 1"},
        {
-          src: "http://img.b2bpic.net/free-photo/man-checking-out-new-car_23-2148130139.jpg",
-          alt: "Customer 2",
-        },
+          src: "http://img.b2bpic.net/free-photo/man-checking-out-new-car_23-2148130139.jpg",          alt: "Customer 2"},
        {
-          src: "http://img.b2bpic.net/free-photo/portrait-man-close-up-hard-light_1321-496.jpg",
-          alt: "Customer 3",
-        },
+          src: "http://img.b2bpic.net/free-photo/portrait-man-close-up-hard-light_1321-496.jpg",          alt: "Customer 3"},
        {
-          src: "http://img.b2bpic.net/free-photo/happy-young-woman-having-fun-amusement-park_23-2147911674.jpg",
-          alt: "Customer 4",
-        },
+          src: "http://img.b2bpic.net/free-photo/happy-young-woman-having-fun-amusement-park_23-2147911674.jpg",          alt: "Customer 4"},
        {
-          src: "http://img.b2bpic.net/free-photo/car-detailing-concept-man-face-mask-with-orbital-polisher-repair-shop-polishing-orange-suv-car_627829-12604.jpg",
-          alt: "Customer 5",
-        },
+          src: "http://img.b2bpic.net/free-photo/car-detailing-concept-man-face-mask-with-orbital-polisher-repair-shop-polishing-orange-suv-car_627829-12604.jpg",          alt: "Customer 5"},
      ]}
      ratingAnimation="slide-up"
      avatarsAnimation="slide-up"
@@ -196,13 +156,11 @@ export default function LandingPage() {
      <ContactText
      useInvertedBackground={false}
      background={{
-        variant: "rotated-rays-animated-grid",
-      }}
+        variant: "rotated-rays-animated-grid"}}
      text="Limited openings available for our premium detailing services. Secure your spot today to experience the House Of Shine difference."
      buttons={[
        {
-          text: "Book Now",
-          href: "#",
+          text: "Book Now",          onClick: handleBookNow,
        },
      ]}
    />
@@ -212,37 +170,24 @@ export default function LandingPage() {
      <FooterSimple
      columns={[
        {
-          title: "House Of Shine",
-          items: [
+          title: "House Of Shine",          items: [
            {
-              label: "About Us",
-              href: "#why",
-            },
+              label: "About Us",              href: "#why"},
            {
-              label: "Services",
-              href: "#services",
-            },
+              label: "Services",              href: "#services"},
            {
-              label: "Testimonials",
-              href: "#testimonials",
-            },
+              label: "Testimonials",              href: "#testimonials"},
          ],
        },
        {
-          title: "Support",
-          items: [
+          title: "Support",          items: [
            {
-              label: "Contact Jim",
-              href: "#contact",
+              label: "Contact Jim",              onClick: handleBookNow,
            },
            {
-              label: "FAQ",
-              href: "#",
-            },
+              label: "FAQ",              href: "#"},
            {
-              label: "Privacy Policy",
-              href: "#",
-            },
+              label: "Privacy Policy",              href: "#"},
          ],
        },
      ]}
@@ -253,4 +198,4 @@ export default function LandingPage() {
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}