Merge version_2 into main #1
293
src/app/page.tsx
293
src/app/page.tsx
@@ -32,21 +32,13 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Gallery",
|
||||
id: "gallery",
|
||||
},
|
||||
name: "Gallery", id: "gallery"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="JM Roofing"
|
||||
/>
|
||||
@@ -55,85 +47,54 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
title="Premium Roofing Services in Los Angeles — Built to Last for Generations"
|
||||
description="Trusted 3rd generation roofing experts delivering quality, durability, and unmatched craftsmanship across Los Angeles County."
|
||||
kpis={[
|
||||
{
|
||||
value: "3rd",
|
||||
label: "Generation Experts",
|
||||
},
|
||||
value: "3rd", label: "Generation Experts"},
|
||||
{
|
||||
value: "100%",
|
||||
label: "Customer Satisfaction",
|
||||
},
|
||||
value: "100%", label: "Customer Satisfaction"},
|
||||
{
|
||||
value: "Licensed",
|
||||
label: "Bonded & Insured",
|
||||
},
|
||||
value: "Licensed", label: "Bonded & Insured"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+13232459154",
|
||||
},
|
||||
text: "Call Now", href: "tel:+13232459154"},
|
||||
{
|
||||
text: "Get Free Estimate",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Get Free Estimate", href: "#contact"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-engineers-work-hours-job-site_23-2151589596.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/cropped-shot-dark-skinned-smiling-young-woman-with-afro-hairstyle-dressed-casual-summer-clothing_273609-3169.jpg",
|
||||
alt: "Satisfied client portrait 1",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/cropped-shot-dark-skinned-smiling-young-woman-with-afro-hairstyle-dressed-casual-summer-clothing_273609-3169.jpg", alt: "Satisfied client portrait 1"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg",
|
||||
alt: "Satisfied client portrait 2",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/stylish-woman-wearing-yellow-bandana_273609-13337.jpg", alt: "Satisfied client portrait 2"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/positive-smiling-woman-with-collected-hair-wearing-white-shirt_291650-656.jpg",
|
||||
alt: "Satisfied client portrait 3",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/positive-smiling-woman-with-collected-hair-wearing-white-shirt_291650-656.jpg", alt: "Satisfied client portrait 3"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/happy-woman-using-tablet-celebrating-success-outdoor-cafe_1262-18867.jpg",
|
||||
alt: "Satisfied client portrait 4",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/happy-woman-using-tablet-celebrating-success-outdoor-cafe_1262-18867.jpg", alt: "Satisfied client portrait 4"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064844.jpg",
|
||||
alt: "Satisfied client portrait 5",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064844.jpg", alt: "Satisfied client portrait 5"},
|
||||
]}
|
||||
avatarText="Trusted by over 500+ LA families"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Licensed",
|
||||
icon: ShieldCheck,
|
||||
type: "text-icon", text: "Licensed", icon: ShieldCheck,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Insured",
|
||||
icon: AlertTriangle,
|
||||
type: "text-icon", text: "Insured", icon: AlertTriangle,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Energy Efficient",
|
||||
icon: Sun,
|
||||
type: "text-icon", text: "Energy Efficient", icon: Sun,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Sustainable",
|
||||
icon: Leaf,
|
||||
type: "text-icon", text: "Sustainable", icon: Leaf,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "24/7 Support",
|
||||
icon: Clock,
|
||||
type: "text-icon", text: "24/7 Support", icon: Clock,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
@@ -146,53 +107,29 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Residential Roofing",
|
||||
descriptions: [
|
||||
"Custom residential roofing tailored to your unique architectural style and needs.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/minimalist-furniture-logo-concept_23-2148475049.jpg",
|
||||
},
|
||||
id: "s1", title: "Residential Roofing", descriptions: [
|
||||
"Custom residential roofing tailored to your unique architectural style and needs."],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/minimalist-furniture-logo-concept_23-2148475049.jpg"},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Commercial Roofing",
|
||||
descriptions: [
|
||||
"High-performance roofing systems built for large-scale durability and protection.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/roof-set-with-blank-background-isolated-icons-house-tops-with-characters-working-people-vector-illustration_1284-81316.jpg",
|
||||
},
|
||||
id: "s2", title: "Commercial Roofing", descriptions: [
|
||||
"High-performance roofing systems built for large-scale durability and protection."],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/roof-set-with-blank-background-isolated-icons-house-tops-with-characters-working-people-vector-illustration_1284-81316.jpg"},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Roof Repairs",
|
||||
descriptions: [
|
||||
"Reliable, rapid-response repairs to stop leaks before they compromise your structure.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-installing-banner-with-hammer-hard-hat_187299-46526.jpg",
|
||||
},
|
||||
id: "s3", title: "Roof Repairs", descriptions: [
|
||||
"Reliable, rapid-response repairs to stop leaks before they compromise your structure."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-installing-banner-with-hammer-hard-hat_187299-46526.jpg"},
|
||||
{
|
||||
id: "s4",
|
||||
title: "Roof Replacement",
|
||||
descriptions: [
|
||||
"Complete, expert replacement solutions using premium, long-lasting materials.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/home-sign-front-side-with-white-background_187299-40067.jpg",
|
||||
},
|
||||
id: "s4", title: "Roof Replacement", descriptions: [
|
||||
"Complete, expert replacement solutions using premium, long-lasting materials."],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/home-sign-front-side-with-white-background_187299-40067.jpg"},
|
||||
{
|
||||
id: "s5",
|
||||
title: "Leak Detection",
|
||||
descriptions: [
|
||||
"State-of-the-art diagnostic techniques to pinpoint hidden water sources fast.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/shield-water-silhouette-logo_361591-2270.jpg",
|
||||
},
|
||||
id: "s5", title: "Leak Detection", descriptions: [
|
||||
"State-of-the-art diagnostic techniques to pinpoint hidden water sources fast."],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/shield-water-silhouette-logo_361591-2270.jpg"},
|
||||
{
|
||||
id: "s6",
|
||||
title: "Emergency Services",
|
||||
descriptions: [
|
||||
"24/7 emergency response to protect your investment during unforeseen events.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/illustration-house-insurance_53876-6171.jpg",
|
||||
},
|
||||
id: "s6", title: "Emergency Services", descriptions: [
|
||||
"24/7 emergency response to protect your investment during unforeseen events."],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/illustration-house-insurance_53876-6171.jpg"},
|
||||
]}
|
||||
title="Our Roofing Expertise"
|
||||
description="Professional solutions tailored to every home and business, ensuring durability and style for years to come."
|
||||
@@ -207,25 +144,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "3",
|
||||
description: "Generations of roofing mastery and craftsmanship",
|
||||
},
|
||||
id: "m1", value: "3", description: "Generations of roofing mastery and craftsmanship"},
|
||||
{
|
||||
id: "m2",
|
||||
value: "Premium",
|
||||
description: "Only the highest grade roofing materials used",
|
||||
},
|
||||
id: "m2", value: "Premium", description: "Only the highest grade roofing materials used"},
|
||||
{
|
||||
id: "m3",
|
||||
value: "100%",
|
||||
description: "Unwavering commitment to client happiness",
|
||||
},
|
||||
id: "m3", value: "100%", description: "Unwavering commitment to client happiness"},
|
||||
{
|
||||
id: "m4",
|
||||
value: "Licensed",
|
||||
description: "Fully bonded and insured for peace of mind",
|
||||
},
|
||||
id: "m4", value: "Licensed", description: "Fully bonded and insured for peace of mind"},
|
||||
]}
|
||||
title="Why JM Roofing Stands Above the Rest"
|
||||
description="We don't just work on roofs; we protect your most valuable investment."
|
||||
@@ -237,14 +162,10 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="A Legacy You Can Trust"
|
||||
description={[
|
||||
"JM Roofing 3rd Generation is built on decades of experience passed down through generations. We don't just install roofs — we protect homes, families, and investments.",
|
||||
"Serving Los Angeles County with pride, our mission is simple: deliver high-quality roofing that stands the test of time.",
|
||||
]}
|
||||
"JM Roofing 3rd Generation is built on decades of experience passed down through generations. We don't just install roofs — we protect homes, families, and investments.", "Serving Los Angeles County with pride, our mission is simple: deliver high-quality roofing that stands the test of time."]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Estimate",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Get Free Estimate", href: "#contact"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -257,59 +178,23 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "g1",
|
||||
brand: "Residential",
|
||||
name: "Modern Luxury Home",
|
||||
price: "Completed",
|
||||
rating: 5,
|
||||
reviewCount: "Gallery",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-working-roof-with-drill_23-2148748770.jpg",
|
||||
},
|
||||
id: "g1", brand: "Residential", name: "Modern Luxury Home", price: "Completed", rating: 5,
|
||||
reviewCount: "Gallery", imageSrc: "http://img.b2bpic.net/free-photo/man-working-roof-with-drill_23-2148748770.jpg"},
|
||||
{
|
||||
id: "g2",
|
||||
brand: "Commercial",
|
||||
name: "Office Complex",
|
||||
price: "Completed",
|
||||
rating: 5,
|
||||
reviewCount: "Gallery",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-industrial-worker-standing-by-metal-industrial-building_342744-446.jpg",
|
||||
},
|
||||
id: "g2", brand: "Commercial", name: "Office Complex", price: "Completed", rating: 5,
|
||||
reviewCount: "Gallery", imageSrc: "http://img.b2bpic.net/free-photo/portrait-industrial-worker-standing-by-metal-industrial-building_342744-446.jpg"},
|
||||
{
|
||||
id: "g3",
|
||||
brand: "Detailing",
|
||||
name: "Premium Material",
|
||||
price: "Detail",
|
||||
rating: 5,
|
||||
reviewCount: "Gallery",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-15702.jpg",
|
||||
},
|
||||
id: "g3", brand: "Detailing", name: "Premium Material", price: "Detail", rating: 5,
|
||||
reviewCount: "Gallery", imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-15702.jpg"},
|
||||
{
|
||||
id: "g4",
|
||||
brand: "Residential",
|
||||
name: "Architectural Design",
|
||||
price: "Completed",
|
||||
rating: 5,
|
||||
reviewCount: "Gallery",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-modern-house-roof_23-2149343645.jpg",
|
||||
},
|
||||
id: "g4", brand: "Residential", name: "Architectural Design", price: "Completed", rating: 5,
|
||||
reviewCount: "Gallery", imageSrc: "http://img.b2bpic.net/free-photo/low-angle-modern-house-roof_23-2149343645.jpg"},
|
||||
{
|
||||
id: "g5",
|
||||
brand: "Restoration",
|
||||
name: "Before & After",
|
||||
price: "Restored",
|
||||
rating: 5,
|
||||
reviewCount: "Gallery",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-buildings-with-red-roofs-sunlight_181624-5655.jpg",
|
||||
},
|
||||
id: "g5", brand: "Restoration", name: "Before & After", price: "Restored", rating: 5,
|
||||
reviewCount: "Gallery", imageSrc: "http://img.b2bpic.net/free-photo/white-buildings-with-red-roofs-sunlight_181624-5655.jpg"},
|
||||
{
|
||||
id: "g6",
|
||||
brand: "Process",
|
||||
name: "Installation Work",
|
||||
price: "Ongoing",
|
||||
rating: 5,
|
||||
reviewCount: "Gallery",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-engaged-household-task_23-2151741210.jpg",
|
||||
},
|
||||
id: "g6", brand: "Process", name: "Installation Work", price: "Ongoing", rating: 5,
|
||||
reviewCount: "Gallery", imageSrc: "http://img.b2bpic.net/free-photo/man-engaged-household-task_23-2151741210.jpg"},
|
||||
]}
|
||||
title="Project Gallery"
|
||||
description="Real-world examples of our dedication to craftsmanship."
|
||||
@@ -323,40 +208,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah Miller",
|
||||
handle: "Homeowner",
|
||||
testimonial: "Professional, fast, and the quality is top-tier. Highly recommend!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-businesswoman-with-notebook-holding-her-diary-planner-sitting-office_1258-194721.jpg",
|
||||
},
|
||||
id: "t1", name: "Sarah Miller", handle: "Homeowner", testimonial: "Professional, fast, and the quality is top-tier. Highly recommend!", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-businesswoman-with-notebook-holding-her-diary-planner-sitting-office_1258-194721.jpg"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "David Chen",
|
||||
handle: "Property Manager",
|
||||
testimonial: "They treated my home like their own — amazing service.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-confident-stylish-hipster-lambersexual-modelmodern-man-dressed-blue-shirt-fashion-male-posing-near-skyscraper-street-background-sunglasses-outdoors-sunsetcrossed-arms_158538-20771.jpg",
|
||||
},
|
||||
id: "t2", name: "David Chen", handle: "Property Manager", testimonial: "They treated my home like their own — amazing service.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-confident-stylish-hipster-lambersexual-modelmodern-man-dressed-blue-shirt-fashion-male-posing-near-skyscraper-street-background-sunglasses-outdoors-sunsetcrossed-arms_158538-20771.jpg"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "The Rodriguez Family",
|
||||
handle: "Residential",
|
||||
testimonial: "3rd generation experts who clearly care about quality. Incredible work.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-shaking-hands_23-2148920604.jpg",
|
||||
},
|
||||
id: "t3", name: "The Rodriguez Family", handle: "Residential", testimonial: "3rd generation experts who clearly care about quality. Incredible work.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-shaking-hands_23-2148920604.jpg"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Robert Johnson",
|
||||
handle: "Homeowner",
|
||||
testimonial: "The best experience I've had with any contractor. Fast, clean, reliable.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-blueprint-copy-space_23-2148269819.jpg",
|
||||
},
|
||||
id: "t4", name: "Robert Johnson", handle: "Homeowner", testimonial: "The best experience I've had with any contractor. Fast, clean, reliable.", imageSrc: "http://img.b2bpic.net/free-photo/man-with-blueprint-copy-space_23-2148269819.jpg"},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Elena Smith",
|
||||
handle: "Residential",
|
||||
testimonial: "Professionalism at its finest. My new roof looks absolutely stunning.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-hispanic-woman-architect-doing-ok-gesture-with-thumbs-up-street_839833-29290.jpg",
|
||||
},
|
||||
id: "t5", name: "Elena Smith", handle: "Residential", testimonial: "Professionalism at its finest. My new roof looks absolutely stunning.", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-hispanic-woman-architect-doing-ok-gesture-with-thumbs-up-street_839833-29290.jpg"},
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Join our community of protected and satisfied homeowners."
|
||||
@@ -367,12 +227,11 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
tag="Let's Talk"
|
||||
title="Need a Roof You Can Rely On?"
|
||||
description="Get a free estimate today and experience roofing done right."
|
||||
buttonText="Get Free Quote"
|
||||
buttonText="Get Your Free Estimate Today"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -382,33 +241,21 @@ export default function LandingPage() {
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
label: "Services", href: "#services"},
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
label: "About", href: "#about"},
|
||||
{
|
||||
label: "Gallery",
|
||||
href: "#gallery",
|
||||
},
|
||||
label: "Gallery", href: "#gallery"},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "1242 E 59th St, LA, CA",
|
||||
href: "#",
|
||||
},
|
||||
label: "1242 E 59th St, LA, CA", href: "#"},
|
||||
{
|
||||
label: "Call: 323-245-9154",
|
||||
href: "tel:+13232459154",
|
||||
},
|
||||
label: "Call: 323-245-9154", href: "tel:+13232459154"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -418,4 +265,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user