bender/b7a81096-070d-4d85-8b76-bbf487afbdc0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #3

Merged
bender merged 2 commits from version_1 into main 2026-03-24 03:55:07 +00:00
Conversation 0 Commits 2 Files Changed 2 +70 -220
2 changed files with 70 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

252
src/app/about/page.tsx
View File

@@ -2,14 +2,11 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterBase from '@/components/sections/footer/FooterBase';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
export default function LandingPage() {
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
@@ -24,204 +21,57 @@ export default function LandingPage() {
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "home",
href: "/",
},
{
name: "About",
id: "about",
href: "/about",
},
{
name: "Services",
id: "services",
href: "/services",
},
{
name: "Projects",
id: "projects",
href: "/before-after",
},
{
name: "Reviews",
id: "reviews",
href: "/reviews",
},
{
name: "Contact",
id: "contact",
href: "/contact",
},
]}
brandName="Mr. P Lopez Roofing"
button={{
text: "Get Free Estimate",
href: "/contact",
}}
animateOnLoad={true}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home", id: "/"},
{
name: "About", id: "/about"},
{
name: "Services", id: "/services"},
{
name: "Projects", id: "/before-after"},
{
name: "Reviews", id: "/reviews"},
{
name: "Contact", id: "/contact"}
]}
brandName="Mr. P Lopez Roofing"
button={{
text: "Get Free Estimate", href: "/contact"}}
animateOnLoad={true}
/>
</div>
<div id="about-intro" data-section="about-intro">
<SplitAbout
textboxLayout="split"
useInvertedBackground={false}
title="Our Story: Quality Roofing Built on Trust"
description="For over 20 years, Mr. P Lopez Roofing has been dedicated to providing unparalleled roofing services to our community. Our journey began with a simple commitment: to deliver exceptional craftsmanship, reliable solutions, and honest service on every project. We've grown, but our core values remain the same, ensuring every roof we touch stands the test of time."
bulletPoints={[
{
title: "Experienced Professionals",
description: "Our team consists of highly trained and certified roofing specialists.",
},
{
title: "Customer Satisfaction Guarantee",
description: "Your peace of mind is our top priority, backed by our solid guarantee.",
},
{
title: "High-Quality Materials",
description: "We partner with leading manufacturers to use only the best materials.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/young-man-looking-into-solid-fuel-boiler-working-with-biofuels-economical-heating-top-view_169016-14806.jpg"
imageAlt="experienced roofer on ladder"
mediaAnimation="none"
/>
</div>
<div id="about-page-story" data-section="about-page-story">
<MediaAbout
useInvertedBackground={false}
title="Built on Trust, Not Shortcuts"
description="After seeing too many homeowners get burned by poor workmanship, Pedro built his business around doing things the right way—no shortcuts, no hidden problems left behind. Every job starts with a full inspection, clear explanation, and honest recommendation."
imageSrc="http://img.b2bpic.net/free-photo/young-man-looking-into-solid-fuel-boiler-working-with-biofuels-economical-heating-top-view_169016-14806.jpg"
imageAlt="Pedro Lopez, a professional roofer on a roof, symbolizing trust and expertise"
/>
</div>
<div id="about-metrics" data-section="about-metrics">
<MetricCardFourteen
useInvertedBackground={true}
title="Decades of Dedicated Service & Excellence"
tag="Our Impact"
metrics={[
{
id: "1",
value: "20+",
description: "Years in Business",
},
{
id: "2",
value: "500+",
description: "Satisfied Clients",
},
{
id: "3",
value: "1000+",
description: "Projects Completed",
},
]}
metricsAnimation="blur-reveal"
/>
</div>
<div id="about-team" data-section="about-team">
<TeamCardFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Meet the Experts Behind Your Durable Roof"
description="Our skilled team brings expertise, dedication, and a passion for perfection to every roofing challenge. We're more than just roofers; we're craftsmen committed to protecting your home with integrity and precision."
/>
</div>
<div id="about-cta" data-section="about-cta">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "radial-gradient",
}}
tag="Ready to Start?"
title="Let's Discuss Your Roofing Project"
description="Whether it's a new installation, a complex repair, or routine maintenance, our team is ready to provide a free consultation and a detailed estimate. Your roof is our priority, and quality is our promise."
buttons={[
{
text: "Get a Free Quote",
href: "/contact",
},
{
text: "Call Us Today",
href: "tel:+1234567890",
},
]}
/>
</div>
<div id="footer-about" data-section="footer-about">
<FooterBase
columns={[
{
title: "Services",
items: [
{
label: "Roof Repair",
href: "/services#repair",
},
{
label: "New Installations",
href: "/services#installation",
},
{
label: "Maintenance",
href: "/services#maintenance",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Our Work",
href: "/before-after",
},
{
label: "Reviews",
href: "/reviews",
},
],
},
{
title: "Contact",
items: [
{
label: "Get a Quote",
href: "/contact",
},
{
label: "Call Us",
href: "tel:+1234567890",
},
{
label: "Email Us",
href: "mailto:info@misterlopezroofing.com",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "/privacy",
},
{
label: "Terms of Service",
href: "/terms",
},
],
},
]}
copyrightText="© 2025 Mr. P Lopez Roofing. All rights reserved."
/>
</div>
<div id="about-page-values" data-section="about-page-values">
<MetricCardFourteen
useInvertedBackground={false}
title="Our Core Values"
tag="Guiding Principles"
metrics={[
{
id: "1", value: "Transparency", description: "Clear explanations and honest recommendations every step of the way."},
{
id: "2", value: "Precision", description: "Meticulous attention to detail ensures every job is done right the first time."},
{
id: "3", value: "Reliability", description: "Fast response times and consistent, dependable service you can trust."},
{
id: "4", value: "Respect", description: "Treating every home and homeowner with the utmost care and professionalism."}
]}
metricsAnimation="slide-up"
/>
</div>
</ReactLenis>
</ThemeProvider>
);

