291 lines
14 KiB
TypeScript
291 lines
14 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import { Sparkles, CheckCircle } from "lucide-react";
|
|
import Link from "next/link";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
|
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="mediumSmall"
|
|
sizing="mediumLargeSizeLargeTitles"
|
|
background="none"
|
|
cardStyle="subtle-shadow"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Metal Roofing", id: "/metal-roofing" },
|
|
{ name: "Services", id: "/services" },
|
|
{ name: "Projects", id: "/projects" },
|
|
{ name: "Contact", id: "/contact" }
|
|
]}
|
|
brandName="Martinez Metal Roofing"
|
|
bottomLeftText="Standing Seam Specialists"
|
|
bottomRightText="joseph@martinez-roofing.com"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardGallery
|
|
title="Premium Metal Roofing & Construction — Built With Precision"
|
|
description="From standing seam installs to repairs and custom construction, we deliver a clean finish, clear communication, and results that last. Fast, responsive service you can trust."
|
|
tag="5-Star Craftsmanship"
|
|
tagIcon={Sparkles}
|
|
tagAnimation="slide-up"
|
|
background={{ variant: "plain" }}
|
|
buttons={[
|
|
{ text: "Get a Free Estimate", href: "/contact" },
|
|
{ text: "Call / Text Joseph", href: "tel:+1-555-0123" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/long-shot-roofer-working-with-helmet_23-2149343709.jpg?_wi=1",
|
|
imageAlt: "Metal standing seam roofing installation"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/full-shot-roofers-working-with-helmets_23-2149343708.jpg?_wi=1",
|
|
imageAlt: "Professional metal roof construction"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/modern-stadium_1127-110.jpg?_wi=1",
|
|
imageAlt: "Modern metal roofing design"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=1",
|
|
imageAlt: "Expert roofing craftsmanship"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/specialist-technician-professional-engineer-with-laptop-tablet-maintenance-checking-installing-solar-roof-panel-factory-rooftop-sunlight-engineers-team-survey-check-solar-panel-roof_609648-2202.jpg?_wi=1",
|
|
imageAlt: "Standing seam durability and precision"
|
|
}
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
ariaLabel="Hero section showcasing premium metal roofing services"
|
|
/>
|
|
</div>
|
|
|
|
<div id="why-choose" data-section="why-choose">
|
|
<FeatureCardTwentyThree
|
|
title="Why Homeowners Choose Martinez"
|
|
description="Top-tier craftsmanship paired with honest communication. We listen, explain clearly, and deliver results that exceed expectations."
|
|
features={[
|
|
{
|
|
id: "1",
|
|
title: "Responsive & Professional Communication",
|
|
tags: ["Quick Replies", "Clear Next Steps"],
|
|
imageSrc: "https://img.b2bpic.net/free-photo/men-standing-brick-wall-building-construction_259150-57715.jpg?_wi=1",
|
|
imageAlt: "Professional roofing team"
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "Standing Seam Expertise",
|
|
tags: ["Premium Installs", "Precision Detail"],
|
|
imageSrc: "https://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=2",
|
|
imageAlt: "Standing seam metal roofing installation"
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "Respectful Job Sites & Clean Finishes",
|
|
tags: ["Organized Work", "No Mess Left"],
|
|
imageSrc: "https://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13101.jpg?_wi=1",
|
|
imageAlt: "Professional and clean job site"
|
|
}
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Why choose Martinez section with key benefits"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<ProductCardFour
|
|
title="Services Built Around Metal Roofing Excellence"
|
|
description="From new installations to repairs and custom construction, we handle every detail with precision and care."
|
|
products={[
|
|
{
|
|
id: "standing-seam",
|
|
name: "Standing Seam Metal Roofing",
|
|
price: "Custom Quote",
|
|
variant: "New Installs • Re-roofs • Cottage & Barn",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=3",
|
|
imageAlt: "Standing seam metal roofing"
|
|
},
|
|
{
|
|
id: "repairs",
|
|
name: "Repairs & Metal Panel Replacement",
|
|
price: "Custom Quote",
|
|
variant: "Leak Diagnostics • Panel Replacement • Flashing",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13101.jpg?_wi=2",
|
|
imageAlt: "Metal roof repair and maintenance"
|
|
},
|
|
{
|
|
id: "construction",
|
|
name: "Construction & Exterior Projects",
|
|
price: "Custom Quote",
|
|
variant: "Structural Repairs • Exterior Upgrades • Custom Work",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-people-working-as-team_23-2149366653.jpg",
|
|
imageAlt: "Construction and exterior improvements"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
animationType="slide-up"
|
|
useInvertedBackground={false}
|
|
buttons={[
|
|
{ text: "Request Pricing & Availability", href: "/contact" }
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
ariaLabel="Services section featuring roofing and construction offerings"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
title="Built for Busy Seasons — Without the Runaround"
|
|
description="Many homeowners expect metal roofing to take months, especially in peak season. We stay responsive, communicate clearly, and schedule realistically so your project moves forward without surprises. Our repeat customers know we deliver on promises."
|
|
tag="Why We Stand Out"
|
|
tagIcon={CheckCircle}
|
|
tagAnimation="slide-up"
|
|
metrics={[
|
|
{
|
|
value: "100+",
|
|
title: "Successful Projects Completed"
|
|
},
|
|
{
|
|
value: "50%",
|
|
title: "Repeat & Referral Customers"
|
|
}
|
|
]}
|
|
imageSrc="https://img.b2bpic.net/free-photo/men-standing-brick-wall-building-construction_259150-57715.jpg?_wi=2"
|
|
imageAlt="Martinez Metal Roofing team at work"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
useInvertedBackground={false}
|
|
ariaLabel="About section highlighting project success and customer loyalty"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
title="Why Customers Keep Hiring Us Again"
|
|
description="5-star results and trusted partnerships. See what homeowners say about their experience with Martinez."
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
title: "Second Home, Second Great Experience",
|
|
quote: "We hired Martinez for our first home roof, and we were so impressed we called them back for our cottage. That's how you know it's a great company.",
|
|
name: "Sarah Mitchell",
|
|
role: "Homeowner",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg?_wi=1",
|
|
imageAlt: "Sarah Mitchell"
|
|
},
|
|
{
|
|
id: "2",
|
|
title: "Prompt, On-Schedule, Easy to Work With",
|
|
quote: "From the initial call to the final walkthrough, everything went smoothly. They showed up on time and communicated every step of the way.",
|
|
name: "Michael Chen",
|
|
role: "Homeowner",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=1",
|
|
imageAlt: "Michael Chen"
|
|
},
|
|
{
|
|
id: "3",
|
|
title: "Professional Standing Seam Installation",
|
|
quote: "The standing seam roof looks incredible. The precision and attention to detail is obvious the moment you look at it. Highly recommend.",
|
|
name: "Emily Rodriguez",
|
|
role: "Homeowner",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/woman-showing-ok-sign_23-2148990150.jpg?_wi=1",
|
|
imageAlt: "Emily Rodriguez"
|
|
},
|
|
{
|
|
id: "4",
|
|
title: "No Trace Left Behind — Top Notch Work",
|
|
quote: "What impressed me most was how clean they kept the job site. No debris, no mess, and the work quality speaks for itself. Truly professional.",
|
|
name: "David Kim",
|
|
role: "Property Owner",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/happy-businesswoman-smiling-looking-camera-successful-confident-grey-haired-manager-sitting-office-room-workplace-business-management-concept_74855-7343.jpg?_wi=1",
|
|
imageAlt: "David Kim"
|
|
},
|
|
{
|
|
id: "5",
|
|
title: "Fast, Reliable, and Expert Knowledge",
|
|
quote: "Joseph and his team bring real expertise to every project. They answered all my questions and made the whole experience stress-free.",
|
|
name: "Jennifer Walsh",
|
|
role: "Homeowner",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1",
|
|
imageAlt: "Jennifer Walsh"
|
|
},
|
|
{
|
|
id: "6",
|
|
title: "Exceeded Expectations on Every Front",
|
|
quote: "Clear communication, fair pricing, excellent craftsmanship. This is what premium service looks like. Already planning my next project with them.",
|
|
name: "Robert Martinez",
|
|
role: "Homeowner",
|
|
imageSrc: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg?_wi=2",
|
|
imageAlt: "Robert Martinez"
|
|
}
|
|
]}
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
ariaLabel="Customer testimonials highlighting quality and reliability"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="https://img.b2bpic.net/free-photo/photo-metal-texture-pattern_58702-13840.jpg?_wi=1"
|
|
imageAlt="Metal roofing texture and detail"
|
|
logoText="Martinez Metal Roofing & Construction"
|
|
copyrightText="© 2025 Martinez Metal Roofing & Construction. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Services",
|
|
items: [
|
|
{ label: "Standing Seam Roofing", href: "/metal-roofing" },
|
|
{ label: "Repairs & Replacement", href: "/metal-roofing" },
|
|
{ label: "Construction Projects", href: "/metal-roofing" },
|
|
{ label: "Get an Estimate", href: "/contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Recent Projects", href: "/projects" },
|
|
{ label: "Customer Reviews", href: "#testimonials" },
|
|
{ label: "Contact Us", href: "/contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Contact",
|
|
items: [
|
|
{ label: "Call / Text Joseph", href: "tel:+1-555-0123" },
|
|
{ label: "Email", href: "mailto:joseph@martinez-roofing.com" },
|
|
{ label: "Service Area", href: "#" },
|
|
{ label: "Get a Free Estimate", href: "/contact" }
|
|
]
|
|
}
|
|
]}
|
|
ariaLabel="Site footer with navigation and contact information"
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |