345 lines
17 KiB
TypeScript
345 lines
17 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
|
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
|
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
|
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import { Award, Building, CheckCircle, Cog, HelpCircle, Phone, ShieldCheck, Star } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="mediumLarge"
|
|
background="grid"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="shadow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "#home"},
|
|
{
|
|
name: "Services", id: "#services"},
|
|
{
|
|
name: "Why Choose Us", id: "#why-us"},
|
|
{
|
|
name: "Testimonials", id: "#testimonials"},
|
|
{
|
|
name: "FAQ", id: "#faq"},
|
|
{
|
|
name: "Contact", id: "#contact"},
|
|
]}
|
|
brandName="Carrollton Roofing"
|
|
bottomLeftText="Carrollton, TX"
|
|
bottomRightText="info@carrolltonroofing.com"
|
|
button={{
|
|
text: "Get a Free Quote", href: "#contact"}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="home" data-section="home">
|
|
<HeroBillboardGallery
|
|
background={{
|
|
variant: "downward-rays-static"}}
|
|
title="Your Trusted Roofing Partner in Carrollton"
|
|
description="Providing top-quality roofing services, from new installations to reliable repairs. Protect your home with our expert craftsmanship and durable materials."
|
|
tag="Carrollton's #1 Roofers"
|
|
tagIcon={Star}
|
|
buttons={[
|
|
{
|
|
text: "Get a Free Estimate", href: "#contact"},
|
|
{
|
|
text: "Explore Services", href: "#services"},
|
|
]}
|
|
buttonAnimation="slide-up"
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/city-building-corner_23-2148107110.jpg", imageAlt: "Professional roof installation on a modern home"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-working-roof-with-hammer-full-shot_23-2149343668.jpg", imageAlt: "Team of roofers installing shingles"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/aerial-shot-port-piers_181624-54848.jpg", imageAlt: "Drone view of a detailed roof inspection"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-working-roof-with-drill_23-2148748770.jpg", imageAlt: "Roofer repairing damaged roof shingles"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/roof-pattern_1203-3266.jpg", imageAlt: "Beautiful newly installed roof on a house"},
|
|
]}
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TestimonialAboutCard
|
|
useInvertedBackground={false}
|
|
tag="About Us"
|
|
tagIcon={Building}
|
|
title="Experience & Excellence in Every Shingle"
|
|
description="Carrollton Roofing is dedicated to delivering superior roofing solutions that stand the test of time. With years of experience serving the Carrollton community, we pride ourselves on exceptional quality, integrity, and customer satisfaction."
|
|
subdescription="Our team of certified professionals uses only the highest-grade materials, ensuring your home is protected with a reliable and beautiful roof."
|
|
icon={Cog}
|
|
imageSrc="http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-17.jpg"
|
|
imageAlt="Exterior of a well-maintained residential house"
|
|
mediaAnimation="opacity"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<ProductCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
carouselMode="buttons"
|
|
products={[
|
|
{
|
|
id: "service-1", name: "Asphalt Shingle Roofing", price: "Durable & Classic", imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13174.jpg", imageAlt: "Close up of asphalt shingles on a roof"},
|
|
{
|
|
id: "service-2", name: "Metal Roofing Systems", price: "Long-lasting & Modern", imageSrc: "http://img.b2bpic.net/free-photo/striped-facade-modern-building_122409-67.jpg", imageAlt: "Modern metal roofing panels"},
|
|
{
|
|
id: "service-3", name: "Tile & Slate Roofing", price: "Elegant & Resilient", imageSrc: "http://img.b2bpic.net/free-photo/urban-architectural-texture-close-up_23-2151900430.jpg", imageAlt: "Red clay tile roof"},
|
|
{
|
|
id: "service-4", name: "Flat Roofing Solutions", price: "Commercial & Industrial", imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg", imageAlt: "Commercial flat roof"},
|
|
{
|
|
id: "service-5", name: "Roof Repair & Maintenance", price: "Extend Roof Lifespan", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-cat-floor-house_23-2149304095.jpg", imageAlt: "Roofer repairing a damaged shingle"},
|
|
{
|
|
id: "service-6", name: "Gutter Installation", price: "Complete Water Management", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-into-solid-fuel-boiler-working-with-biofuels-economical-heating-top-view_169016-14804.jpg", imageAlt: "Seamless gutter installation on a house"},
|
|
]}
|
|
title="Our Comprehensive Roofing Services"
|
|
description="From minor repairs to complete roof replacements, we offer a full spectrum of services to meet your needs with precision and quality."
|
|
tag="Our Expertise"
|
|
tagIcon={Building}
|
|
/>
|
|
</div>
|
|
|
|
<div id="why-us" data-section="why-us">
|
|
<FeatureCardTen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Quality Materials", description: "We source and install only the highest-grade, weather-resistant materials to ensure your roof's longevity and performance.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/abstract-geometric-background-shapes-texture_1194-306805.jpg", imageAlt: "Close up of various roofing material samples"},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Durable Shingles"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Weather Resistance"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Manufacturer Warranties"},
|
|
],
|
|
reverse: false
|
|
},
|
|
{
|
|
title: "Expert Craftsmanship", description: "Our team consists of highly skilled and certified roofers, committed to precision and excellence in every project.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-people-traveling-camping_23-2149775850.jpg", imageAlt: "Roofer carefully placing a shingle"},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Certified Professionals"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Attention to Detail"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Proven Techniques"},
|
|
],
|
|
reverse: true
|
|
},
|
|
{
|
|
title: "Customer Satisfaction", description: "Your peace of mind is our priority. We ensure clear communication, timely completion, and a clean worksite.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-cute-couple-repairs-room_1157-25146.jpg", imageAlt: "Happy homeowner smiling with a roofer"},
|
|
items: [
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Transparent Process"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "On-Time Completion"},
|
|
{
|
|
icon: CheckCircle,
|
|
text: "Clean Site Guarantee"},
|
|
],
|
|
reverse: false
|
|
}
|
|
]}
|
|
title="Why Choose Carrollton Roofing?"
|
|
description="We are dedicated to providing the best roofing experience, combining superior materials with unparalleled customer service."
|
|
tag="Our Commitment"
|
|
tagIcon={ShieldCheck}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah J.", role: "Homeowner", company: "Carrollton", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/3d-geometric-abstract-background_1048-17367.jpg", imageAlt: "Newly installed roof on Sarah's home"},
|
|
{
|
|
id: "2", name: "Michael D.", role: "Property Manager", company: "Dallas", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-wooden-house-with-big-windows_23-2149343704.jpg", imageAlt: "Well-maintained roof on Michael's property"},
|
|
{
|
|
id: "3", name: "Emily R.", role: "Residential Client", company: "Plano", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-roofer-working-with-protection-helmet_23-2149343637.jpg", imageAlt: "Close up of roof repairs completed for Emily"},
|
|
{
|
|
id: "4", name: "David K.", role: "Business Owner", company: "Frisco", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-practicing-tai-chi-outside_23-2149893705.jpg", imageAlt: "Before and after of David's roof renovation"},
|
|
{
|
|
id: "5", name: "Jessica L.", role: "Homeowner", company: "Lewisville", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/low-angle-closeup-shot-black-fire-escape-stairs_181624-3131.jpg", imageAlt: "Commercial building flat roof maintained by Carrollton Roofing"},
|
|
]}
|
|
kpiItems={[
|
|
{
|
|
value: "400+", label: "Projects Completed"},
|
|
{
|
|
value: "15+", label: "Years in Business"},
|
|
{
|
|
value: "5/5", label: "Average Rating"},
|
|
]}
|
|
title="Hear From Our Satisfied Clients"
|
|
description="Our commitment to quality and customer service is reflected in the words of those we've proudly served."
|
|
tag="Testimonials"
|
|
tagIcon={Star}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardSeven
|
|
animationType="depth-3d"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{
|
|
id: "metric-1", value: "20+", title: "Years of Experience", items: [
|
|
"Serving Carrollton & surrounding areas", "Deep local market knowledge", "Established community trust"],
|
|
},
|
|
{
|
|
id: "metric-2", value: "99%", title: "Customer Satisfaction", items: [
|
|
"Referrals are our biggest compliment", "Dedicated post-service support", "Consistently exceeding expectations"],
|
|
},
|
|
{
|
|
id: "metric-3", value: "A+", title: "BBB Rating", items: [
|
|
"Committed to ethical business practices", "Transparent pricing & service", "Trusted by independent organizations"],
|
|
},
|
|
]}
|
|
title="Our Track Record of Success"
|
|
description="Decades of dedicated service and thousands of satisfied clients speak volumes about our commitment to excellence in roofing."
|
|
tag="Trust & Reliability"
|
|
tagIcon={Award}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqDouble
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "faq-1", title: "What types of roofing services do you offer?", content: "We offer a full range of roofing services including new roof installations, roof replacements, repairs for leaks and storm damage, routine maintenance, and gutter installation for both residential and commercial properties."},
|
|
{
|
|
id: "faq-2", title: "How long does a typical roof replacement take?", content: "The duration of a roof replacement depends on the size and complexity of your roof. Generally, most residential roof replacements can be completed within 1-3 days, weather permitting. We'll provide a detailed timeline with your estimate."},
|
|
{
|
|
id: "faq-3", title: "Do you offer free estimates?", content: "Yes, we provide free, no-obligation estimates for all our roofing services. Contact us today to schedule an inspection and get a detailed quote tailored to your needs."},
|
|
{
|
|
id: "faq-4", title: "Are your roofers licensed and insured?", content: "Absolutely. All our roofing technicians are fully licensed, insured, and undergo continuous training to ensure they meet the highest industry standards for safety and quality."},
|
|
{
|
|
id: "faq-5", title: "What kind of warranty do you offer?", content: "We stand behind our work with comprehensive warranties on both materials and labor. Specific warranty details will be provided with your service agreement, ensuring your peace of mind."},
|
|
{
|
|
id: "faq-6", title: "How often should I have my roof inspected?", content: "We recommend having your roof inspected at least once a year, preferably in the spring or fall, and after any major storm. Regular inspections can identify potential issues early, preventing costly repairs down the line."},
|
|
]}
|
|
title="Frequently Asked Questions"
|
|
description="Find answers to common questions about our roofing services, processes, and what to expect."
|
|
tag="Support"
|
|
tagIcon={HelpCircle}
|
|
faqsAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCTA
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "sparkles-gradient"}}
|
|
tag="Contact Us"
|
|
tagIcon={Phone}
|
|
title="Ready for a Durable Roof? Get a Free Estimate Today!"
|
|
description="Contact Carrollton Roofing to discuss your project. Our experts are ready to provide reliable advice and a transparent quote for your roofing needs."
|
|
buttons={[
|
|
{
|
|
text: "Call Us Now", href: "tel:+19725551234"},
|
|
{
|
|
text: "Email Us", href: "mailto:info@carrolltonroofing.com"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
logoText="Carrollton Roofing"
|
|
columns={[
|
|
{
|
|
title: "Services", items: [
|
|
{
|
|
label: "New Roofs", href: "#services"},
|
|
{
|
|
label: "Roof Repair", href: "#services"},
|
|
{
|
|
label: "Inspections", href: "#services"},
|
|
{
|
|
label: "Gutters", href: "#services"},
|
|
],
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{
|
|
label: "About Us", href: "#about"},
|
|
{
|
|
label: "Testimonials", href: "#testimonials"},
|
|
{
|
|
label: "Why Choose Us", href: "#why-us"},
|
|
{
|
|
label: "FAQ", href: "#faq"},
|
|
],
|
|
},
|
|
{
|
|
title: "Connect", items: [
|
|
{
|
|
label: "Contact", href: "#contact"},
|
|
{
|
|
label: "Get a Quote", href: "#contact"},
|
|
{
|
|
label: "Careers", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
copyrightText="© 2024 Carrollton Roofing. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|