bender/1506766d-2b80-4249-9595-9983f146bff9
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-12 20:36:24 +00:00
parent 7e4fc7ce3f
commit 7086cbd04b
1 changed files with 44 additions and 240 deletions
Download Patch File Download Diff File Expand all files Collapse all files

284
src/app/page.tsx
View File

@@ -31,22 +31,13 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Services",
id: "#features",
},
{
name: "Projects",
id: "#projects",
},
{
name: "About",
id: "#about",
},
{
name: "Contact",
id: "#contact",
},
{ name: "Hero", id: "hero" },
{ name: "About", id: "about" },
{ name: "Features", id: "features" },
{ name: "Projects", id: "projects" },
{ name: "Testimonials", id: "testimonials" },
{ name: "FAQ", id: "faq" },
{ name: "Contact", id: "contact" }
]}
brandName="Williams Roofing"
/>
@@ -54,64 +45,27 @@ export default function LandingPage() {
<div id="hero" data-section="hero">
<HeroSplit
background={{
variant: "gradient-bars",
}}
background={{ variant: "gradient-bars" }}
title="Exquisite Roofing Excellence"
description="Redefining residential protection through precision craftsmanship, superior materials, and unparalleled luxury service standards."
buttons={[
{
text: "Consult With Us",
href: "#contact",
},
]}
buttons={[{ text: "Consult With Us", href: "#contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/exterior-home_74190-4300.jpg"
imageAlt="Luxury home exterior with slate roof"
mediaAnimation="blur-reveal"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/studio-portrait-elegant-black-american-male-dressed-suit-grey-vignette-background_613910-1544.jpg",
alt: "Studio portrait of elegant black American male",
},
{
src: "http://img.b2bpic.net/free-photo/handsome-young-business-man-suit-grey-background_613910-2479.jpg",
alt: "Handsome young business man",
},
{
src: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-3693.jpg",
alt: "Attractive blond business woman",
},
{
src: "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-14684.jpg",
alt: "Serious bearded male in a suit",
},
{
src: "http://img.b2bpic.net/free-photo/young-latin-man-architect-smiling-confident-standing-with-arms-crossed-gesture-street_839833-2747.jpg",
alt: "Young latin man architect",
},
{ src: "http://img.b2bpic.net/free-photo/studio-portrait-elegant-black-american-male-dressed-suit-grey-vignette-background_613910-1544.jpg", alt: "Studio portrait of elegant black American male" },
{ src: "http://img.b2bpic.net/free-photo/handsome-young-business-man-suit-grey-background_613910-2479.jpg", alt: "Handsome young business man" },
{ src: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-3693.jpg", alt: "Attractive blond business woman" },
{ src: "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-14684.jpg", alt: "Serious bearded male in a suit" },
{ src: "http://img.b2bpic.net/free-photo/young-latin-man-architect-smiling-confident-standing-with-arms-crossed-gesture-street_839833-2747.jpg", alt: "Young latin man architect" }
]}
avatarText="Trusted by 12,000+ satisfied homeowners"
marqueeItems={[
{
type: "text",
text: "Architectural Integrity",
},
{
type: "text",
text: "Premium Materials",
},
{
type: "text",
text: "Master Installation",
},
{
type: "text",
text: "Lifetime Warranty",
},
{
type: "text",
text: "Heritage Restoration",
},
{ type: "text", text: "Architectural Integrity" },
{ type: "text", text: "Premium Materials" },
{ type: "text", text: "Master Installation" },
{ type: "text", text: "Lifetime Warranty" },
{ type: "text", text: "Heritage Restoration" }
]}
/>
</div>
@@ -121,21 +75,9 @@ export default function LandingPage() {
useInvertedBackground={false}
title="Legacy of Quality"
metrics={[
{
icon: Award,
label: "Years Experience",
value: "45+",
},
{
icon: Shield,
label: "Homes Secured",
value: "12,000",
},
{
icon: Star,
label: "Client Ratings",
value: "4.9/5",
},
{ icon: Award, label: "Years Experience", value: "45+" },
{ icon: Shield, label: "Homes Secured", value: "12,000" },
{ icon: Star, label: "Client Ratings", value: "4.9/5" }
]}
metricsAnimation="slide-up"
/>
@@ -148,27 +90,9 @@ export default function LandingPage() {
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
features={[
{
title: "Premium Shingle Systems",
description: "High-durability designer shingles designed for aesthetic elegance and longevity.",
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-view-modern-building-with-glass-windows-sunlight_181624-11971.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/close-view-electric-car-charging-station_1268-20909.jpg",
buttonText: "Discover",
},
{
title: "Metal Roof Installations",
description: "Modern metal roofing offering sleek lines and industrial-grade protection.",
imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-15608.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/gold-coin-real-brazil-currency-money-icon-sign-symbol-business-financial-exchange-3d-background-illustration_56104-1981.jpg",
buttonText: "Discover",
},
{
title: "Repair & Preservation",
description: "Specialized maintenance and restoration services for historic and high-end properties.",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-with-protection-helmet_23-2149343636.jpg",
titleImageSrc: "http://img.b2bpic.net/free-psd/3d-golden-circle-home-icon-dark-background_84443-56221.jpg",
buttonText: "Discover",
},
{ title: "Premium Shingle Systems", description: "High-durability designer shingles designed for aesthetic elegance and longevity.", imageSrc: "http://img.b2bpic.net/free-photo/low-angle-view-modern-building-with-glass-windows-sunlight_181624-11971.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/close-view-electric-car-charging-station_1268-20909.jpg", buttonText: "Discover" },
{ title: "Metal Roof Installations", description: "Modern metal roofing offering sleek lines and industrial-grade protection.", imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-15608.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/gold-coin-real-brazil-currency-money-icon-sign-symbol-business-financial-exchange-3d-background-illustration_56104-1981.jpg", buttonText: "Discover" },
{ title: "Repair & Preservation", description: "Specialized maintenance and restoration services for historic and high-end properties.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-with-protection-helmet_23-2149343636.jpg", titleImageSrc: "http://img.b2bpic.net/free-psd/3d-golden-circle-home-icon-dark-background_84443-56221.jpg", buttonText: "Discover" }
]}
title="Our Craftsmanship"
description="Comprehensive roofing solutions tailored for distinguished homes."
@@ -179,62 +103,15 @@ export default function LandingPage() {
<ProductCardTwo
textboxLayout="split"
gridVariant="asymmetric-60-wide-40-narrow"
animationType="slide-up"
useInvertedBackground={false}
products={[
{
id: "1",
brand: "Estate",
name: "Manor Slate Project",
price: "Custom",
rating: 5,
reviewCount: "12",
imageSrc: "http://img.b2bpic.net/free-photo/organ-hall-chisinau-moldova_1268-18336.jpg",
},
{
id: "2",
brand: "Modern",
name: "Urban Metal Haven",
price: "Custom",
rating: 5,
reviewCount: "08",
imageSrc: "http://img.b2bpic.net/free-photo/real-estate-team-using-3d-models-explore-construction-layout-options-working-residential_482257-136318.jpg",
},
{
id: "3",
brand: "Colonial",
name: "Heritage Restoration",
price: "Custom",
rating: 5,
reviewCount: "15",
imageSrc: "http://img.b2bpic.net/free-photo/relax-house-thai-style_1150-17982.jpg",
},
{
id: "4",
brand: "Luxury",
name: "Cedar Wood Project",
price: "Custom",
rating: 5,
reviewCount: "05",
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-wooden-surface-with-bamboo-great-background-wallpaper_181624-23599.jpg",
},
{
id: "5",
brand: "Estate",
name: "Coastal Haven",
price: "Custom",
rating: 5,
reviewCount: "10",
imageSrc: "http://img.b2bpic.net/free-photo/midsection-woman-working-house-blueprint-desk-office_23-2148182961.jpg",
},
{
id: "6",
brand: "Design",
name: "Architectural Peak",
price: "Custom",
rating: 5,
reviewCount: "22",
imageSrc: "http://img.b2bpic.net/free-photo/amazing-landscape-surrounding-adare-manor-ireland_493961-1381.jpg",
},
{ id: "1", brand: "Estate", name: "Manor Slate Project", price: "Custom", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/organ-hall-chisinau-moldova_1268-18336.jpg" },
{ id: "2", brand: "Modern", name: "Urban Metal Haven", price: "Custom", rating: 5, reviewCount: "08", imageSrc: "http://img.b2bpic.net/free-photo/real-estate-team-using-3d-models-explore-construction-layout-options-working-residential_482257-136318.jpg" },
{ id: "3", brand: "Colonial", name: "Heritage Restoration", price: "Custom", rating: 5, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/relax-house-thai-style_1150-17982.jpg" },
{ id: "4", brand: "Luxury", name: "Cedar Wood Project", price: "Custom", rating: 5, reviewCount: "05", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-wooden-surface-with-bamboo-great-background-wallpaper_181624-23599.jpg" },
{ id: "5", brand: "Estate", name: "Coastal Haven", price: "Custom", rating: 5, reviewCount: "10", imageSrc: "http://img.b2bpic.net/free-photo/midsection-woman-working-house-blueprint-desk-office_23-2148182961.jpg" },
{ id: "6", brand: "Design", name: "Architectural Peak", price: "Custom", rating: 5, reviewCount: "22", imageSrc: "http://img.b2bpic.net/free-photo/amazing-landscape-surrounding-adare-manor-ireland_493961-1381.jpg" }
]}
title="Recent Masterpieces"
description="Witness the marriage of architecture and durability."
@@ -247,41 +124,11 @@ export default function LandingPage() {
textboxLayout="split"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Eleanor Vance",
role: "Property Owner",
testimonial: "Exceptional precision. My historic home looks better than ever.",
imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-13618.jpg",
},
{
id: "2",
name: "Arthur Sterling",
role: "Architect",
testimonial: "The Williams team understands the structural nuances required for true quality.",
imageSrc: "http://img.b2bpic.net/free-photo/senior-businessman-architect-hard-hat_1303-18991.jpg",
},
{
id: "3",
name: "Jane Doe",
role: "Client",
testimonial: "Professionalism at every turn. A seamless, luxurious experience.",
imageSrc: "http://img.b2bpic.net/free-photo/successful-young-man-stylish-hat-relaxing-alone-cozy-cafeteria-lunch-break-looking-with-happy-expression_273609-1935.jpg",
},
{
id: "4",
name: "Robert Moss",
role: "Homeowner",
testimonial: "Their craftsmanship is unmatched in the industry.",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-cute-barista-girl_23-2148436121.jpg",
},
{
id: "5",
name: "Sarah P.",
role: "Client",
testimonial: "The most meticulous roofing company we have ever hired.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021809.jpg",
},
{ id: "1", name: "Eleanor Vance", role: "Property Owner", testimonial: "Exceptional precision. My historic home looks better than ever.", imageSrc: "http://img.b2bpic.net/free-photo/attractive-blond-business-woman-white-shirt-eyeglasses-crossed-arms-grey-background_613910-13618.jpg" },
{ id: "2", name: "Arthur Sterling", role: "Architect", testimonial: "The Williams team understands the structural nuances required for true quality.", imageSrc: "http://img.b2bpic.net/free-photo/senior-businessman-architect-hard-hat_1303-18991.jpg" },
{ id: "3", name: "Jane Doe", role: "Client", testimonial: "Professionalism at every turn. A seamless, luxurious experience.", imageSrc: "http://img.b2bpic.net/free-photo/successful-young-man-stylish-hat-relaxing-alone-cozy-cafeteria-lunch-break-looking-with-happy-expression_273609-1935.jpg" },
{ id: "4", name: "Robert Moss", role: "Homeowner", testimonial: "Their craftsmanship is unmatched in the industry.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-cute-barista-girl_23-2148436121.jpg" },
{ id: "5", name: "Sarah P.", role: "Client", testimonial: "The most meticulous roofing company we have ever hired.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021809.jpg" }
]}
title="Client Perspectives"
description="Discerning homeowners praise our professional integrity and flawless results."
@@ -293,21 +140,9 @@ export default function LandingPage() {
textboxLayout="split"
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "What makes your roofing luxury?",
content: "We utilize only top-tier materials and master-level installation teams.",
},
{
id: "2",
title: "Do you offer warranties?",
content: "Yes, we provide industry-leading extended labor and material warranties.",
},
{
id: "3",
title: "How long is the process?",
content: "Every project is bespoke and timeline is dictated by quality, not speed.",
},
{ id: "1", title: "What makes your roofing luxury?", content: "We utilize only top-tier materials and master-level installation teams." },
{ id: "2", title: "Do you offer warranties?", content: "Yes, we provide industry-leading extended labor and material warranties." },
{ id: "3", title: "How long is the process?", content: "Every project is bespoke and timeline is dictated by quality, not speed." }
]}
title="Concierge Support"
description="Clear answers to help you navigate your roofing journey."
@@ -318,16 +153,9 @@ export default function LandingPage() {
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={true}
background={{
variant: "sparkles-gradient",
}}
background={{ variant: "sparkles-gradient" }}
text="Start your luxury transformation today."
buttons={[
{
text: "Request Consultation",
href: "#",
},
]}
buttons={[{ text: "Request Consultation", href: "#" }]}
/>
</div>
@@ -335,32 +163,8 @@ export default function LandingPage() {
<FooterBaseCard
logoText="Williams Brothers Roofing"
columns={[
{
title: "Connect",
items: [
{
label: "Instagram",
href: "#",
},
{
label: "Twitter",
href: "#",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms",
href: "#",
},
],
},
{ title: "Connect", items: [{ label: "Instagram", href: "#" }, { label: "Twitter", href: "#" }] },
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms", href: "#" }] }
]}
/>
</div>