Update src/app/dashboard/page.tsx

Merge version_3 into main

src/app/about/page.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import SplitAbout from '@/components/sections/about/SplitAbout';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+
+export default function AboutPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "About", id: "/about" },
+            { name: "Dashboard", id: "/dashboard" },
+            { name: "Contact", id: "/contact" }
+          ]}
+          brandName="Swift Haul"
+        />
+      </div>
+      <div id="about" data-section="about">
+        <SplitAbout
+          title="About Swift Haul"
+          description="Learn more about our mission to provide the most reliable trucking services in the industry."
+          bulletPoints={[]}
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+      <div id="footer" data-section="footer">
+        <FooterBaseReveal
+          logoText="Swift Haul"
+          columns={[
+            { title: "Company", items: [{ label: "About", href: "/about" }] },
+            { title: "Support", items: [{ label: "Contact", href: "/contact" }] },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/betting/page.tsx

@@ -1,28 +1,60 @@
 "use client";
+
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
+import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
 
 export default function BettingPage() {
   return (
-    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
-      <NavbarStyleApple 
-        navItems={[{ name: "Home", id: "/" }, { name: "Games", id: "/games" }, { name: "Betting", id: "/betting" }]} 
-        brandName="Swift Haul"
-      />
-      <PricingCardEight 
-        title="Sports Betting Arena"
-        description="Get competitive odds on your favorite sporting events."
-        plans={[
-            { id: "1", badge: "Premier", price: "1.85", subtitle: "Team A Win", buttons: [{text: "Bet Now"}], features: ["Fast Payouts", "Live Stats"] },
-            { id: "2", badge: "Premier", price: "2.10", subtitle: "Team B Win", buttons: [{text: "Bet Now"}], features: ["Fast Payouts", "Live Stats"] }
-        ]}
-        animationType="slide-up"
-        textboxLayout="default"
-        useInvertedBackground={false}
-      />
-      <FooterBaseReveal logoText="Swift Haul" columns={[]} />
+    <ThemeProvider
+      defaultButtonVariant="text-shift"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="soft"
+      contentWidth="mediumLarge"
+      sizing="mediumLargeSizeMediumTitles"
+      background="noiseDiagonalGradient"
+      cardStyle="solid"
+      primaryButtonStyle="shadow"
+      secondaryButtonStyle="layered"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Games", id: "/games" },
+              { name: "Betting", id: "/betting" },
+            ]}
+            brandName="Swift Haul"
+          />
+        </div>
+        <div id="betting" data-section="betting">
+          <MetricCardSeven
+            title="Betting Options & Odds"
+            description="Competitive odds on your favorite sports events and leagues."
+            animationType="slide-up"
+            textboxLayout="default"
+            useInvertedBackground={true}
+            metrics={[
+                { id: "b1", value: "1.85", title: "Football", items: ["Home Win", "Away Win", "Draw"] },
+                { id: "b2", value: "2.10", title: "Basketball", items: ["Handicap", "Over/Under", "Winner"] },
+                { id: "b3", value: "1.95", title: "Tennis", items: ["Set Winner", "Total Games", "Match Result"] }
+            ]}
+          />
+        </div>
+        <div id="footer" data-section="footer">
+          <FooterBaseReveal
+            logoText="Swift Haul"
+            columns={[
+              { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Games", href: "/games" }, { label: "Betting", href: "/betting" }] }
+            ]}
+            copyrightText="© 2024 Swift Haul Inc."
+          />
+        </div>
+      </ReactLenis>
     </ThemeProvider>
   );
 }

src/app/dashboard/page.tsx

@@ -0,0 +1,39 @@
+"use client";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
+
+export default function DashboardPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple 
+          navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Dashboard", id: "/dashboard"}, {name: "Contact", id: "/contact"}]} 
+          brandName="Swift Haul" 
+        />
+      </div>
+      <div id="metrics" data-section="metrics">
+        <MetricCardTwo 
+          title="Your Dashboard"
+          description="Overview of your account metrics."
+          metrics={[{id: "1", value: "$12,450", description: "Pending Payouts"}]}
+          gridVariant="uniform-all-items-equal"
+          animationType="blur-reveal"
+          textboxLayout="default"
+          useInvertedBackground={false}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/games/page.tsx

@@ -1,28 +1,61 @@
 "use client";
+
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import ReactLenis from "lenis/react";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
+import ProductCardFour from '@/components/sections/product/ProductCardFour';
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
 
 export default function GamesPage() {
   return (
-    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
-      <NavbarStyleApple 
-        navItems={[{ name: "Home", id: "/" }, { name: "Games", id: "/games" }, { name: "Betting", id: "/betting" }]} 
-        brandName="Swift Haul"
-      />
-      <FeatureCardTwentySeven 
-        title="Our Casino Games"
-        description="Explore our curated selection of premium casino games, from slots to live dealer experiences."
-        features={[
-            { id: "1", title: "Classic Slots", descriptions: ["Retro vibes"], imageSrc: "" },
-            { id: "2", title: "Live Roulette", descriptions: ["Real-time action"], imageSrc: "" }
-        ]}
-        animationType="slide-up"
-        textboxLayout="default"
-        useInvertedBackground={false}
-      />
-      <FooterBaseReveal logoText="Swift Haul" columns={[]} />
+    <ThemeProvider
+      defaultButtonVariant="text-shift"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="soft"
+      contentWidth="mediumLarge"
+      sizing="mediumLargeSizeMediumTitles"
+      background="noiseDiagonalGradient"
+      cardStyle="solid"
+      primaryButtonStyle="shadow"
+      secondaryButtonStyle="layered"
+      headingFontWeight="medium"
+    >
+      <ReactLenis root>
+        <div id="nav" data-section="nav">
+          <NavbarStyleApple
+            navItems={[
+              { name: "Home", id: "/" },
+              { name: "Games", id: "/games" },
+              { name: "Betting", id: "/betting" },
+            ]}
+            brandName="Swift Haul"
+          />
+        </div>
+        <div id="games" data-section="games">
+          <ProductCardFour
+            title="Our Gaming Categories"
+            description="Explore our wide selection of exciting games, categorized for your enjoyment."
+            gridVariant="uniform-all-items-equal"
+            animationType="slide-up"
+            useInvertedBackground={false}
+            textboxLayout="default"
+            products={[
+                { id: "g1", name: "Classic Slots", price: "Varied", variant: "Popular", imageSrc: "http://img.b2bpic.net/free-photo/shiny-slot-machine-casino_23-2148569830.jpg" },
+                { id: "g2", name: "Table Games", price: "Starts at $1", variant: "Featured", imageSrc: "http://img.b2bpic.net/free-photo/close-up-poker-chips-cards-green-table_23-2148569845.jpg" },
+                { id: "g3", name: "Live Casino", price: "Varies", variant: "New", imageSrc: "http://img.b2bpic.net/free-photo/live-dealer-roulette-wheel_23-2148569850.jpg" }
+            ]}
+          />
+        </div>
+        <div id="footer" data-section="footer">
+          <FooterBaseReveal
+            logoText="Swift Haul"
+            columns={[
+              { title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "Games", href: "/games" }, { label: "Betting", href: "/betting" }] }
+            ]}
+            copyrightText="© 2024 Swift Haul Inc."
+          />
+        </div>
+      </ReactLenis>
     </ThemeProvider>
   );
 }

