Merge version_1 into main #2
353
src/app/page.tsx
353
src/app/page.tsx
@@ -27,264 +27,115 @@ export default function LandingPage() {
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Hydraulix"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Hydraulix"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Your trusted plumbing and heating expert, locally"
|
||||
description="Hydraulix combines premium product selection, professional guidance, and fast fulfillment—whether you're a homeowner, contractor, or developer. We don't just sell; we solve your heating and sanitary installation challenges with care and expertise."
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore our solutions",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-friends-hostel_23-2150518179.jpg?_wi=1",
|
||||
imageAlt: "Plumbing supply store display",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mechanical-screws-kit_23-2148557970.jpg?_wi=1",
|
||||
imageAlt: "High quality valves",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/steel-pipelines-cables-factory-interior-as-nuclear-industry-background-concept_645730-823.jpg?_wi=1",
|
||||
imageAlt: "Heating supply warehouse",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-shaking-hands_23-2148920604.jpg",
|
||||
imageAlt: "Expert consultation",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-finger-using-vitroceramic-app_23-2148994136.jpg?_wi=1",
|
||||
imageAlt: "Smart heating controls",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/team-woodworkers-assembly-shop-using-sandpaper-spindle-moulder_482257-89270.jpg",
|
||||
imageAlt: "Precision installation",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Your trusted plumbing and heating expert, locally"
|
||||
description="Hydraulix combines premium product selection, professional guidance, and fast fulfillment—whether you're a homeowner, contractor, or developer. We don't just sell; we solve your heating and sanitary installation challenges with care and expertise."
|
||||
buttons={[{ text: "Explore our solutions", href: "#products" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-friends-hostel_23-2150518179.jpg", imageAlt: "Plumbing supply store display" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/mechanical-screws-kit_23-2148557970.jpg", imageAlt: "High quality valves" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/steel-pipelines-cables-factory-interior-as-nuclear-industry-background-concept_645730-823.jpg", imageAlt: "Heating supply warehouse" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-shaking-hands_23-2148920604.jpg", imageAlt: "Expert consultation" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-finger-using-vitroceramic-app_23-2148994136.jpg", imageAlt: "Smart heating controls" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/team-woodworkers-assembly-shop-using-sandpaper-spindle-moulder_482257-89270.jpg", imageAlt: "Precision installation" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="Expertise you can rely on"
|
||||
description={[
|
||||
"At Hydraulix, we understand that every project—from home renovations to new large-scale developments—needs a partner who delivers on time and with technical precision.",
|
||||
"Our team of industry experts provides deep product knowledge and personalized guidance to ensure your plumbing and heating systems operate efficiently. We prioritize local availability and professional integrity, ensuring you always get the right parts, fast.",
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="Expertise you can rely on"
|
||||
description={[
|
||||
"At Hydraulix, we understand that every project—from home renovations to new large-scale developments—needs a partner who delivers on time and with technical precision.", "Our team of industry experts provides deep product knowledge and personalized guidance to ensure your plumbing and heating systems operate efficiently. We prioritize local availability and professional integrity, ensuring you always get the right parts, fast."
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
icon: CheckCircle,
|
||||
title: "Premium Selection",
|
||||
description: "High-quality products for heating, plumbing, and sanitary systems from leading manufacturers.",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Rapid Fulfillment",
|
||||
description: "Fast stock availability and reliable delivery to keep your projects moving on schedule.",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Expert Guidance",
|
||||
description: "Technical consultation and support for professionals and homeowners alike.",
|
||||
},
|
||||
]}
|
||||
title="Why choose Hydraulix?"
|
||||
description="We are dedicated to providing the best supplies and support to our local community."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ icon: CheckCircle, title: "Premium Selection", description: "High-quality products for heating, plumbing, and sanitary systems from leading manufacturers." },
|
||||
{ icon: Zap, title: "Rapid Fulfillment", description: "Fast stock availability and reliable delivery to keep your projects moving on schedule." },
|
||||
{ icon: Shield, title: "Expert Guidance", description: "Technical consultation and support for professionals and homeowners alike." }
|
||||
]}
|
||||
title="Why choose Hydraulix?"
|
||||
description="We are dedicated to providing the best supplies and support to our local community."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "HydraulicPro",
|
||||
name: "High-Efficiency Boiler",
|
||||
price: "€1,200",
|
||||
rating: 5,
|
||||
reviewCount: "24",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/steel-pipelines-cables-factory-interior-as-nuclear-industry-background-concept_645730-823.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "FlowMaster",
|
||||
name: "Smart Thermostat",
|
||||
price: "€250",
|
||||
rating: 5,
|
||||
reviewCount: "18",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-finger-using-vitroceramic-app_23-2148994136.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "PipeTech",
|
||||
name: "Professional Tool Kit",
|
||||
price: "€450",
|
||||
rating: 4,
|
||||
reviewCount: "32",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-friends-hostel_23-2150518179.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
brand: "WaterGuard",
|
||||
name: "Advanced Valve System",
|
||||
price: "€120",
|
||||
rating: 5,
|
||||
reviewCount: "45",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mechanical-screws-kit_23-2148557970.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Top-tier Supplies"
|
||||
description="Browse our catalog of professional-grade plumbing and heating hardware."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", brand: "HydraulicPro", name: "High-Efficiency Boiler", price: "€1,200", rating: 5, reviewCount: "24", imageSrc: "http://img.b2bpic.net/free-photo/steel-pipelines-cables-factory-interior-as-nuclear-industry-background-concept_645730-823.jpg" },
|
||||
{ id: "2", brand: "FlowMaster", name: "Smart Thermostat", price: "€250", rating: 5, reviewCount: "18", imageSrc: "http://img.b2bpic.net/free-photo/close-up-finger-using-vitroceramic-app_23-2148994136.jpg" },
|
||||
{ id: "3", brand: "PipeTech", name: "Professional Tool Kit", price: "€450", rating: 4, reviewCount: "32", imageSrc: "http://img.b2bpic.net/free-photo/young-friends-hostel_23-2150518179.jpg" },
|
||||
{ id: "4", brand: "WaterGuard", name: "Advanced Valve System", price: "€120", rating: 5, reviewCount: "45", imageSrc: "http://img.b2bpic.net/free-photo/mechanical-screws-kit_23-2148557970.jpg" }
|
||||
]}
|
||||
title="Top-tier Supplies"
|
||||
description="Browse our catalog of professional-grade plumbing and heating hardware."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
textboxLayout="split-description"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Johnson",
|
||||
role: "Homeowner",
|
||||
company: "Local Residence",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-workers-high-five_23-2149366624.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark Stevens",
|
||||
role: "Contractor",
|
||||
company: "Stevens Plumbing",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-worker-construction-wearing-protection-gear_23-2148784062.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Anna Kowalska",
|
||||
role: "Developer",
|
||||
company: "Urban Builds",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/day-office-travel-agency_23-2150769939.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Petro",
|
||||
role: "HVAC Pro",
|
||||
company: "Tech Heat",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-redhead-model-man-sits-floor-room-with-loft-interior_613910-20181.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Elena Ross",
|
||||
role: "Project Manager",
|
||||
company: "BuildRight",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-redhead-model-man-sits-floor-room-with-loft-interior_613910-20181.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Trusted by the region"
|
||||
description="What our customers are saying about working with Hydraulix."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Johnson", role: "Homeowner", company: "Local Residence", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-workers-high-five_23-2149366624.jpg" },
|
||||
{ id: "2", name: "Mark Stevens", role: "Contractor", company: "Stevens Plumbing", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/male-worker-construction-wearing-protection-gear_23-2148784062.jpg" },
|
||||
{ id: "3", name: "Anna Kowalska", role: "Developer", company: "Urban Builds", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/day-office-travel-agency_23-2150769939.jpg" },
|
||||
{ id: "4", name: "David Petro", role: "HVAC Pro", company: "Tech Heat", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-redhead-model-man-sits-floor-room-with-loft-interior_613910-20181.jpg" },
|
||||
{ id: "5", name: "Elena Ross", role: "Project Manager", company: "BuildRight", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-redhead-model-man-sits-floor-room-with-loft-interior_613910-20181.jpg" }
|
||||
]}
|
||||
title="Trusted by the region"
|
||||
description="What our customers are saying about working with Hydraulix."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Get in touch"
|
||||
title="Ready to get started?"
|
||||
description="Whether you need bulk supply for your next project or expert guidance for a renovation, we're here to help."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact our team",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Get in touch"
|
||||
title="Ready to get started?"
|
||||
description="Whether you need bulk supply for your next project or expert guidance for a renovation, we're here to help."
|
||||
buttons={[{ text: "Contact our team", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Catalog",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Hydraulix"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{ items: [{ label: "About Us", href: "#about" }, { label: "Catalog", href: "#products" }, { label: "Contact", href: "#contact" }] },
|
||||
{ items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
logoText="Hydraulix"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user