183 lines
9.0 KiB
TypeScript
183 lines
9.0 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import { Award, Building2, Home, MapPin, ShieldCheck, Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="directional-hover"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="soft"
|
|
contentWidth="mediumLarge"
|
|
sizing="largeSizeMediumTitles"
|
|
background="circleGradient"
|
|
cardStyle="gradient-bordered"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Portfolio", id: "portfolio" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
brandName="Priority Roofing Dallas"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboard
|
|
background={{ variant: "sparkles-gradient" }}
|
|
title="Elite Roofing Protection for Dallas Excellence."
|
|
description="We bring decades of local Dallas market expertise to every luxury roofing project. From historic restorations to modern storm-ready designs, our precision ensures lasting durability for your investment."
|
|
buttons={[
|
|
{ text: "Schedule Your Dallas Inspection", href: "#contact" },
|
|
{ text: "View Our Local Portfolio", href: "#portfolio" },
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13126.jpg"
|
|
imageAlt="Luxury Texas Home Roofing System"
|
|
mediaAnimation="blur-reveal"
|
|
avatarText="Proudly serving Dallas homeowners for over 25 years"
|
|
marqueeItems={[
|
|
{ type: "text", text: "Dallas Market Specialists" },
|
|
{ type: "text", text: "Storm-Ready Texas Resilience" },
|
|
{ type: "text", text: "Architectural Precision" },
|
|
{ type: "text", text: "Premium Materials" },
|
|
{ type: "text", text: "Elite Local Craftsmanship" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
useInvertedBackground={false}
|
|
title="Dallas-Tested Craftsmanship"
|
|
description="At Priority Roofing Dallas, we don't just understand roofing; we understand the Dallas climate. Our team combines deep regional knowledge with architectural-grade materials to deliver roofing systems designed specifically for the extreme conditions of North Texas."
|
|
metrics={[
|
|
{ value: "25+", title: "Years in Dallas Market" },
|
|
{ value: "5k+", title: "Dallas Properties Protected" },
|
|
{ value: "100%", title: "Local Certification" },
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/craftsman-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-frame-ceiling-profile-system-renovation-renovation_166373-1906.jpg"
|
|
imageAlt="Premium roofing craftsmanship"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardTwentyFive
|
|
animationType="depth-3d"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Dallas Residential Experts", description: "Custom-engineered roof systems tailored to match the unique aesthetic and structural needs of Dallas luxury homes.", icon: Home,
|
|
mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beautiful-wooden-house-with-new-roof_23-2149343703.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/low-angle-shot-beautiful-modern-building-middle-city-clear-sky_181624-7463.jpg" }]
|
|
},
|
|
{
|
|
title: "Commercial Performance", description: "High-performance roofing solutions built to exceed Texas energy codes and withstand local weather extremes.", icon: Building2,
|
|
mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/red-metallic-wall-with-sky_23-2148106899.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/low-angle-modern-house-roof_23-2149343645.jpg" }]
|
|
},
|
|
{
|
|
title: "Storm-Ready Metal Solutions", description: "Architectural metal roofing crafted for maximum impact resistance and timeless elegance in the North Texas sun.", icon: Zap,
|
|
mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/city-background-panoramic-view_23-2148892917.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/photo-metal-texture-pattern_58702-13917.jpg" }]
|
|
},
|
|
]}
|
|
title="Specialized Roofing Solutions"
|
|
description="Tailored protection strategies specifically designed for Dallas architecture and climate demands."
|
|
/>
|
|
</div>
|
|
|
|
<div id="portfolio" data-section="portfolio">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{ id: "p1", brand: "Dallas Luxury", name: "Historic Restoration", price: "Custom", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/scratched-metal-background_1048-11658.jpg" },
|
|
{ id: "p2", brand: "Elite Series", name: "Modern Metal Elegance", price: "Custom", rating: 5, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/close-up-shiny-feather-organic-background_23-2148872781.jpg" },
|
|
{ id: "p3", brand: "Commercial", name: "TPO Storm Protection", price: "Custom", rating: 5, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/building-with-coarse-plaster-surface_23-2148252826.jpg" },
|
|
]}
|
|
title="Featured Dallas Projects"
|
|
description="A collection of architectural excellence and storm-ready projects across the DFW Metroplex."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardThree
|
|
animationType="scale-rotate"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{ id: "m1", icon: ShieldCheck, title: "Texas Certified", value: "100%" },
|
|
{ id: "m2", icon: Award, title: "Storm Ready Claims", value: "500+" },
|
|
{ id: "m3", icon: MapPin, title: "Local DFW Presence", value: "25yrs" },
|
|
]}
|
|
title="Dallas Trust & Transparency"
|
|
description="Why top Dallas developers and homeowners rely on our local expertise."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{ id: "1", title: "Local Expertise", quote: "They truly understand the unique weather challenges of Dallas. A seamless experience from start to finish.", name: "Sarah Johnson", role: "Dallas Homeowner" },
|
|
{ id: "2", title: "Reliable Commercial Partner", quote: "Priority Roofing Dallas is our go-to for commercial properties. They know Texas codes inside out.", name: "Michael Chen", role: "Commercial Developer" },
|
|
{ id: "3", title: "Storm-Ready Professionals", quote: "They saved us during storm season. Professional, knowledgeable, and genuinely local.", name: "Emily Rodriguez", role: "DFW Resident" },
|
|
]}
|
|
title="Client Success Stories"
|
|
description="Trusted by the people who power the Dallas economy and culture."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{ variant: "sparkles-gradient" }}
|
|
text="Protect your Dallas home with the experts. Schedule your free local consultation today."
|
|
buttons={[
|
|
{ text: "Start Your Consultation", href: "#contact" },
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoEmphasis
|
|
columns={[
|
|
{
|
|
items: [{ label: "Residential", href: "#services" }, { label: "Commercial", href: "#services" }, { label: "Insurance Claims", href: "#services" }],
|
|
},
|
|
{
|
|
items: [{ label: "Dallas Projects", href: "#portfolio" }, { label: "Our Team", href: "#about" }, { label: "Contact", href: "#contact" }],
|
|
},
|
|
{
|
|
items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }],
|
|
},
|
|
]}
|
|
logoText="Priority Roofing Dallas"
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|