Merge version_2_1781414332488 into main #3

Merged
bender merged 1 commits from version_2_1781414332488 into main 2026-06-14 05:20:54 +00:00
10 changed files with 297 additions and 188 deletions

View File

@@ -1,4 +1,11 @@
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700;900&display=swap');
a[href="/"] {
font-family: 'Orbitron', sans-serif !important;
font-weight: 900 !important;
letter-spacing: 0.1em;
}
@import "tailwindcss";
@import "./styles/masks.css";
@import "./styles/animations.css";

View File

@@ -1,200 +1,36 @@
import AboutTextSplit from '@/components/sections/about/AboutTextSplit';
import ContactCta from '@/components/sections/contact/ContactCta';
import FaqTabbedAccordion from '@/components/sections/faq/FaqTabbedAccordion';
import FeaturesBento from '@/components/sections/features/FeaturesBento';
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
import HeroBrand from '@/components/sections/hero/HeroBrand';
import MetricsIconCards from '@/components/sections/metrics/MetricsIconCards';
import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
import { Droplets, Shield, Wind, Zap } from "lucide-react";
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
// AUTO-GENERATED shell by per-section-migrate.
// Section bodies live in ./<PageBase>/sections/<X>.tsx. Edit the section
// files directly. Non-block content (wrappers, non-inlinable sections) is
// preserved inline; extracted section blocks become <XSection/> refs.
export default function HomePage() {
import React from 'react';
import HeroSection from './HomePage/sections/Hero';
import AboutSection from './HomePage/sections/About';
import ProductsSection from './HomePage/sections/Products';
import FeaturesSection from './HomePage/sections/Features';
import MetricsSection from './HomePage/sections/Metrics';
import TestimonialsSection from './HomePage/sections/Testimonials';
import FaqSection from './HomePage/sections/Faq';
import ContactSection from './HomePage/sections/Contact';
export default function HomePage(): React.JSX.Element {
return (
<>
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroBrand
brand="DRVN"
description="Engineered for speed. Built for endurance. Discover high-performance activewear designed to push your limits."
primaryButton={{
text: "Shop Collection", href: "#products"}}
secondaryButton={{
text: "Our Mission", href: "#about"}}
imageSrc="http://img.b2bpic.net/free-photo/athlete-runner-prepare-run-from-crouch-start_176420-16476.jpg"
/>
</SectionErrorBoundary>
</div>
<>
<HeroSection />
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<AboutTextSplit
title="Engineered for the Unstoppable"
descriptions={[
"At DRVN, we believe your gear should be as driven as you are. We combine innovative textiles with ergonomic engineering to create apparel that moves with you, never against you.", "Born on the track and refined in the lab, our activewear is designed to handle the most punishing training conditions, keeping you comfortable, dry, and focused on the finish line."]}
primaryButton={{
text: "View Performance", href: "#features"}}
/>
</SectionErrorBoundary>
</div>
<AboutSection />
<div id="products" data-section="products">
<SectionErrorBoundary name="products">
<FeaturesImageBento
tag="Essential Performance"
title="Gear Up"
description="High-performance apparel designed for every stage of your run."
items={[
{
title: "Precision Tights", description: "Ergonomic fit, maximum compression.", imageSrc: "http://img.b2bpic.net/free-photo/black-background-with-rope_23-2149872563.jpg"},
{
title: "Windbreaker X", description: "Breathable, lightweight, windproof.", imageSrc: "http://img.b2bpic.net/free-photo/woman-showing-salute-gesture-sport-suit-looking-joyful-front-view_176474-39184.jpg"},
{
title: "Velocity Runners", description: "Max energy return, featherweight.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-futuristic-sneakers-presentation_23-2151005715.jpg"},
{
title: "Core Compression", description: "Moisture-wicking, seamless build.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-training-gym_23-2150340832.jpg"},
{
title: "Sprint Shorts", description: "Designed for freedom of movement.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-tennis-player-front-net_23-2147661787.jpg"},
{
title: "Visibility Pack", description: "Stay safe, stay seen.", imageSrc: "http://img.b2bpic.net/free-photo/tired-female-athlete-taking-short-break_329181-6241.jpg"},
{
title: "Performance Cap", description: "Lightweight comfort, secure fit.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-sport-arrangement_23-2149006363.jpg"},
]}
/>
</SectionErrorBoundary>
</div>
<ProductsSection />
<div id="features" data-section="features">
<SectionErrorBoundary name="features">
<FeaturesBento
tag="Why DRVN"
title="Technical Innovation"
description="Every fiber is tested to ensure peak performance."
features={[
{
title: "Climate-Adapt Fabric", description: "Automatically adjusts to your body temperature.", bentoComponent: "info-card-marquee", infoCards: [
{
icon: Zap,
label: "Temp Regulation", value: "20% better"},
{
icon: Droplets,
label: "Sweat Management", value: "Fast-Dry"},
{
icon: Shield,
label: "Durability", value: "Ultra-Tough"},
],
},
{
title: "Motion-Lock Seams", description: "Frictionless construction for long distance comfort.", bentoComponent: "checklist-timeline", heading: "Construction Standards", subheading: "Built for thousands of miles", checklistItems: [
{
label: "Seamless Stitching", detail: "Zero-chafing guarantee"},
{
label: "Ergonomic Mapping", detail: "Body-contoured fit"},
{
label: "Reflective Integration", detail: "360-degree visibility"},
],
completedLabel: "Certified"},
{
title: "Performance Analytics", description: "Sync with your fitness wearable for bio-feedback optimization.", bentoComponent: "media-stack", mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/fitness-girl-gym_1157-15953.jpg"},
{
imageSrc: "http://img.b2bpic.net/free-photo/athlete-looking-distance_23-2147618003.jpg"},
{
imageSrc: "http://img.b2bpic.net/free-photo/still-life-composition-sport-elements_23-2149006302.jpg"},
],
},
]}
/>
</SectionErrorBoundary>
</div>
<FeaturesSection />
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsIconCards
tag="Performance Stats"
title="The Numbers Behind the Performance"
description="Validated through intense testing cycles."
metrics={[
{
icon: Zap,
title: "Energy Return", value: "98%"},
{
icon: Droplets,
title: "Moisture Wicking", value: "4x faster"},
{
icon: Shield,
title: "Tensile Strength", value: "15kg load"},
{
icon: Wind,
title: "Aerodynamic", value: "Optimized"},
]}
/>
</SectionErrorBoundary>
</div>
<MetricsSection />
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialColumnMarqueeCards
tag="Trusted by Runners"
title="Built for Every Milestone"
description="Join the community of athletes who trust DRVN for their PRs."
testimonials={[
{
name: "Elena R.", role: "Marathoner", quote: "The comfort on 20-mile runs is unparalleled.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-standing-park-with-earphones-tablet_1157-30676.jpg"},
{
name: "Marcus S.", role: "Triathlete", quote: "Stays dry even in the heaviest downpours.", imageSrc: "http://img.b2bpic.net/free-photo/man-with-beanie_23-2147617976.jpg"},
{
name: "Sarah J.", role: "Ultra Runner", quote: "No chafing, perfect fit. My new favorite gear.", imageSrc: "http://img.b2bpic.net/free-photo/young-adult-doing-indoor-sport-gym_23-2149205541.jpg"},
{
name: "David W.", role: "Sprinter", quote: "Explosive performance feel.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-male-basketball-player_23-2151098141.jpg"},
{
name: "Chloe T.", role: "Daily Runner", quote: "I feel faster just putting these on.", imageSrc: "http://img.b2bpic.net/free-photo/horizontal-view-male-athlete-dressed-activewear-has-cardio-running-up-stairs-prepares-jogging-long-distance-makes-steps-jumps-high-african-american-man-t-shirt-leggings-trainers_273609-29686.jpg"},
]}
/>
</SectionErrorBoundary>
</div>
<TestimonialsSection />
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqTabbedAccordion
tag="Support"
title="Questions Answered"
description="Everything you need to know about DRVN apparel."
categories={[
{
name: "General", items: [
{
question: "What is the return policy?", answer: "30 days, no questions asked."},
{
question: "Are your clothes sustainable?", answer: "Yes, we use recycled high-performance fibers."},
],
},
{
name: "Shipping", items: [
{
question: "Do you ship internationally?", answer: "We ship to over 50 countries worldwide."},
{
question: "When will I receive my order?", answer: "Typically within 3-5 business days."},
],
},
]}
/>
</SectionErrorBoundary>
</div>
<FaqSection />
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Join the DRVN Team"
text="Ready to push your limits? Start your journey with DRVN activewear."
primaryButton={{
text: "Get Started", href: "#products"}}
secondaryButton={{
text: "Contact Support", href: "#faq"}}
/>
</SectionErrorBoundary>
</div>
<ContactSection />
</>
);
}

