Merge version_1 into main #1
248
src/app/page.tsx
248
src/app/page.tsx
@@ -20,31 +20,24 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "#testimonials",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "#faq",
|
||||
},
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Pricing", id: "#pricing" },
|
||||
{ name: "Testimonials", id: "#testimonials" },
|
||||
{ name: "FAQ", id: "#faq" },
|
||||
{ name: "Contact", id: "#contact" }
|
||||
]}
|
||||
brandName="RoofMaster Pro"
|
||||
/>
|
||||
@@ -53,32 +46,15 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDualMedia
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Reliable Roofing Experts"
|
||||
description="Professional residential and commercial roofing services. We prioritize cleanup, clear communication, and quality craftsmanship."
|
||||
tag="Quality First"
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-male-laborer-with-hard-hat-carrying-steel_23-2148773505.jpg",
|
||||
imageAlt: "Professional roof inspection",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-male-laborer-with-hard-hat-carrying-steel_23-2148773505.jpg", imageAlt: "Professional roof inspection"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tile-roof-house-home-textures_74190-9990.jpg",
|
||||
imageAlt: "Completed roofing project",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sideways-man-working-roof-with-drill_23-2148748771.jpg",
|
||||
imageAlt: "Sideways man working on roof with a drill",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-roof_23-2149343653.jpg",
|
||||
imageAlt: "Medium shot man working on roof",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-roof_23-2149343701.jpg",
|
||||
imageAlt: "Medium shot man working on roof",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tile-roof-house-home-textures_74190-9990.jpg", imageAlt: "Completed roofing project"}
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
@@ -106,38 +82,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Full Replacements",
|
||||
author: "Pro Team",
|
||||
description: "High-durability materials installed to last.",
|
||||
tags: [
|
||||
"Construction",
|
||||
"Quality",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-helmet-sitting-roof_23-2149343713.jpg",
|
||||
},
|
||||
id: "f1", title: "Full Replacements", author: "Pro Team", description: "High-durability materials installed to last.", tags: ["Construction", "Quality"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-helmet-sitting-roof_23-2149343713.jpg"},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Storm Damage Repair",
|
||||
author: "Expert Team",
|
||||
description: "Assisting with insurance claims and quick repairs.",
|
||||
tags: [
|
||||
"Urgent",
|
||||
"Insurance",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-helmet-working-roof_23-2149343661.jpg",
|
||||
},
|
||||
id: "f2", title: "Storm Damage Repair", author: "Expert Team", description: "Assisting with insurance claims and quick repairs.", tags: ["Urgent", "Insurance"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-helmet-working-roof_23-2149343661.jpg"},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Maintenance & Inspection",
|
||||
author: "Safety Pro",
|
||||
description: "Regular checkups to catch issues before they grow.",
|
||||
tags: [
|
||||
"Safety",
|
||||
"Reliable",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-working-roof-together_23-2149343670.jpg",
|
||||
},
|
||||
id: "f3", title: "Maintenance & Inspection", author: "Safety Pro", description: "Regular checkups to catch issues before they grow.", tags: ["Safety", "Reliable"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-working-roof-together_23-2149343670.jpg"}
|
||||
]}
|
||||
title="Professional Services"
|
||||
description="We handle everything from simple repairs to full system replacements with strict quality standards."
|
||||
@@ -151,38 +103,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "p1",
|
||||
badge: "Essential",
|
||||
price: "$8,000",
|
||||
subtitle: "Basic repair & flashing check",
|
||||
features: [
|
||||
"Minor leak repairs",
|
||||
"Full inspection",
|
||||
"Cleanup",
|
||||
],
|
||||
id: "p1", badge: "Essential", price: "$8,000", subtitle: "Basic repair & flashing check", features: ["Minor leak repairs", "Full inspection", "Cleanup"]
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
badge: "Standard",
|
||||
price: "$25,000",
|
||||
subtitle: "Full roof replacement",
|
||||
features: [
|
||||
"New shingles",
|
||||
"Waste removal",
|
||||
"3-year warranty",
|
||||
],
|
||||
id: "p2", badge: "Standard", price: "$25,000", subtitle: "Full roof replacement", features: ["New shingles", "Waste removal", "3-year warranty"]
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
badge: "Premium",
|
||||
price: "$45,000+",
|
||||
subtitle: "Comprehensive system replacement",
|
||||
features: [
|
||||
"Structural fixes",
|
||||
"Advanced flashing",
|
||||
"Extended warranty",
|
||||
],
|
||||
},
|
||||
id: "p3", badge: "Premium", price: "$45,000+", subtitle: "Comprehensive system replacement", features: ["Structural fixes", "Advanced flashing", "Extended warranty"]
|
||||
}
|
||||
]}
|
||||
title="Transparent Pricing"
|
||||
description="No hidden costs. We provide detailed estimates so you know exactly what your budget covers."
|
||||
@@ -196,27 +124,9 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "1500+",
|
||||
title: "Roofs Completed",
|
||||
description: "Homeowners served",
|
||||
icon: CheckCircle,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "4.9/5",
|
||||
title: "Client Satisfaction",
|
||||
description: "Average review score",
|
||||
icon: Star,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "15",
|
||||
title: "Years Experience",
|
||||
description: "Expert roofing team",
|
||||
icon: Award,
|
||||
},
|
||||
{ id: "m1", value: "1500+", title: "Roofs Completed", description: "Homeowners served", icon: CheckCircle },
|
||||
{ id: "m2", value: "4.9/5", title: "Client Satisfaction", description: "Average review score", icon: Star },
|
||||
{ id: "m3", value: "15", title: "Years Experience", description: "Expert roofing team", icon: Award }
|
||||
]}
|
||||
title="By The Numbers"
|
||||
description="Our reputation built on years of reliable roofing."
|
||||
@@ -227,31 +137,11 @@ export default function LandingPage() {
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Johnson",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-looking-photographer_23-2148339179.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael Chen",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-successful-young-business-woman-standing-with-arms-folded-posing-co-working-coffee-shop-interior-looking-camera-smiling_74855-10036.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily Rodriguez",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-near-house-looking-camera_259150-59313.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13336.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Alice Brown",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-female-with-pinkish-hair-posing_344912-854.jpg",
|
||||
},
|
||||
{ id: "1", name: "Sarah Johnson", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-woman-looking-photographer_23-2148339179.jpg" },
|
||||
{ id: "2", name: "Michael Chen", imageSrc: "http://img.b2bpic.net/free-photo/happy-successful-young-business-woman-standing-with-arms-folded-posing-co-working-coffee-shop-interior-looking-camera-smiling_74855-10036.jpg" },
|
||||
{ id: "3", name: "Emily Rodriguez", imageSrc: "http://img.b2bpic.net/free-photo/man-sitting-near-house-looking-camera_259150-59313.jpg" },
|
||||
{ id: "4", name: "David Kim", imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13336.jpg" },
|
||||
{ id: "5", name: "Alice Brown", imageSrc: "http://img.b2bpic.net/free-photo/young-female-with-pinkish-hair-posing_344912-854.jpg" }
|
||||
]}
|
||||
cardTitle="What Homeowners Say"
|
||||
cardTag="Testimonials"
|
||||
@@ -264,26 +154,10 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Do you help with insurance claims?",
|
||||
content: "Yes, our team can work with insurance adjusters to document damages and streamline the claim process.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you offer financing?",
|
||||
content: "Yes, we offer flexible financing options to make sure your roofing project fits your budget.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "What about cleanup?",
|
||||
content: "We prioritize cleaning your property thoroughly once the job is finished, ensuring no debris is left behind.",
|
||||
},
|
||||
{
|
||||
id: "q4",
|
||||
title: "Why avoid door-to-door sales?",
|
||||
content: "Professional companies like ours rely on reputation, not high-pressure tactics. Be cautious with unverified contractors.",
|
||||
},
|
||||
{ id: "q1", title: "Do you help with insurance claims?", content: "Yes, our team can work with insurance adjusters to document damages and streamline the claim process." },
|
||||
{ id: "q2", title: "Do you offer financing?", content: "Yes, we offer flexible financing options to make sure your roofing project fits your budget." },
|
||||
{ id: "q3", title: "What about cleanup?", content: "We prioritize cleaning your property thoroughly once the job is finished, ensuring no debris is left behind." },
|
||||
{ id: "q4", title: "Why avoid door-to-door sales?", content: "Professional companies like ours rely on reputation, not high-pressure tactics. Be cautious with unverified contractors." }
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Quick answers to help you prepare for your project."
|
||||
@@ -294,9 +168,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Get Started"
|
||||
title="Request a Free Inspection"
|
||||
description="Ready to protect your home? Book an inspection today for an honest, detailed quote."
|
||||
@@ -308,45 +180,9 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Financing",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Use",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Services", href: "#services" }] },
|
||||
{ title: "Support", items: [{ label: "FAQ", href: "#faq" }, { label: "Financing", href: "#" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Use", href: "#" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 RoofMaster Pro"
|
||||
bottomRightText="All rights reserved."
|
||||
|
||||
Reference in New Issue
Block a user