src/app/login/page.tsx

@@ -1,18 +1,38 @@
 "use client";
-
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import ContactText from '@/components/sections/contact/ContactText';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import ContactSplit from '@/components/sections/contact/ContactSplit';
 
 export default function LoginPage() {
   return (
-    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
-      <NavbarStyleApple navItems={[{ name: "Home", id: "/" }, { name: "Login", id: "/login" }]} brandName="Swift Haul" />
-      <div className="min-h-screen flex items-center justify-center pt-20">
-        <ContactText 
-            text="Login to Your Account"
-            background={{ variant: "gradient-bars" }}
-            useInvertedBackground={false}
+    <ThemeProvider
+      defaultButtonVariant="text-shift"
+      defaultTextAnimation="reveal-blur"
+      borderRadius="soft"
+      contentWidth="medium"
+      sizing="medium"
+      background="noiseDiagonalGradient"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="gradient"
+      secondaryButtonStyle="glass"
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple 
+          navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Dashboard", id: "/dashboard"}, {name: "Contact", id: "/contact"}]} 
+          brandName="Swift Haul" 
+        />
+      </div>
+      <div id="contact" data-section="contact">
+        <ContactSplit 
+          tag="Access"
+          title="Login to Your Account"
+          description="Manage your fleet and track your shipments."
+          background={{ variant: "gradient-bars" }}
+          useInvertedBackground={false}
+          mediaAnimation="blur-reveal"
+          inputPlaceholder="Enter your email"
+          buttonText="Login"
         />
       </div>
     </ThemeProvider>

src/app/page.tsx

@@ -32,8 +32,8 @@ export default function LandingPage() {
       navItems={[
         { name: "About", id: "/about" },
         { name: "Services", id: "/services" },
+        { name: "Account", id: "/login" },
         { name: "Contact", id: "/contact" },
-        { name: "Account", id: "/login" }
       ]}
       brandName="Swift Haul"
     />
@@ -44,7 +44,7 @@ export default function LandingPage() {
       title="Reliable Freight Solutions for Every Mile"
       description="Swift Haul provides efficient, secure, and time-sensitive trucking services across the nation. Your cargo, our priority."
       buttons={[
-        { text: "Get a Quote", href: "#contact" },
+        { text: "Get a Quote", href: "/contact" },
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/white-semi-truck-driving-highway-sunset_23-2151998715.jpg"
       avatars={[
@@ -128,7 +128,7 @@ export default function LandingPage() {
       background={{ variant: "gradient-bars" }}
       text="Ready to move your freight? Contact our dispatch office today for a customized transportation solution."
       buttons={[
-        { text: "Contact Dispatch", href: "mailto:dispatch@swifthaul.com" },
+        { text: "Contact Dispatch", href: "/contact" },
       ]}
     />
   </div>
@@ -137,18 +137,9 @@ export default function LandingPage() {
       <FooterBaseReveal
       logoText="Swift Haul"
       columns={[
-        {
-          title: "Legal & Safety",          items: [
-            { label: "Responsible Gambling", href: "/responsible-gambling" },
-            { label: "Terms and Conditions", href: "/terms" },
-          ],
-        },
-        {
-          title: "Support",          items: [
-            { label: "Contact", href: "/contact" },
-            { label: "Login", href: "/login" },
-          ],
-        },
+        { title: "Company", items: [{ label: "About", href: "/about" }, { label: "Services", href: "/services" }] },
+        { title: "Account", items: [{ label: "Dashboard", href: "/dashboard" }, { label: "Login", href: "/login" }] },
+        { title: "Support", items: [{ label: "Contact", href: "/contact" }, { label: "Privacy", href: "/privacy" }, { label: "Terms", href: "/terms" }] },
       ]}
       copyrightText="© 2024 Swift Haul Inc."
     />
@@ -156,4 +147,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/privacy/page.tsx

@@ -0,0 +1,35 @@
+"use client";
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import LegalSection from '@/components/legal/LegalSection';
+
+export default function PrivacyPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple 
+          navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Dashboard", id: "/dashboard"}, {name: "Contact", id: "/contact"}]} 
+          brandName="Swift Haul" 
+        />
+      </div>
+      <div id="legal" data-section="legal">
+        <LegalSection 
+            layout="page" 
+            title="Privacy Policy" 
+            sections={[{heading: "Data", content: {text: "We protect your data.", type: "paragraph"}}]} 
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/responsible-gambling/page.tsx

@@ -1,23 +0,0 @@
-"use client";
-
-import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import LegalSection from '@/components/legal/LegalSection';
-import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
-
-export default function ResponsibleGamblingPage() {
-  return (
-    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
-      <NavbarStyleApple navItems={[{ name: "Home", id: "/" }, { name: "Responsible Gambling", id: "/responsible-gambling" }]} brandName="Swift Haul" />
-      <div className="pt-20">
-        <LegalSection
-          layout="page"
-          title="Responsible Gambling Resources"
-          sections={[
-            { heading: "Our Commitment", content: { type: "paragraph", text: "We are committed to promoting responsible gaming practices and providing resources to ensure our platform remains safe for everyone." } },
-            { heading: "Tools for You", content: { type: "list", items: ["Set deposit limits", "Self-exclusion options", "Time management reminders", "Links to support organizations"] } }
-          ]}
-        />
-      </div>
-    </ThemeProvider>
-  );
-}

src/app/responsible-gaming/page.tsx

@@ -0,0 +1,53 @@
+"use client";
+
+import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
+import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import LegalSection from '@/components/legal/LegalSection';
+import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
+
+export default function ResponsibleGamingPage() {
+  return (
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple
+          navItems={[
+            { name: "Home", id: "/" },
+            { name: "About", id: "/about" },
+            { name: "Dashboard", id: "/dashboard" },
+            { name: "Contact", id: "/contact" },
+          ]}
+          brandName="Swift Haul"
+        />
+      </div>
+      <div id="legal" data-section="legal">
+        <LegalSection
+            layout="page"
+            title="Responsible Gaming"
+            sections={[
+                { heading: "Our Commitment", content: { text: "At Swift Haul, we prioritize safety and integrity in everything we do.", type: "paragraph" } }
+            ]}
+        />
+      </div>
+      <div id="footer" data-section="footer">
+        <FooterBaseReveal
+          logoText="Swift Haul"
+          columns={[
+            { title: "Company", items: [{ label: "About", href: "/about" }] },
+            { title: "Support", items: [{ label: "Contact", href: "/contact" }] },
+          ]}
+        />
+      </div>
+    </ThemeProvider>
+  );
+}

src/app/terms/page.tsx

@@ -1,21 +1,33 @@
 "use client";
-
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
-import LegalSection from '@/components/legal/LegalSection';
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
+import LegalSection from '@/components/legal/LegalSection';
 
 export default function TermsPage() {
   return (
-    <ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
-      <NavbarStyleApple navItems={[{ name: "Home", id: "/" }, { name: "Terms", id: "/terms" }]} brandName="Swift Haul" />
-      <div className="pt-20">
-        <LegalSection
-          layout="page"
-          title="Terms and Conditions"
-          sections={[
-            { heading: "Acceptance of Terms", content: { type: "paragraph", text: "By accessing or using our services, you agree to be bound by these terms and conditions." } },
-            { heading: "Usage Guidelines", content: { type: "numbered-list", items: ["Maintain accurate account information.", "Respect community standards.", "Do not misuse our software or logistics data."] } }
-          ]}
+    <ThemeProvider 
+      defaultButtonVariant="text-stagger" 
+      defaultTextAnimation="entrance-slide" 
+      borderRadius="rounded" 
+      contentWidth="medium" 
+      sizing="medium" 
+      background="circleGradient" 
+      cardStyle="glass-elevated" 
+      primaryButtonStyle="gradient" 
+      secondaryButtonStyle="glass" 
+      headingFontWeight="normal"
+    >
+      <div id="nav" data-section="nav">
+        <NavbarStyleApple 
+          navItems={[{name: "Home", id: "/"}, {name: "About", id: "/about"}, {name: "Dashboard", id: "/dashboard"}, {name: "Contact", id: "/contact"}]} 
+          brandName="Swift Haul" 
+        />
+      </div>
+      <div id="legal" data-section="legal">
+        <LegalSection 
+            layout="page" 
+            title="Terms of Service" 
+            sections={[{heading: "Usage", content: {text: "By using our services, you agree to these terms.", type: "paragraph"}}]} 
         />
       </div>
     </ThemeProvider>