Update src/app/page.tsx

Update src/app/services/page.tsx
2026-03-27 22:39:38 +00:00 · 2026-03-27 22:39:09 +00:00 · 2026-03-27 22:39:08 +00:00 · 2026-03-27 22:39:08 +00:00 · 2026-03-27 22:39:07 +00:00 · 2026-03-27 22:39:07 +00:00
5 changed files with 86 additions and 94 deletions
--- a/src/app/about/page.tsx
+++ b/src/app/about/page.tsx
@@ -3,8 +3,8 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import TeamCardSix from '@/components/sections/team/TeamCardSix';
 import { MapPin, Users } from "lucide-react";

@@ -24,18 +24,13 @@ export default function LandingPage() {
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarStyleApple
      navItems={[
-        {
-          name: "Home",          id: "/"},
-        {
-          name: "Services",          id: "/services"},
-        {
-          name: "How It Works",          id: "/how-it-works"},
-        {
-          name: "About",          id: "/about"},
-        {
-          name: "Contact",          id: "/contact"},
+        { name: "Home", id: "/" },
+        { name: "Services", id: "/services" },
+        { name: "How It Works", id: "/how-it-works" },
+        { name: "About", id: "/about" },
+        { name: "Contact", id: "/contact" },
      ]}
      brandName="Nicks 2 Interlock"
    />
@@ -87,23 +82,16 @@ export default function LandingPage() {
  </div>

  <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
+      <FooterBaseCard
+      logoText="Nicks 2 Interlock"
+      copyrightText="© 2025 Nicks 2 Interlock. All rights reserved."
      columns={[
-        {
-          items: [
-            {
-              label: "Home",              href: "/"},
-            {
-              label: "Services",              href: "/services"},
-            {
-              label: "Contact",              href: "/contact"},
-          ],
-        },
+        { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] },
+        { title: "Areas Served", items: [{ label: "Longmont", href: "#" }, { label: "Boulder", href: "#" }, { label: "Denver Metro", href: "#" }] }
      ]}
-      logoText="Nicks 2 Interlock Services"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -3,8 +3,8 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import ContactCTA from '@/components/sections/contact/ContactCTA';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import PricingCardEight from '@/components/sections/pricing/PricingCardEight';

 export default function LandingPage() {
@@ -23,18 +23,13 @@ export default function LandingPage() {
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarStyleApple
      navItems={[
-        {
-          name: "Home",          id: "/"},
-        {
-          name: "Services",          id: "/services"},
-        {
-          name: "How It Works",          id: "/how-it-works"},
-        {
-          name: "About",          id: "/about"},
-        {
-          name: "Contact",          id: "/contact"},
+        { name: "Home", id: "/" },
+        { name: "Services", id: "/services" },
+        { name: "How It Works", id: "/how-it-works" },
+        { name: "About", id: "/about" },
+        { name: "Contact", id: "/contact" },
      ]}
      brandName="Nicks 2 Interlock"
    />
@@ -84,23 +79,16 @@ export default function LandingPage() {
  </div>

  <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
+      <FooterBaseCard
+      logoText="Nicks 2 Interlock"
+      copyrightText="© 2025 Nicks 2 Interlock. All rights reserved."
      columns={[
-        {
-          items: [
-            {
-              label: "Home",              href: "/"},
-            {
-              label: "Services",              href: "/services"},
-            {
-              label: "Contact",              href: "/contact"},
-          ],
-        },
+        { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] },
+        { title: "Areas Served", items: [{ label: "Longmont", href: "#" }, { label: "Boulder", href: "#" }, { label: "Denver Metro", href: "#" }] }
      ]}
-      logoText="Nicks 2 Interlock Services"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}
--- a/src/app/how-it-works/page.tsx
+++ b/src/app/how-it-works/page.tsx
@@ -2,9 +2,10 @@

 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import TimelinePhoneView from '@/components/cardStack/layouts/timelines/TimelinePhoneView';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import TimelineProcessFlow from '@/components/cardStack/layouts/timelines/TimelineProcessFlow';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
+import { Zap, FileCheck, CheckCircle2, Wrench } from "lucide-react";

 export default function HowItWorksPage() {
  return (
@@ -22,7 +23,7 @@ export default function HowItWorksPage() {
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
-            <NavbarLayoutFloatingOverlay
+            <NavbarStyleApple
            navItems={[
              { name: "Home", id: "/" },
              { name: "Services", id: "/services" },
@@ -34,36 +35,29 @@ export default function HowItWorksPage() {
          />
        </div>

-        <div id="timeline" data-section="timeline" className="py-20">
-            <TimelinePhoneView
-                title="Your Journey to Compliance"
-                description="Our process is designed to be simple, respectful, and fully compliant with Colorado DMV requirements."
+        <div id="process" data-section="process">
+            <TimelineProcessFlow
+                title="Your Path to Compliance"
+                description="Our streamlined four-step process is designed to get you back on the road safely and legally, with personalized support every step of the way."
                textboxLayout="split"
                animationType="blur-reveal"
                items={[
-                    { 
-                        trigger: "1. Schedule Appointment", 
-                        content: "Contact our team to book your installation. We prioritize urgent needs to get you back on the road quickly.", 
-                        imageOne: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/technician-checking-interlock-device-in--1774639651814-4a93081c.png" 
-                    },
-                    { 
-                        trigger: "2. Professional Installation", 
-                        content: "Our certified technicians perform a precise, non-invasive installation. We walk you through every step of using your new device.", 
-                        imageOne: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/modern-interlock-device-inside-a-car-das-1774639652262-ff35b505.png" 
-                    },
-                    { 
-                        trigger: "3. Regular Calibration", 
-                        content: "Stay compliant with mandatory periodic data downloads and calibrations. We make this quick and effortless for you.", 
-                        imageOne: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/bright-and-clean-workshop-space-modern-f-1774639652470-f0dc2695.png" 
-                    }
+                    { id: "1", content: "Schedule your installation at our local Longmont facility. We verify your requirements and guide you through the initial appointment preparation.", media: <Zap className="w-12 h-12" />, reverse: false },
+                    { id: "2", content: "Our certified technicians perform a precision installation tailored to your specific vehicle model, ensuring full compliance and reliable operation.", media: <Wrench className="w-12 h-12" />, reverse: true },
+                    { id: "3", content: "Get thorough, one-on-one training on device usage, reporting requirements, and helpful tips to make your daily driving experience hassle-free.", media: <FileCheck className="w-12 h-12" />, reverse: false },
+                    { id: "4", content: "Return for your scheduled monthly calibration services. We provide rapid, accurate data reporting to keep your status compliant without delays.", media: <CheckCircle2 className="w-12 h-12" />, reverse: true },
                ]}
            />
        </div>

        <div id="footer" data-section="footer">
-            <FooterLogoEmphasis
-            columns={[{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "How It Works", href: "/how-it-works" }, { label: "Contact", href: "/contact" }] }]}
+            <FooterBaseCard
            logoText="Nicks 2 Interlock"
+            copyrightText="© 2025 Nicks 2 Interlock. All rights reserved."
+            columns={[
+              { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "How It Works", href: "/how-it-works" }, { label: "Contact", href: "/contact" }] },
+              { title: "Areas Served", items: [{ label: "Longmont", href: "#" }, { label: "Boulder", href: "#" }, { label: "Denver Metro", href: "#" }] }
+            ]}
            />
        </div>
      </ReactLenis>
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -3,13 +3,13 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import AboutMetric from '@/components/sections/about/AboutMetric';
-import FaqSplitText from '@/components/sections/faq/FaqSplitText';
+import FaqBase from '@/components/sections/faq/FaqBase';
 import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
-import { Award, CheckCircle, Clock, Heart, ShieldCheck, ThumbsUp } from "lucide-react";
+import { Award, CheckCircle, Heart, ShieldCheck } from "lucide-react";

 export default function LandingPage() {
  return (
@@ -27,7 +27,7 @@ export default function LandingPage() {
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
-      <NavbarLayoutFloatingOverlay
+      <NavbarStyleApple
      navItems={[
        { name: "Home", id: "/" },
        { name: "Services", id: "/services" },
@@ -45,7 +45,7 @@ export default function LandingPage() {
      title="Get Back on the Road Fast with Certified Interlock Services"
      description="Professional, reliable ignition interlock services in Longmont and surrounding Colorado areas. We provide personal care to help you move forward."
      leftCarouselItems={[
-        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/modern-interlock-device-inside-a-car-das-1774639652262-ff35b505.png", imageAlt: "Professional interlock installation" },
+        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/modern-interlock-device-inside-a-car-das-1774639652262-ff35b505.png?_wi=1", imageAlt: "Professional interlock installation" },
        { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/technician-checking-interlock-device-in--1774639651814-4a93081c.png?_wi=1", imageAlt: "Certified interlock calibration service" },
      ]}
      rightCarouselItems={[
@@ -57,6 +57,16 @@ export default function LandingPage() {
    />
  </div>

+  <div id="brand-showcase" data-section="brand-showcase">
+    <SocialProofOne
+      names={["Smart Start", "Guardian", "LifeSafer"]}
+      title="Trusted Industry Partners"
+      description="We work with the most recognized ignition interlock providers in the industry to ensure quality service."
+      textboxLayout="default"
+      useInvertedBackground={true}
+    />
+  </div>
+
  <div id="why-choose-us" data-section="why-choose-us">
      <AboutMetric
      useInvertedBackground={true}
@@ -81,14 +91,18 @@ export default function LandingPage() {
  </div>

  <div id="faq" data-section="faq">
-      <FaqSplitText
+      <FaqBase
+      title="Answers to Your Questions"
+      description="Common questions about our services and process."
+      faqsAnimation="blur-reveal"
+      textboxLayout="split"
      useInvertedBackground={true}
      faqs={[
        { id: "f1", title: "What is an ignition interlock device?", content: "It is a breath-test device connected to your vehicle's ignition system." },
        { id: "f2", title: "How often do I need calibration?", content: "Regular calibration is required to ensure accuracy." },
+        { id: "f3", title: "Do you offer same-day installation?", content: "In many cases, yes. Please contact us to check availability." },
+        { id: "f4", title: "Is the device easy to use?", content: "We provide thorough training to ensure you are comfortable using the device." },
      ]}
-      sideTitle="Answers to Your Questions"
-      faqsAnimation="blur-reveal"
    />
  </div>

@@ -106,9 +120,13 @@ export default function LandingPage() {
  </div>

  <div id="footer" data-section="footer">
-      <FooterLogoEmphasis
-      columns={[{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "How It Works", href: "/how-it-works" }, { label: "Contact", href: "/contact" }] }]}
+      <FooterBaseCard
      logoText="Nicks 2 Interlock"
+      copyrightText="© 2025 Nicks 2 Interlock. All rights reserved."
+      columns={[
+        { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "How It Works", href: "/how-it-works" }, { label: "Contact", href: "/contact" }] },
+        { title: "Areas Served", items: [{ label: "Longmont", href: "#" }, { label: "Boulder", href: "#" }, { label: "Denver Metro", href: "#" }] }
+      ]}
    />
  </div>
      </ReactLenis>
--- a/src/app/services/page.tsx
+++ b/src/app/services/page.tsx
@@ -2,8 +2,8 @@

 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
 import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';

 export default function ServicesPage() {
@@ -22,7 +22,7 @@ export default function ServicesPage() {
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
-            <NavbarLayoutFloatingOverlay
+            <NavbarStyleApple
            navItems={[
              { name: "Home", id: "/" },
              { name: "Services", id: "/services" },
@@ -41,7 +41,7 @@ export default function ServicesPage() {
                textboxLayout="split"
                useInvertedBackground={false}
                features={[
-                    { id: 1, title: "Lifesafer", description: "High-accuracy ignition interlock devices with reliable technology, trusted by courts nationwide.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/modern-interlock-device-inside-a-car-das-1774639652262-ff35b505.png" },
+                    { id: 1, title: "Lifesafer", description: "High-accuracy ignition interlock devices with reliable technology, trusted by courts nationwide.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/modern-interlock-device-inside-a-car-das-1774639652262-ff35b505.png?_wi=2" },
                    { id: 2, title: "Guardian", description: "Advanced, user-friendly interlock units designed for speed and ease of use in any climate.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/technician-checking-interlock-device-in--1774639651814-4a93081c.png" },
                    { id: 3, title: "Smart Start", description: "The industry leader in ignition interlock technology, providing durable and compliant solutions.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AXyOrSaZWfuzAUSsqC1adzoZvF/bright-and-clean-workshop-space-modern-f-1774639652470-f0dc2695.png" }
                ]}
@@ -49,9 +49,13 @@ export default function ServicesPage() {
        </div>

        <div id="footer" data-section="footer">
-            <FooterLogoEmphasis
-            columns={[{ items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "How It Works", href: "/how-it-works" }, { label: "Contact", href: "/contact" }] }]}
+            <FooterBaseCard
            logoText="Nicks 2 Interlock"
+            copyrightText="© 2025 Nicks 2 Interlock. All rights reserved."
+            columns={[
+              { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }, { label: "How It Works", href: "/how-it-works" }, { label: "Contact", href: "/contact" }] },
+              { title: "Areas Served", items: [{ label: "Longmont", href: "#" }, { label: "Boulder", href: "#" }, { label: "Denver Metro", href: "#" }] }
+            ]}
            />
        </div>
      </ReactLenis>
Author	SHA1	Message	Date
bender	38ecaa488e	Update src/app/page.tsx	2026-03-27 22:39:38 +00:00
bender	05cb299ca1	Update src/app/services/page.tsx	2026-03-27 22:39:09 +00:00
bender	e9896bad08	Update src/app/page.tsx	2026-03-27 22:39:08 +00:00
bender	30221b1ef3	Update src/app/how-it-works/page.tsx	2026-03-27 22:39:08 +00:00
bender	f14ba20b60	Update src/app/contact/page.tsx	2026-03-27 22:39:07 +00:00
bender	ff782a6fbc	Update src/app/about/page.tsx	2026-03-27 22:39:07 +00:00
bender	723c80731e	Merge version_13 into main Merge version_13 into main	2026-03-27 22:33:54 +00:00
bender	52f0edcff1	Update src/app/services/page.tsx	2026-03-27 22:33:51 +00:00
bender	39b68719bf	Update src/app/page.tsx	2026-03-27 22:33:50 +00:00
bender	92b99f6bc1	Update src/app/how-it-works/page.tsx	2026-03-27 22:33:50 +00:00
bender	f63505e56a	Update src/app/contact/page.tsx	2026-03-27 22:33:50 +00:00
bender	40c88be044	Update src/app/about/page.tsx	2026-03-27 22:33:49 +00:00
bender	06fedbc92b	Merge version_12 into main Merge version_12 into main	2026-03-27 21:15:40 +00:00
bender	d04954ae83	Update src/app/page.tsx	2026-03-27 21:15:33 +00:00
bender	06b45e5d45	Merge version_11 into main Merge version_11 into main	2026-03-27 21:00:02 +00:00
bender	2971b93442	Update src/app/services/page.tsx	2026-03-27 20:59:59 +00:00
bender	0fc3aa1290	Update src/app/page.tsx	2026-03-27 20:59:59 +00:00
bender	811d832ef9	Merge version_11 into main Merge version_11 into main	2026-03-27 20:59:38 +00:00
bender	87105ea4d7	Update src/app/page.tsx	2026-03-27 20:59:35 +00:00
bender	2153b47a17	Update src/app/how-it-works/page.tsx	2026-03-27 20:59:34 +00:00
bender	82b108e7de	Merge version_10 into main Merge version_10 into main	2026-03-27 20:49:12 +00:00
bender	4fe08b39ed	Merge version_10 into main Merge version_10 into main	2026-03-27 20:48:46 +00:00