38
src/app/page.tsx
View File

@@ -41,7 +41,7 @@ export default function LandingPage() {
{
name: "Reviews", id: "/reviews"},
{
name: "Contact", id: "/contact"},
name: "Contact", id: "/contact"}
]}
brandName="Mr. P Lopez Roofing"
button={{
@@ -63,14 +63,14 @@ export default function LandingPage() {
{
value: "Fast", label: "Response Time"},
{
value: "Affordable", label: "Solutions"},
value: "Affordable", label: "Solutions"}
]}
enableKpiAnimation={true}
buttons={[
{
text: "Get Free Estimate", href: "/contact"},
{
text: "Call Now", href: "tel:123-456-7890"},
text: "Call Now", href: "tel:123-456-7890"}
]}
imageSrc="http://img.b2bpic.net/free-photo/carpenter-man-working-sideways_23-2148748786.jpg"
imageAlt="Professional roofer inspecting a residential roof"
@@ -104,7 +104,7 @@ export default function LandingPage() {
title: "Gutter Solutions", description: "Replacement & repair, plus drainage correction to eliminate ponding water and protect your foundation.", imageSrc: "http://img.b2bpic.net/free-photo/bleu-run-scarce-bathroom-washroom_1172-546.jpg", imageAlt: "Clean rain gutters on a house"},
{
id: 4,
title: "Roof Coating", description: "Durable aluminum coating to extend your roof's lifespan and enhance energy efficiency.", imageSrc: "http://img.b2bpic.net/free-photo/modern-skyscrapers-japan-business-district_23-2148836784.jpg", imageAlt: "Application of protective roof coating"},
title: "Roof Coating", description: "Durable aluminum coating to extend your roof's lifespan and enhance energy efficiency.", imageSrc: "http://img.b2bpic.net/free-photo/modern-skyscrapers-japan-business-district_23-2148836784.jpg", imageAlt: "Application of protective roof coating"}
]}
title="Our Services"
description="Comprehensive roofing solutions designed for lasting protection and peace of mind."
@@ -124,7 +124,7 @@ export default function LandingPage() {
{
id: "3", value: "Reliable", description: "Same-day assessments. Quick turnaround for your peace of mind."},
{
id: "4", value: "Craftsmanship", description: "Clean, precise, and durable work built to last."},
id: "4", value: "Craftsmanship", description: "Clean, precise, and durable work built to last."}
]}
metricsAnimation="slide-up"
/>
@@ -146,7 +146,7 @@ export default function LandingPage() {
{
src: "http://img.b2bpic.net/free-photo/smiling-middle-aged-attractive-woman-showing-thumb-up-outdoors_1262-12526.jpg", alt: "Customer avatar 3"},
{
src: "http://img.b2bpic.net/free-photo/portrait-smiley-business-woman_23-2148603029.jpg", alt: "Customer avatar 4"},
src: "http://img.b2bpic.net/free-photo/portrait-smiley-business-woman_23-2148603029.jpg", alt: "Customer avatar 4"}
]}
ratingAnimation="opacity"
avatarsAnimation="opacity"
@@ -165,7 +165,7 @@ export default function LandingPage() {
{
text: "Call Now", href: "tel:123-456-7890"},
{
text: "Request Free Estimate", href: "/contact"},
text: "Request Free Estimate", href: "/contact"}
]}
/>
</div>
@@ -173,27 +173,27 @@ export default function LandingPage() {
<div id="about-page-story" data-section="about-page-story">
<MediaAbout
useInvertedBackground={false}
title="Tired of Roofers Cutting Corners?"
description="Leaks coming back? Poor drainage & ponding water? Bad workmanship from previous contractors?\n\nWe identify the root problem—not just the symptoms—and fix it permanently."
imageSrc="http://img.b2bpic.net/free-photo/close-up-men-working-construction_23-2148751990.jpg"
imageAlt="Illustration of a leaking roof and a solution"
title="Built on Trust, Not Shortcuts"
description="After seeing too many homeowners get burned by poor workmanship, Pedro built his business around doing things the right way—no shortcuts, no hidden problems left behind. Every job starts with a full inspection, clear explanation, and honest recommendation."
imageSrc="http://img.b2bpic.net/free-photo/young-man-looking-into-solid-fuel-boiler-working-with-biofuels-economical-heating-top-view_169016-14806.jpg"
imageAlt="Pedro Lopez, a professional roofer on a roof, symbolizing trust and expertise"
/>
</div>
<div id="about-page-values" data-section="about-page-values">
<MetricCardFourteen
useInvertedBackground={false}
title="Why Choose Us"
tag="Our Commitment"
title="Our Core Values"
tag="Guiding Principles"
metrics={[
{
id: "1", value: "Precision", description: "We diagnose problems correctly the first time, fixing what others miss."},
id: "1", value: "Transparency", description: "Clear explanations and honest recommendations every step of the way."},
{
id: "2", value: "Honesty", description: "No inflated estimates. Solutions that fit your budget."},
id: "2", value: "Precision", description: "Meticulous attention to detail ensures every job is done right the first time."},
{
id: "3", value: "Reliable", description: "Same-day assessments. Quick turnaround for your peace of mind."},
id: "3", value: "Reliability", description: "Fast response times and consistent, dependable service you can trust."},
{
id: "4", value: "Craftsmanship", description: "Clean, precise, and durable work built to last."},
id: "4", value: "Respect", description: "Treating every home and homeowner with the utmost care and professionalism."}
]}
metricsAnimation="slide-up"
/>
@@ -211,7 +211,7 @@ export default function LandingPage() {
{
id: "3", title: "Roof Repairs", content: "Leak detection: Our experts precisely locate and permanently fix leaks, even those others miss. Structural fixes: We go beyond surface repairs to ensure the underlying structure is sound and resilient."},
{
id: "4", title: "Roof Coating", content: "Cost-effective alternative: Extend your roof’s lifespan and avoid costly full replacements. Energy efficiency: Our high-quality aluminum coatings also improve insulation and reduce energy bills."},
id: "4", title: "Roof Coating", content: "Cost-effective alternative: Extend your roof’s lifespan and avoid costly full replacements. Energy efficiency: Our high-quality aluminum coatings also improve insulation and reduce energy bills."}
]}
imageSrc="http://img.b2bpic.net/free-photo/man-workbench-using-manual-sandpaper-tool-sander-timber-block_482257-83762.jpg"
imageAlt="Close up of roof flashing installation"
@@ -235,7 +235,7 @@ export default function LandingPage() {
reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/photo-wall-texture-pattern_58702-15371.jpg", imageAlt: "Interior roof leak damage"},
{
id: "2", brand: "Gutter Repair", name: "Before: Clogged Gutters", price: "Fixed", rating: 5,
reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/close-up-japanese-bamboo-fountain_1137-39.jpg", imageAlt: "Clogged rain gutter before cleaning"},
reviewCount: "", imageSrc: "http://img.b2bpic.net/free-photo/close-up-japanese-bamboo-fountain_1137-39.jpg", imageAlt: "Clogged rain gutter before cleaning"}
]}
title="Before & After Transformations"
description="See the dramatic difference precision roofing makes. From severe leaks to perfect drainage, we restore peace of mind."