View File

@@ -0,0 +1,22 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "about" section.
import React from 'react';
import AboutTextSplit from '@/components/sections/about/AboutTextSplit';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function AboutSection(): React.JSX.Element {
return (
<div id="about" data-section="about">
<SectionErrorBoundary name="about">
<AboutTextSplit
title="Engineered for the Unstoppable"
descriptions={[
"At DRVN, we believe your gear should be as driven as you are. We combine innovative textiles with ergonomic engineering to create apparel that moves with you, never against you.", "Born on the track and refined in the lab, our activewear is designed to handle the most punishing training conditions, keeping you comfortable, dry, and focused on the finish line."]}
primaryButton={{
text: "View Performance", href: "#features"}}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,23 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "contact" section.
import React from 'react';
import ContactCta from '@/components/sections/contact/ContactCta';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ContactSection(): React.JSX.Element {
return (
<div id="contact" data-section="contact">
<SectionErrorBoundary name="contact">
<ContactCta
tag="Join the DRVN Team"
text="Ready to push your limits? Start your journey with DRVN activewear."
primaryButton={{
text: "Get Started", href: "#products"}}
secondaryButton={{
text: "Contact Support", href: "#faq"}}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,38 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "faq" section.
import React from 'react';
import FaqTabbedAccordion from '@/components/sections/faq/FaqTabbedAccordion';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function FaqSection(): React.JSX.Element {
return (
<div id="faq" data-section="faq">
<SectionErrorBoundary name="faq">
<FaqTabbedAccordion
tag="Support"
title="Questions Answered"
description="Everything you need to know about DRVN apparel."
categories={[
{
name: "General", items: [
{
question: "What is the return policy?", answer: "30 days, no questions asked."},
{
question: "Are your clothes sustainable?", answer: "Yes, we use recycled high-performance fibers."},
],
},
{
name: "Shipping", items: [
{
question: "Do you ship internationally?", answer: "We ship to over 50 countries worldwide."},
{
question: "When will I receive my order?", answer: "Typically within 3-5 business days."},
],
},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,56 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "features" section.
import React from 'react';
import FeaturesBento from '@/components/sections/features/FeaturesBento';
import { Droplets, Shield, Wind, Zap } from "lucide-react";
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function FeaturesSection(): React.JSX.Element {
return (
<div id="features" data-section="features">
<SectionErrorBoundary name="features">
<FeaturesBento
tag="Why DRVN"
title="Technical Innovation"
description="Every fiber is tested to ensure peak performance."
features={[
{
title: "Climate-Adapt Fabric", description: "Automatically adjusts to your body temperature.", bentoComponent: "info-card-marquee", infoCards: [
{
icon: Zap,
label: "Temp Regulation", value: "20% better"},
{
icon: Droplets,
label: "Sweat Management", value: "Fast-Dry"},
{
icon: Shield,
label: "Durability", value: "Ultra-Tough"},
],
},
{
title: "Motion-Lock Seams", description: "Frictionless construction for long distance comfort.", bentoComponent: "checklist-timeline", heading: "Construction Standards", subheading: "Built for thousands of miles", checklistItems: [
{
label: "Seamless Stitching", detail: "Zero-chafing guarantee"},
{
label: "Ergonomic Mapping", detail: "Body-contoured fit"},
{
label: "Reflective Integration", detail: "360-degree visibility"},
],
completedLabel: "Certified"},
{
title: "Performance Analytics", description: "Sync with your fitness wearable for bio-feedback optimization.", bentoComponent: "media-stack", mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/fitness-girl-gym_1157-15953.jpg"},
{
imageSrc: "http://img.b2bpic.net/free-photo/athlete-looking-distance_23-2147618003.jpg"},
{
imageSrc: "http://img.b2bpic.net/free-photo/still-life-composition-sport-elements_23-2149006302.jpg"},
],
},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,24 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "hero" section.
import React from 'react';
import HeroBrand from '@/components/sections/hero/HeroBrand';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function HeroSection(): React.JSX.Element {
return (
<div id="hero" data-section="hero">
<SectionErrorBoundary name="hero">
<HeroBrand
brand="DRVN"
description="Engineered for speed. Built for endurance. Discover high-performance activewear designed to push your limits."
primaryButton={{
text: "Shop Collection", href: "#products"}}
secondaryButton={{
text: "Our Mission", href: "#about"}}
imageSrc="http://img.b2bpic.net/free-photo/athlete-runner-prepare-run-from-crouch-start_176420-16476.jpg"
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,35 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "metrics" section.
import React from 'react';
import MetricsIconCards from '@/components/sections/metrics/MetricsIconCards';
import { Droplets, Shield, Wind, Zap } from "lucide-react";
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function MetricsSection(): React.JSX.Element {
return (
<div id="metrics" data-section="metrics">
<SectionErrorBoundary name="metrics">
<MetricsIconCards
tag="Performance Stats"
title="The Numbers Behind the Performance"
description="Validated through intense testing cycles."
metrics={[
{
icon: Zap,
title: "Energy Return", value: "98%"},
{
icon: Droplets,
title: "Moisture Wicking", value: "4x faster"},
{
icon: Shield,
title: "Tensile Strength", value: "15kg load"},
{
icon: Wind,
title: "Aerodynamic", value: "Optimized"},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,36 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "products" section.
import React from 'react';
import FeaturesImageBento from '@/components/sections/features/FeaturesImageBento';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function ProductsSection(): React.JSX.Element {
return (
<div id="products" data-section="products">
<SectionErrorBoundary name="products">
<FeaturesImageBento
tag="Essential Performance"
title="Gear Up"
description="High-performance apparel designed for every stage of your run."
items={[
{
title: "Precision Tights", description: "Ergonomic fit, maximum compression.", imageSrc: "http://img.b2bpic.net/free-photo/black-background-with-rope_23-2149872563.jpg"},
{
title: "Windbreaker X", description: "Breathable, lightweight, windproof.", imageSrc: "http://img.b2bpic.net/free-photo/woman-showing-salute-gesture-sport-suit-looking-joyful-front-view_176474-39184.jpg"},
{
title: "Velocity Runners", description: "Max energy return, featherweight.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-futuristic-sneakers-presentation_23-2151005715.jpg"},
{
title: "Core Compression", description: "Moisture-wicking, seamless build.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-training-gym_23-2150340832.jpg"},
{
title: "Sprint Shorts", description: "Designed for freedom of movement.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-tennis-player-front-net_23-2147661787.jpg"},
{
title: "Visibility Pack", description: "Stay safe, stay seen.", imageSrc: "http://img.b2bpic.net/free-photo/tired-female-athlete-taking-short-break_329181-6241.jpg"},
{
title: "Performance Cap", description: "Lightweight comfort, secure fit.", imageSrc: "http://img.b2bpic.net/free-photo/still-life-sport-arrangement_23-2149006363.jpg"},
]}
/>
</SectionErrorBoundary>
</div>
);
}

View File

@@ -0,0 +1,32 @@
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
// file as the canonical source for the "testimonials" section.
import React from 'react';
import TestimonialColumnMarqueeCards from '@/components/sections/testimonial/TestimonialColumnMarqueeCards';
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
export default function TestimonialsSection(): React.JSX.Element {
return (
<div id="testimonials" data-section="testimonials">
<SectionErrorBoundary name="testimonials">
<TestimonialColumnMarqueeCards
tag="Trusted by Runners"
title="Built for Every Milestone"
description="Join the community of athletes who trust DRVN for their PRs."
testimonials={[
{
name: "Elena R.", role: "Marathoner", quote: "The comfort on 20-mile runs is unparalleled.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-standing-park-with-earphones-tablet_1157-30676.jpg"},
{
name: "Marcus S.", role: "Triathlete", quote: "Stays dry even in the heaviest downpours.", imageSrc: "http://img.b2bpic.net/free-photo/man-with-beanie_23-2147617976.jpg"},
{
name: "Sarah J.", role: "Ultra Runner", quote: "No chafing, perfect fit. My new favorite gear.", imageSrc: "http://img.b2bpic.net/free-photo/young-adult-doing-indoor-sport-gym_23-2149205541.jpg"},
{
name: "David W.", role: "Sprinter", quote: "Explosive performance feel.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-male-basketball-player_23-2151098141.jpg"},
{
name: "Chloe T.", role: "Daily Runner", quote: "I feel faster just putting these on.", imageSrc: "http://img.b2bpic.net/free-photo/horizontal-view-male-athlete-dressed-activewear-has-cardio-running-up-stairs-prepares-jogging-long-distance-makes-steps-jumps-high-african-american-man-t-shirt-leggings-trainers_273609-29686.jpg"},
]}
/>
</SectionErrorBoundary>
</div>
);
}