Update src/app/page.tsx

2026-05-08 17:02:35 +00:00
parent c02f10456f
commit 0ab67c2ee3
1 changed files with 65 additions and 228 deletions
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,7 +6,7 @@ import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
 import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
 import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
-import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
+import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
 import TeamCardFive from '@/components/sections/team/TeamCardFive';
 import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
@@ -29,30 +29,16 @@ export default function LandingPage() {
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
-      <NavbarStyleFullscreen
+      <NavbarLayoutFloatingOverlay
      navItems={[
-        {
-          name: "Home",
-          id: "hero",
-        },
-        {
-          name: "About",
-          id: "about",
-        },
-        {
-          name: "Features",
-          id: "features",
-        },
-        {
-          name: "Pricing",
-          id: "pricing",
-        },
-        {
-          name: "Contact",
-          id: "contact",
-        },
+        { name: "Home", id: "hero" },
+        { name: "About", id: "about" },
+        { name: "Features", id: "features" },
+        { name: "Pricing", id: "pricing" },
+        { name: "Contact", id: "contact" },
      ]}
      brandName="SmallTown Fit"
+      button={{ text: "Join Today", href: "#pricing" }}
    />
  </div>

@@ -60,108 +46,50 @@ export default function LandingPage() {
      <HeroBillboardTestimonial
      useInvertedBackground={true}
      background={{
-        variant: "gradient-bars",
-      }}
+        variant: "gradient-bars"}}
      title="Your Neighborhood Gym"
      description="Building a stronger community, one workout at a time. Welcome to the gym that feels like home."
      testimonials={[
        {
-          name: "John D.",
-          handle: "@johnd",
-          testimonial: "I love the friendly vibe here!",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o7t0kv&_wi=1",
-          imageAlt: "local community gym interior",
-        },
+          name: "John D.",          handle: "@johnd",          testimonial: "I love the friendly vibe here!",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o7t0kv&_wi=1",          imageAlt: "local community gym interior"},
        {
-          name: "Sarah K.",
-          handle: "@sarahk",
-          testimonial: "The best gym in town, hands down.",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=iz9mkb",
-          imageAlt: "local community gym interior",
-        },
+          name: "Sarah K.",          handle: "@sarahk",          testimonial: "The best gym in town, hands down.",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=iz9mkb",          imageAlt: "local community gym interior"},
        {
-          name: "Mike R.",
-          handle: "@miker",
-          testimonial: "So convenient and always clean.",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3ro8yk",
-          imageAlt: "local community gym interior",
-        },
+          name: "Mike R.",          handle: "@miker",          testimonial: "So convenient and always clean.",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3ro8yk",          imageAlt: "local community gym interior"},
        {
-          name: "Lisa B.",
-          handle: "@lisab",
-          testimonial: "Great instructors and very welcoming environment.",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=dinv17",
-          imageAlt: "local community gym interior",
-        },
+          name: "Lisa B.",          handle: "@lisab",          testimonial: "Great instructors and very welcoming environment.",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=dinv17",          imageAlt: "local community gym interior"},
        {
-          name: "Tom W.",
-          handle: "@tomw",
-          testimonial: "Highly recommend joining this local gem.",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ighdd2",
-          imageAlt: "local community gym interior",
-        },
+          name: "Tom W.",          handle: "@tomw",          testimonial: "Highly recommend joining this local gem.",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ighdd2",          imageAlt: "local community gym interior"},
      ]}
      buttons={[
        {
-          text: "Join Today",
-          href: "#pricing",
-        },
+          text: "Join Today",          href: "#pricing"},
      ]}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o7t0kv&_wi=2"
      imageAlt="local community gym interior"
      avatars={[
        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hexjwl",
-          alt: "smiling gym member happy",
-        },
+          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hexjwl",          alt: "smiling gym member happy"},
        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=d6ezqe",
-          alt: "happy gym customer portrait",
-        },
+          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=d6ezqe",          alt: "happy gym customer portrait"},
        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gmxqdb",
-          alt: "smiling gym regular member",
-        },
+          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gmxqdb",          alt: "smiling gym regular member"},
        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ahe7k4",
-          alt: "happy gym user smiling",
-        },
+          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ahe7k4",          alt: "happy gym user smiling"},
        {
-          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zt4124",
-          alt: "healthy active senior smiling",
-        },
+          src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zt4124",          alt: "healthy active senior smiling"},
      ]}
      marqueeItems={[
-        {
-          type: "text-icon",
-          text: "Community Focused",
-          icon: Users,
-        },
-        {
-          type: "text-icon",
-          text: "All Levels Welcome",
-          icon: Activity,
-        },
-        {
-          type: "text-icon",
-          text: "Open 24/7",
-          icon: Clock,
-        },
-        {
-          type: "text-icon",
-          text: "Modern Equipment",
-          icon: Zap,
-        },
-        {
-          type: "text-icon",
-          text: "Expert Guidance",
-          icon: Award,
-        },
+        { type: "text-icon", text: "Community Focused", icon: Users },
+        { type: "text-icon", text: "All Levels Welcome", icon: Activity },
+        { type: "text-icon", text: "Open 24/7", icon: Clock },
+        { type: "text-icon", text: "Modern Equipment", icon: Zap },
+        { type: "text-icon", text: "Expert Guidance", icon: Award },
      ]}
    />
  </div>
@@ -172,8 +100,7 @@ export default function LandingPage() {
      title="Local Roots, Global Quality"
      buttons={[
        {
-          text: "Learn More",
-        },
+          text: "Learn More"},
      ]}
    />
  </div>
@@ -185,26 +112,11 @@ export default function LandingPage() {
      useInvertedBackground={true}
      features={[
        {
-          id: "f1",
-          title: "Strength Training",
-          subtitle: "Top tier equipment",
-          category: "Weights",
-          value: "24/7 Access",
-        },
+          id: "f1",          title: "Strength Training",          subtitle: "Top tier equipment",          category: "Weights",          value: "24/7 Access"},
        {
-          id: "f2",
-          title: "Cardio Zone",
-          subtitle: "Modern endurance gear",
-          category: "Cardio",
-          value: "Unlimited",
-        },
+          id: "f2",          title: "Cardio Zone",          subtitle: "Modern endurance gear",          category: "Cardio",          value: "Unlimited"},
        {
-          id: "f3",
-          title: "Wellness Studio",
-          subtitle: "Yoga and mobility",
-          category: "Classes",
-          value: "Included",
-        },
+          id: "f3",          title: "Wellness Studio",          subtitle: "Yoga and mobility",          category: "Classes",          value: "Included"},
      ]}
      title="Everything You Need"
      description="Comprehensive facilities for all fitness levels."
@@ -218,33 +130,20 @@ export default function LandingPage() {
      useInvertedBackground={false}
      plans={[
        {
-          id: "p1",
-          price: "$29/mo",
-          name: "Basic",
-          buttons: [
+          id: "p1",          price: "$29/mo",          name: "Basic",          buttons: [
            {
-              text: "Sign Up",
-            },
+              text: "Sign Up"},
          ],
          features: [
-            "Gym access",
-            "Free weights",
-          ],
+            "Gym access",            "Free weights"],
        },
        {
-          id: "p2",
-          price: "$49/mo",
-          name: "Pro",
-          buttons: [
+          id: "p2",          price: "$49/mo",          name: "Pro",          buttons: [
            {
-              text: "Sign Up",
-            },
+              text: "Sign Up"},
          ],
          features: [
-            "All basic features",
-            "Classes included",
-            "Guest pass",
-          ],
+            "All basic features",            "Classes included",            "Guest pass"],
        },
      ]}
      title="Membership Plans"
@@ -259,23 +158,11 @@ export default function LandingPage() {
      useInvertedBackground={true}
      team={[
        {
-          id: "t1",
-          name: "Alex Smith",
-          role: "Head Coach",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mbs5x8",
-        },
+          id: "t1",          name: "Alex Smith",          role: "Head Coach",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=mbs5x8"},
        {
-          id: "t2",
-          name: "Jordan P.",
-          role: "Instructor",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7ks78u",
-        },
+          id: "t2",          name: "Jordan P.",          role: "Instructor",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7ks78u"},
        {
-          id: "t3",
-          name: "Casey L.",
-          role: "Trainer",
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=m9ry5i",
-        },
+          id: "t3",          name: "Casey L.",          role: "Trainer",          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=m9ry5i"},
      ]}
      title="Our Coaches"
      description="Experts dedicated to your success."
@@ -289,59 +176,25 @@ export default function LandingPage() {
      useInvertedBackground={false}
      testimonials={[
        {
-          id: "1",
-          name: "Sarah",
-          role: "Local Member",
-          company: "Small Town",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hexjwl",
-        },
+          id: "1",          name: "Sarah",          role: "Local Member",          company: "Small Town",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=hexjwl"},
        {
-          id: "2",
-          name: "Mark",
-          role: "Member",
-          company: "Small Town",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=d6ezqe",
-        },
+          id: "2",          name: "Mark",          role: "Member",          company: "Small Town",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=d6ezqe"},
        {
-          id: "3",
-          name: "Elena",
-          role: "Member",
-          company: "Small Town",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gmxqdb",
-        },
+          id: "3",          name: "Elena",          role: "Member",          company: "Small Town",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=gmxqdb"},
        {
-          id: "4",
-          name: "Paul",
-          role: "Member",
-          company: "Small Town",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ahe7k4",
-        },
+          id: "4",          name: "Paul",          role: "Member",          company: "Small Town",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ahe7k4"},
        {
-          id: "5",
-          name: "Julie",
-          role: "Member",
-          company: "Small Town",
-          rating: 5,
-          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zt4124",
-        },
+          id: "5",          name: "Julie",          role: "Member",          company: "Small Town",          rating: 5,
+          imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zt4124"},
      ]}
      kpiItems={[
-        {
-          value: "500+",
-          label: "Members",
-        },
-        {
-          value: "15+",
-          label: "Years",
-        },
-        {
-          value: "100%",
-          label: "Happy",
-        },
+        { value: "500+", label: "Members" },
+        { value: "15+", label: "Years" },
+        { value: "100%", label: "Happy" },
      ]}
      title="Community Love"
      description="Hear what our members think about the gym."
@@ -352,15 +205,13 @@ export default function LandingPage() {
      <ContactCTA
      useInvertedBackground={true}
      background={{
-        variant: "plain",
-      }}
+        variant: "plain"}}
      tag="Contact Us"
      title="Ready to Start?"
      description="Stop by for a tour or sign up online."
      buttons={[
        {
-          text: "Get in Touch",
-        },
+          text: "Get in Touch"},
      ]}
    />
  </div>
@@ -370,29 +221,15 @@ export default function LandingPage() {
      logoText="SmallTown Fit"
      columns={[
        {
-          title: "Company",
-          items: [
-            {
-              label: "About",
-              href: "#about",
-            },
-            {
-              label: "Team",
-              href: "#team",
-            },
+          title: "Company",          items: [
+            { label: "About", href: "#about" },
+            { label: "Team", href: "#team" },
          ],
        },
        {
-          title: "Services",
-          items: [
-            {
-              label: "Membership",
-              href: "#pricing",
-            },
-            {
-              label: "Classes",
-              href: "#features",
-            },
+          title: "Services",          items: [
+            { label: "Membership", href: "#pricing" },
+            { label: "Classes", href: "#features" },
          ],
        },
      ]}
@@ -401,4 +238,4 @@ export default function LandingPage() {
      </ReactLenis>
    </ThemeProvider>
  );
-}
+}