Merge version_1 into main #2
@@ -22,117 +22,42 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "/projects",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Dutchman Contracting"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Projects", id: "/projects" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Dutchman Contracting"
|
||||
button={{ text: "Contact Us", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about-body" data-section="about-body">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Rooted in Craft"
|
||||
description="Since our founding, we have focused on building structures that last generations."
|
||||
metrics={[
|
||||
{
|
||||
value: "20+",
|
||||
title: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "150+",
|
||||
title: "Custom Builds",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineers-with-helmets-standing-by-factory_1157-35526.jpg?_wi=2"
|
||||
/>
|
||||
</div>
|
||||
<div id="about-body" data-section="about-body">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Rooted in Craft"
|
||||
description="Since our founding, we have focused on building structures that last generations."
|
||||
metrics={[{ value: "20+", title: "Years Experience" }, { value: "150+", title: "Custom Builds" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineers-with-helmets-standing-by-factory_1157-35526.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Our Philosophy"
|
||||
description="Integrity is the bedrock of every foundation we lay."
|
||||
features={[
|
||||
{
|
||||
title: "Unmatched Quality",
|
||||
description: "Only the finest materials and skilled labor.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg?_wi=3",
|
||||
},
|
||||
{
|
||||
title: "Transparent Process",
|
||||
description: "Clear communication from inception to completion.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg?_wi=3",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Our Philosophy"
|
||||
description="Integrity is the bedrock of every foundation we lay."
|
||||
features={[{ title: "Unmatched Quality", description: "Only the finest materials and skilled labor.", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg" }, { title: "Transparent Process", description: "Clear communication from inception to completion.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg?_wi=3"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Projects",
|
||||
href: "/projects",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Projects", href: "/projects" }] }, { title: "Company", items: [{ label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }, { label: "Privacy", href: "#" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
@@ -21,102 +21,43 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "/projects",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Dutchman Contracting"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Projects", id: "/projects" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Dutchman Contracting"
|
||||
button={{ text: "Contact Us", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact-body" data-section="contact-body">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Inquiry"
|
||||
title="Start Your Project"
|
||||
description="Let us build your vision. Reach out to schedule a private consultation."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg?_wi=6"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact-body" data-section="contact-body">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Inquiry"
|
||||
title="Start Your Project"
|
||||
description="Let us build your vision. Reach out to schedule a private consultation."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Visit Us"
|
||||
title="Our Studio"
|
||||
description="Come visit our design office to discuss your project in person."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineers-with-helmets-standing-by-factory_1157-35526.jpg?_wi=3"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Visit Us"
|
||||
title="Our Studio"
|
||||
description="Come visit our design office to discuss your project in person."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineers-with-helmets-standing-by-factory_1157-35526.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg?_wi=7"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Projects",
|
||||
href: "/projects",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Projects", href: "/projects" }] }, { title: "Company", items: [{ label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }, { label: "Privacy", href: "#" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
378
src/app/page.tsx
378
src/app/page.tsx
@@ -25,320 +25,82 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "/projects",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Dutchman Contracting"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Projects", id: "/projects" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Dutchman Contracting"
|
||||
button={{ text: "Contact Us", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Building Legacies Through Craft"
|
||||
description="Dutchman Contracting delivers unparalleled precision and architectural integrity for the most discerning residential projects. Experience excellence in design and build."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg?_wi=1"
|
||||
imageAlt="High-end construction project site"
|
||||
mediaAnimation="blur-reveal"
|
||||
buttons={[
|
||||
{
|
||||
text: "View Our Projects",
|
||||
href: "/projects",
|
||||
},
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "/contact",
|
||||
},
|
||||
]}
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg",
|
||||
alt: "Client",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-side-view-engineer-architect-supervising-construction_23-2148233789.jpg",
|
||||
alt: "Client",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-with-blueprint-copy-space_23-2148269819.jpg",
|
||||
alt: "Client",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-woman-with-long-blonde-hair-shorts-handsome-joyful-guy-bed-smiling-with-tablet-modern-apartment-lovely-couple-having-fun-true-emotions_197531-1600.jpg",
|
||||
alt: "Client",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/black-man-showing-blueprint-woman_23-2147807971.jpg",
|
||||
alt: "Client",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by over 150+ luxury homeowners"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Precision Engineering",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Architectural Integrity",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Timeless Craftsmanship",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Full-Service Contracting",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Bespoke Design Build",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{ variant: "plain" }}
|
||||
title="Building Legacies Through Craft"
|
||||
description="Dutchman Contracting delivers unparalleled precision and architectural integrity for the most discerning residential projects. Experience excellence in design and build."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg"
|
||||
imageAlt="High-end construction project site"
|
||||
mediaAnimation="blur-reveal"
|
||||
buttons={[{ text: "View Our Projects", href: "/projects" }, { text: "Contact Us", href: "/contact" }]}
|
||||
avatars={[{ src: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg", alt: "Client" }, { src: "http://img.b2bpic.net/free-photo/close-up-side-view-engineer-architect-supervising-construction_23-2148233789.jpg", alt: "Client" }, { src: "http://img.b2bpic.net/free-photo/man-with-blueprint-copy-space_23-2148269819.jpg", alt: "Client" }, { src: "http://img.b2bpic.net/free-photo/young-woman-with-long-blonde-hair-shorts-handsome-joyful-guy-bed-smiling-with-tablet-modern-apartment-lovely-couple-having-fun-true-emotions_197531-1600.jpg", alt: "Client" }, { src: "http://img.b2bpic.net/free-photo/black-man-showing-blueprint-woman_23-2147807971.jpg", alt: "Client" }]}
|
||||
avatarText="Trusted by over 150+ luxury homeowners"
|
||||
marqueeItems={[{ type: "text", text: "Precision Engineering" }, { type: "text", text: "Architectural Integrity" }, { type: "text", text: "Timeless Craftsmanship" }, { type: "text", text: "Full-Service Contracting" }, { type: "text", text: "Bespoke Design Build" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Custom Residential",
|
||||
description: "Bespoke home building tailored to architectural precision.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Renovations",
|
||||
description: "Refining heritage structures with modern utility.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Architectural Build",
|
||||
description: "Seamless execution for high-concept designs.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-wooden-ceiling-cool-house-with-modern-minimalistic-interior_181624-6753.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Interior Finish",
|
||||
description: "Exquisite attention to interior materiality.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ai-generated-modern-styled-entryway_23-2150692271.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
title: "Project Management",
|
||||
description: "Full-cycle oversight for stress-free building.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283303.jpg?_wi=1",
|
||||
},
|
||||
]}
|
||||
title="Core Expertise"
|
||||
description="From foundation to final detail, we maintain absolute standards of quality."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[{ title: "Custom Residential", description: "Bespoke home building tailored to architectural precision.", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg" }, { title: "Renovations", description: "Refining heritage structures with modern utility.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg" }, { title: "Architectural Build", description: "Seamless execution for high-concept designs.", imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-wooden-ceiling-cool-house-with-modern-minimalistic-interior_181624-6753.jpg" }, { title: "Interior Finish", description: "Exquisite attention to interior materiality.", imageSrc: "http://img.b2bpic.net/free-photo/ai-generated-modern-styled-entryway_23-2150692271.jpg" }, { title: "Project Management", description: "Full-cycle oversight for stress-free building.", imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283303.jpg" }]}
|
||||
title="Core Expertise"
|
||||
description="From foundation to final detail, we maintain absolute standards of quality."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Residential",
|
||||
name: "Oakridge Estate",
|
||||
price: "Custom",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Residential",
|
||||
name: "The Pavilion",
|
||||
price: "Custom",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Renovation",
|
||||
name: "Historic Manor",
|
||||
price: "Custom",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-wooden-ceiling-cool-house-with-modern-minimalistic-interior_181624-6753.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
brand: "Residential",
|
||||
name: "Contemporary Hillside",
|
||||
price: "Custom",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/ai-generated-modern-styled-entryway_23-2150692271.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
brand: "Custom",
|
||||
name: "Beachfront Retreat",
|
||||
price: "Custom",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283303.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
brand: "Residential",
|
||||
name: "Urban Skyline",
|
||||
price: "Custom",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-contractor-with-security-helmet-checking-construction-blueprints-while-looking-tablet_662251-387.jpg?_wi=1",
|
||||
},
|
||||
]}
|
||||
title="Featured Projects"
|
||||
description="A curated selection of our commitment to timeless building standards."
|
||||
/>
|
||||
</div>
|
||||
<div id="projects" data-section="projects">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[{ id: "1", brand: "Residential", name: "Oakridge Estate", price: "Custom", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg" }, { id: "2", brand: "Residential", name: "The Pavilion", price: "Custom", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg" }, { id: "3", brand: "Renovation", name: "Historic Manor", price: "Custom", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-wooden-ceiling-cool-house-with-modern-minimalistic-interior_181624-6753.jpg" }, { id: "4", brand: "Residential", name: "Contemporary Hillside", price: "Custom", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/ai-generated-modern-styled-entryway_23-2150692271.jpg" }, { id: "5", brand: "Custom", name: "Beachfront Retreat", price: "Custom", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283303.jpg" }, { id: "6", brand: "Residential", name: "Urban Skyline", price: "Custom", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-contractor-with-security-helmet-checking-construction-blueprints-while-looking-tablet_662251-387.jpg" }]}
|
||||
title="Featured Projects"
|
||||
description="A curated selection of our commitment to timeless building standards."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about-snippet" data-section="about-snippet">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="The Dutchman Standard"
|
||||
description="We treat construction as an art form. Our contracting approach is defined by transparency, rigor, and an unwavering commitment to the legacy of our work."
|
||||
metrics={[
|
||||
{
|
||||
value: "20+",
|
||||
title: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "150+",
|
||||
title: "Custom Builds",
|
||||
},
|
||||
{
|
||||
value: "100%",
|
||||
title: "Client Retention",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineers-with-helmets-standing-by-factory_1157-35526.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about-snippet" data-section="about-snippet">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="The Dutchman Standard"
|
||||
description="We treat construction as an art form. Our contracting approach is defined by transparency, rigor, and an unwavering commitment to the legacy of our work."
|
||||
metrics={[{ value: "20+", title: "Years Experience" }, { value: "150+", title: "Custom Builds" }, { value: "100%", title: "Client Retention" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/engineers-with-helmets-standing-by-factory_1157-35526.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Arthur Sterling",
|
||||
handle: "Principal Architect",
|
||||
testimonial: "Dutchman approaches builds with a level of rigor I haven't seen elsewhere.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Elena Vance",
|
||||
handle: "Real Estate Developer",
|
||||
testimonial: "Incredible work. They build to a standard that simply transcends expectations.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-side-view-engineer-architect-supervising-construction_23-2148233789.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Marcus Thorne",
|
||||
handle: "CEO",
|
||||
testimonial: "Professional, punctual, and precise. A firm that stands by its reputation.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-blueprint-copy-space_23-2148269819.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sophia Bennett",
|
||||
handle: "Luxury Consultant",
|
||||
testimonial: "When we need flawless execution on tight deadlines, we call Dutchman.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-long-blonde-hair-shorts-handsome-joyful-guy-bed-smiling-with-tablet-modern-apartment-lovely-couple-having-fun-true-emotions_197531-1600.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Julian Reed",
|
||||
handle: "Homeowner",
|
||||
testimonial: "They built my legacy home with care and professionalism. Unmatched.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-man-showing-blueprint-woman_23-2147807971.jpg",
|
||||
},
|
||||
]}
|
||||
title="Client Perspectives"
|
||||
description="Professionalism meets perfection, as experienced by our partners."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[{ id: "1", name: "Arthur Sterling", handle: "Principal Architect", testimonial: "Dutchman approaches builds with a level of rigor I haven't seen elsewhere.", imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg" }, { id: "2", name: "Elena Vance", handle: "Real Estate Developer", testimonial: "Incredible work. They build to a standard that simply transcends expectations.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-side-view-engineer-architect-supervising-construction_23-2148233789.jpg" }, { id: "3", name: "Marcus Thorne", handle: "CEO", testimonial: "Professional, punctual, and precise. A firm that stands by its reputation.", imageSrc: "http://img.b2bpic.net/free-photo/man-with-blueprint-copy-space_23-2148269819.jpg" }, { id: "4", name: "Sophia Bennett", handle: "Luxury Consultant", testimonial: "When we need flawless execution on tight deadlines, we call Dutchman.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-long-blonde-hair-shorts-handsome-joyful-guy-bed-smiling-with-tablet-modern-apartment-lovely-couple-having-fun-true-emotions_197531-1600.jpg" }, { id: "5", name: "Julian Reed", handle: "Homeowner", testimonial: "They built my legacy home with care and professionalism. Unmatched.", imageSrc: "http://img.b2bpic.net/free-photo/black-man-showing-blueprint-woman_23-2147807971.jpg" }]}
|
||||
title="Client Perspectives"
|
||||
description="Professionalism meets perfection, as experienced by our partners."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg?_wi=2"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Projects",
|
||||
href: "/projects",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Projects", href: "/projects" }] }, { title: "Company", items: [{ label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }, { label: "Privacy", href: "#" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
@@ -21,107 +21,33 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "/projects",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Dutchman Contracting"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Projects", id: "/projects" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Dutchman Contracting"
|
||||
button={{ text: "Contact Us", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="product" data-section="product">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Residential Highlights"
|
||||
description="Explore our portfolio of bespoke living spaces."
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "Luxury",
|
||||
name: "Cliffside Haven",
|
||||
price: "Contact for quote",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg?_wi=4",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "Luxury",
|
||||
name: "Metropolitan Loft",
|
||||
price: "Contact for quote",
|
||||
rating: 5,
|
||||
reviewCount: "0",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg?_wi=4",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="product" data-section="product">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Residential Highlights"
|
||||
description="Explore our portfolio of bespoke living spaces."
|
||||
products={[{ id: "p1", brand: "Luxury", name: "Cliffside Haven", price: "Contact for quote", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-building_23-2150896892.jpg" }, { id: "p2", brand: "Luxury", name: "Metropolitan Loft", price: "Contact for quote", rating: 5, reviewCount: "0", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-modern-building-modern-architecture_181624-21692.jpg" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg?_wi=4"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Projects",
|
||||
href: "/projects",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Projects", href: "/projects" }] }, { title: "Company", items: [{ label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }, { label: "Privacy", href: "#" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
@@ -21,98 +21,32 @@ export default function LandingPage() {
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "/projects",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Dutchman Contracting"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Projects", id: "/projects" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Dutchman Contracting"
|
||||
button={{ text: "Contact Us", href: "/contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Primary Services"
|
||||
description="Our comprehensive suite of construction services."
|
||||
features={[
|
||||
{
|
||||
title: "Foundation Work",
|
||||
description: "Solid engineering for lasting structures.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283303.jpg?_wi=3",
|
||||
},
|
||||
{
|
||||
title: "Complete Design-Build",
|
||||
description: "From blue-prints to finished keys.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-contractor-with-security-helmet-checking-construction-blueprints-while-looking-tablet_662251-387.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Primary Services"
|
||||
description="Our comprehensive suite of construction services."
|
||||
features={[{ title: "Foundation Work", description: "Solid engineering for lasting structures.", imageSrc: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283303.jpg" }, { title: "Complete Design-Build", description: "From blue-prints to finished keys.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-contractor-with-security-helmet-checking-construction-blueprints-while-looking-tablet_662251-387.jpg" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg?_wi=5"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Projects",
|
||||
href: "/projects",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lyon-france-december-22-2014-musee-des-confluences-musee-des-confluences-is-located-confluence-rhone-saone-rivers_268835-1074.jpg"
|
||||
logoText="Dutchman Contracting"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Projects", href: "/projects" }] }, { title: "Company", items: [{ label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }, { label: "Privacy", href: "#" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user