Merge version_1 into main #1

Merged
bender merged 1 commits from version_1 into main 2026-04-17 16:10:15 +00:00

View File

@@ -20,416 +20,169 @@ export default function LandingPage() {
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Products",
id: "products",
},
{
name: "Services",
id: "features",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="BuildPro Hardware"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "hero" },
{ name: "Products", id: "products" },
{ name: "Features", id: "features" },
{ name: "Contact", id: "contact" }
]}
brandName="BuildPro Hardware"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
useInvertedBackground={false}
background={{
variant: "gradient-bars",
}}
title="Built for Quality, Designed for Durability"
description="Premium hardware solutions and building materials for professionals and homeowners alike. Excellence in every supply."
testimonials={[
{
name: "Mark Stevens",
handle: "@stevens_build",
testimonial: "BuildPro provides the most consistent materials in the industry.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-builder-man-wearing-construction-uniform-safety-helmet-blue-isolated-smiling-positive-doing-happy-thumbs-up-gesture-with-hand_141793-8567.jpg",
},
{
name: "Elena Rossi",
handle: "@rossi_arch",
testimonial: "Quality hardware is essential and this team never misses.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-helmet-looking-camera_259150-56886.jpg",
},
{
name: "John Miller",
handle: "@jm_build",
testimonial: "Fast shipping, reliable products, top-tier service.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/wind-farms-fields_23-2149154408.jpg",
},
{
name: "Sara Chen",
handle: "@chen_renovate",
testimonial: "Highly recommended for all your construction project needs.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-wood-planks_23-2148898062.jpg",
},
{
name: "David Wu",
handle: "@wu_design",
testimonial: "Professional grade gear that stands the test of time.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/skilled-carpenter-using-tools-wood_23-2148640339.jpg",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/flat-lay-mason-supplies-composition_23-2149511909.jpg"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/closeup-shot-hummer-tools-stairs-house-construction_181624-28855.jpg",
alt: "Closeup shot of a hummer and tools on the stairs during the house construction",
},
{
src: "http://img.b2bpic.net/free-photo/flat-lay-eco-friendly-cleaning-products-with-selection-brushes_23-2148818452.jpg",
alt: "Flat lay of eco-friendly cleaning products with selection of brushes",
},
{
src: "http://img.b2bpic.net/free-photo/flat-lay-gardening-composition_23-2148128785.jpg",
alt: "Flat lay gardening composition",
},
{
src: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138437.jpg",
alt: "Tools of a repairing shop",
},
{
src: "http://img.b2bpic.net/free-photo/flat-lay-mason-supplies-composition_23-2149511909.jpg",
alt: "happy customer construction",
},
]}
marqueeItems={[
{
type: "text",
text: "High Performance",
},
{
type: "text",
text: "Industrial Strength",
},
{
type: "text",
text: "Reliable Logistics",
},
{
type: "text",
text: "Professional Support",
},
{
type: "text",
text: "Premium Quality",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardTestimonial
useInvertedBackground={false}
background={{ variant: "gradient-bars" }}
title="Built for Quality, Designed for Durability"
description="Premium hardware solutions and building materials for professionals and homeowners alike. Excellence in every supply."
testimonials={[
{ name: "Mark Stevens", handle: "@stevens_build", testimonial: "BuildPro provides the most consistent materials in the industry.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-builder-man-wearing-construction-uniform-safety-helmet-blue-isolated-smiling-positive-doing-happy-thumbs-up-gesture-with-hand_141793-8567.jpg" },
{ name: "Elena Rossi", handle: "@rossi_arch", testimonial: "Quality hardware is essential and this team never misses.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-helmet-looking-camera_259150-56886.jpg" },
{ name: "John Miller", handle: "@jm_build", testimonial: "Fast shipping, reliable products, top-tier service.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/wind-farms-fields_23-2149154408.jpg" },
{ name: "Sara Chen", handle: "@chen_renovate", testimonial: "Highly recommended for all your construction project needs.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-cutting-wood-planks_23-2148898062.jpg" },
{ name: "David Wu", handle: "@wu_design", testimonial: "Professional grade gear that stands the test of time.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/skilled-carpenter-using-tools-wood_23-2148640339.jpg" }
]}
imageSrc="http://img.b2bpic.net/free-photo/flat-lay-mason-supplies-composition_23-2149511909.jpg"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/closeup-shot-hummer-tools-stairs-house-construction_181624-28855.jpg", alt: "Closeup shot of a hummer and tools on the stairs during the house construction" },
{ src: "http://img.b2bpic.net/free-photo/flat-lay-eco-friendly-cleaning-products-with-selection-brushes_23-2148818452.jpg", alt: "Flat lay of eco-friendly cleaning products with selection of brushes" },
{ src: "http://img.b2bpic.net/free-photo/flat-lay-gardening-composition_23-2148128785.jpg", alt: "Flat lay gardening composition" },
{ src: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138437.jpg", alt: "Tools of a repairing shop" },
{ src: "http://img.b2bpic.net/free-photo/flat-lay-mason-supplies-composition_23-2149511909.jpg", alt: "happy customer construction" }
]}
marqueeItems={[{ type: "text", text: "High Performance" }, { type: "text", text: "Industrial Strength" }, { type: "text", text: "Reliable Logistics" }, { type: "text", text: "Professional Support" }, { type: "text", text: "Premium Quality" }]}
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyNine
animationType="slide-up"
textboxLayout="split"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
features={[
{
title: "Premium Tools",
description: "High-performance tools for professional construction requirements.",
imageSrc: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138431.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/male-accessories-near-instruments-happy-fathers-day-words-with-ties_23-2148114420.jpg",
buttonText: "View Tools",
},
{
title: "Safety Gear",
description: "Industrial grade safety equipment to ensure site security.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-holding-heaphones_23-2148921433.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/civil-engineer-with-safety-glasses-hard-hat_53876-97921.jpg",
buttonText: "View Safety",
},
{
title: "Raw Materials",
description: "High-quality building materials for every stage of development.",
imageSrc: "http://img.b2bpic.net/free-photo/farm-honeycomb-pile_23-2148173058.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/oil-paint-tubes-painting_23-2149537657.jpg",
buttonText: "View Materials",
},
]}
title="Why Choose BuildPro?"
description="We combine extensive industry knowledge with top-quality products to empower your construction projects."
/>
</div>
<div id="features" data-section="features">
<FeatureCardTwentyNine
animationType="slide-up"
textboxLayout="split"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
features={[
{ title: "Premium Tools", description: "High-performance tools for professional construction requirements.", imageSrc: "http://img.b2bpic.net/free-photo/tools-repairing-shop_23-2148138431.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/male-accessories-near-instruments-happy-fathers-day-words-with-ties_23-2148114420.jpg", buttonText: "View Tools" },
{ title: "Safety Gear", description: "Industrial grade safety equipment to ensure site security.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-holding-heaphones_23-2148921433.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/civil-engineer-with-safety-glasses-hard-hat_53876-97921.jpg", buttonText: "View Safety" },
{ title: "Raw Materials", description: "High-quality building materials for every stage of development.", imageSrc: "http://img.b2bpic.net/free-photo/farm-honeycomb-pile_23-2148173058.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/oil-paint-tubes-painting_23-2149537657.jpg", buttonText: "View Materials" }
]}
title="Why Choose BuildPro?"
description="We combine extensive industry knowledge with top-quality products to empower your construction projects."
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Steel Hammer",
price: "$24.99",
variant: "Tool",
imageSrc: "http://img.b2bpic.net/free-photo/metal-tools_23-2147773415.jpg",
},
{
id: "p2",
name: "Power Drill",
price: "$129.50",
variant: "Equipment",
imageSrc: "http://img.b2bpic.net/free-photo/repairing-tools_1417-1783.jpg",
},
{
id: "p3",
name: "Saw Blade",
price: "$15.00",
variant: "Tool",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-worker-using-angle-grinder-metal-cutting_1163-3126.jpg",
},
{
id: "p4",
name: "Adjustable Wrench",
price: "$19.99",
variant: "Tool",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-metal-wrenches-wooden-surface_181624-19856.jpg",
},
{
id: "p5",
name: "Screw Assortment",
price: "$9.99",
variant: "Hardware",
imageSrc: "http://img.b2bpic.net/free-photo/mechanical-screws-kit_23-2148557970.jpg",
},
{
id: "p6",
name: "Pro Paint Brush",
price: "$12.00",
variant: "Accessory",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-paint-can_23-2149705353.jpg",
},
]}
title="Hardware Catalog"
description="Top-rated items in stock now."
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{ id: "p1", name: "Steel Hammer", price: "$24.99", variant: "Tool", imageSrc: "http://img.b2bpic.net/free-photo/metal-tools_23-2147773415.jpg" },
{ id: "p2", name: "Power Drill", price: "$129.50", variant: "Equipment", imageSrc: "http://img.b2bpic.net/free-photo/repairing-tools_1417-1783.jpg" },
{ id: "p3", name: "Saw Blade", price: "$15.00", variant: "Tool", imageSrc: "http://img.b2bpic.net/free-photo/side-view-worker-using-angle-grinder-metal-cutting_1163-3126.jpg" },
{ id: "p4", name: "Adjustable Wrench", price: "$19.99", variant: "Tool", imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-metal-wrenches-wooden-surface_181624-19856.jpg" },
{ id: "p5", name: "Screw Assortment", price: "$9.99", variant: "Hardware", imageSrc: "http://img.b2bpic.net/free-photo/mechanical-screws-kit_23-2148557970.jpg" },
{ id: "p6", name: "Pro Paint Brush", price: "$12.00", variant: "Accessory", imageSrc: "http://img.b2bpic.net/free-photo/top-view-paint-can_23-2149705353.jpg" }
]}
title="Hardware Catalog"
description="Top-rated items in stock now."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardTwo
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "basic",
badge: "Entry",
price: "$500+",
subtitle: "For small projects",
buttons: [
{
text: "Start",
},
],
features: [
"Free shipping",
"Bulk discount 5%",
],
},
{
id: "pro",
badge: "Pro",
price: "$5,000+",
subtitle: "For construction pros",
buttons: [
{
text: "Contact",
},
],
features: [
"Priority support",
"Bulk discount 15%",
],
},
{
id: "ent",
badge: "Enterprise",
price: "$20,000+",
subtitle: "For major sites",
buttons: [
{
text: "Inquire",
},
],
features: [
"Dedicated support",
"Bulk discount 25%",
],
},
]}
title="Membership Levels"
description="Unlock better savings for your business."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardTwo
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{ id: "basic", badge: "Entry", price: "$500+", subtitle: "For small projects", buttons: [{ text: "Start" }], features: ["Free shipping", "Bulk discount 5%"] },
{ id: "pro", badge: "Pro", price: "$5,000+", subtitle: "For construction pros", buttons: [{ text: "Contact" }], features: ["Priority support", "Bulk discount 15%"] },
{ id: "ent", badge: "Enterprise", price: "$20,000+", subtitle: "For major sites", buttons: [{ text: "Inquire" }], features: ["Dedicated support", "Bulk discount 25%"] }
]}
title="Membership Levels"
description="Unlock better savings for your business."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "15K+",
title: "Items",
description: "Available stock",
icon: CheckCircle,
},
{
id: "m2",
value: "4.8/5",
title: "Rating",
description: "Customer satisfaction",
icon: Star,
},
{
id: "m3",
value: "20+",
title: "Years",
description: "Industry experience",
icon: Award,
},
]}
title="Our Impact"
description="Proven results for major construction partners."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
metrics={[
{ id: "m1", value: "15K+", title: "Items", description: "Available stock", icon: CheckCircle },
{ id: "m2", value: "4.8/5", title: "Rating", description: "Customer satisfaction", icon: Star },
{ id: "m3", value: "20+", title: "Years", description: "Industry experience", icon: Award }
]}
title="Our Impact"
description="Proven results for major construction partners."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Mark Stevens",
role: "Builder",
company: "S&S Construction",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-builder-hardhat_1398-1730.jpg",
},
{
id: "2",
name: "Elena Rossi",
role: "Architect",
company: "Urban Designs",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/builder-works-building-site_1398-1729.jpg",
},
{
id: "3",
name: "John Miller",
role: "Foreman",
company: "Reliable Build",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-tractor-operator_1398-1880.jpg",
},
{
id: "4",
name: "Sara Chen",
role: "Engineer",
company: "City Development",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/architect-posing-while-holding-his-plans_23-2148242886.jpg",
},
{
id: "5",
name: "David Wu",
role: "Designer",
company: "Wu Studios",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/people-traveling-without-covid-worries_23-2149051626.jpg",
},
]}
title="Client Feedback"
description="See what our long-term partners say."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={true}
testimonials={[
{ id: "1", name: "Mark Stevens", role: "Builder", company: "S&S Construction", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-builder-hardhat_1398-1730.jpg" },
{ id: "2", name: "Elena Rossi", role: "Architect", company: "Urban Designs", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/builder-works-building-site_1398-1729.jpg" },
{ id: "3", name: "John Miller", role: "Foreman", company: "Reliable Build", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-tractor-operator_1398-1880.jpg" },
{ id: "4", name: "Sara Chen", role: "Engineer", company: "City Development", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/architect-posing-while-holding-his-plans_23-2148242886.jpg" },
{ id: "5", name: "David Wu", role: "Designer", company: "Wu Studios", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/people-traveling-without-covid-worries_23-2149051626.jpg" }
]}
title="Client Feedback"
description="See what our long-term partners say."
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "Do you offer bulk delivery?",
content: "Yes, we ship to all major construction sites nationwide.",
},
{
id: "f2",
title: "What is the return policy?",
content: "Returns are accepted within 30 days of purchase for unused hardware.",
},
{
id: "f3",
title: "Are you open on weekends?",
content: "Our central warehouse is open 24/7 for order processing.",
},
]}
title="Common Questions"
description="Get quick answers about our processes."
faqsAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{ id: "f1", title: "Do you offer bulk delivery?", content: "Yes, we ship to all major construction sites nationwide." },
{ id: "f2", title: "What is the return policy?", content: "Returns are accepted within 30 days of purchase for unused hardware." },
{ id: "f3", title: "Are you open on weekends?", content: "Our central warehouse is open 24/7 for order processing." }
]}
title="Common Questions"
description="Get quick answers about our processes."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "plain",
}}
tag="Support"
title="Need Bulk Supplies?"
description="Our experts are ready to assist with your custom hardware requirements."
buttons={[
{
text: "Contact Support",
href: "#",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
useInvertedBackground={true}
background={{ variant: "plain" }}
tag="Support"
title="Need Bulk Supplies?"
description="Our experts are ready to assist with your custom hardware requirements."
buttons={[{ text: "Contact Support", href: "#" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="BuildPro"
leftLink={{
text: "Privacy Policy",
href: "#",
}}
rightLink={{
text: "Terms of Service",
href: "#",
}}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="BuildPro"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);