Initial commit

This commit is contained in:
dk
2026-06-10 00:25:01 +00:00
commit 994ff98d59
648 changed files with 80349 additions and 0 deletions

520
src/app/page.tsx Normal file
View File

@@ -0,0 +1,520 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroOverlayTestimonial from '@/components/sections/hero/HeroOverlayTestimonial';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Cloud, FileText, Home, ListChecks, Search, Wrench } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="small"
sizing="largeSmallSizeMediumTitles"
background="circleGradient"
cardStyle="subtle-shadow"
primaryButtonStyle="gradient"
secondaryButtonStyle="layered"
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "#home",
},
{
name: "Services",
id: "#services",
},
{
name: "Gallery",
id: "#before-after",
},
{
name: "Why Choose Us",
id: "#why-choose-telge",
},
{
name: "Reviews",
id: "#reviews",
},
{
name: "FAQ",
id: "#faq",
},
{
name: "Contact",
id: "#contact",
},
]}
logoSrc="http://img.b2bpic.net/free-photo/dark-kitchen-cabinets-with-gold-hardware-details-elegant-interior-with-wooden-counter-plant_169016-72764.jpg"
logoAlt="Telge Roofing Logo"
brandName="Telge Roofing"
button={{
text: "GET FREE INSPECTION",
href: "#contact",
}}
/>
</div>
<div id="home" data-section="home">
<HeroOverlayTestimonial
title="Your Roof Should Add Value. Not Stress."
description="Whether youre dealing with storm damage, an aging roof, or planning a complete exterior transformation, Telge Roofing delivers premium roofing solutions backed by nearly 700 five-star reviews. With free roof inspections, insurance claim assistance, premium roofing systems, and being family-owned since 2009 with background-checked & Google-verified professionals, we ensure peace of mind."
testimonials={[
{
name: "Trusted by Homeowners",
handle: "Nearly 700 Reviews",
testimonial: "4.8 Stars from Nearly 700 Homeowners",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/beauty-style-fashion-femininity-concept-positive-beautiful-young-european-woman-blue-shirt-looking-camera-with-broad-happy-smile-being-good-mood-kitchen-interior-background_343059-2087.jpg",
imageAlt: "professional male portrait smiling",
},
{
name: "Exceptional Service",
handle: "Quality Focused",
testimonial: "Effortless customer experience from start to finish.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/dark-kitchen-cabinets-with-gold-hardware-details-elegant-interior-with-wooden-counter-plant_169016-72764.jpg",
imageAlt: "professional male portrait smiling",
},
{
name: "Premium Protection",
handle: "Lifetime Peace of Mind",
testimonial: "Protecting homes with premium roofing systems for 17+ years.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/iceland-landscape-beautiful-church_23-2149099948.jpg",
imageAlt: "professional male portrait smiling",
},
{
name: "Expert Restoration",
handle: "Storm Ready",
testimonial: "Expert storm restoration ensures your home is safe.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-african-american-woman-cafe_273609-5073.jpg",
imageAlt: "professional male portrait smiling",
},
{
name: "Highly Recommended",
handle: "Client Success",
testimonial: "Professionalism, quality, and communication were outstanding. Truly a five-star experience with Telge Roofing.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/experienced-senior-female-executive-eyeglasses_1262-5027.jpg",
imageAlt: "professional male portrait smiling",
},
]}
buttons={[
{
text: "GET FREE INSPECTION",
href: "#contact",
},
{
text: "VIEW OUR WORK",
href: "#before-after",
},
]}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/dark-kitchen-cabinets-with-gold-hardware-details-elegant-interior-with-wooden-counter-plant_169016-72764.jpg",
alt: "Customer 1",
},
{
src: "http://img.b2bpic.net/free-photo/beautiful-african-american-woman-cafe_273609-5073.jpg",
alt: "Customer 2",
},
{
src: "http://img.b2bpic.net/free-photo/experienced-senior-female-executive-eyeglasses_1262-5027.jpg",
alt: "Customer 3",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-man-smiling-camera_23-2148238839.jpg",
alt: "Customer 4",
},
{
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-work_23-2149304143.jpg",
alt: "Happy homeowner",
},
]}
avatarText="4.8 Stars from Nearly 700 Homeowners"
imageSrc="http://img.b2bpic.net/free-photo/iceland-landscape-beautiful-church_23-2149099948.jpg"
videoSrc="http://img.b2bpic.net/free-photo/palace-china_1127-4075.jpg"
imageAlt="Drone footage of luxury homes"
showDimOverlay={true}
showBlur={true}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTwo
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={true}
metrics={[
{
id: "1",
value: "4.8/5",
description: "Rating",
},
{
id: "2",
value: "693+",
description: "Reviews",
},
{
id: "3",
value: "17+",
description: "Years Serving Houston",
},
{
id: "4",
value: "Google",
description: "Verified",
},
{
id: "5",
value: "Background",
description: "Checked",
},
{
id: "6",
value: "Family",
description: "Owned",
},
]}
title="Our Unmatched Track Record"
description="The numbers speak for themselves — a testament to our commitment to excellence and customer satisfaction."
/>
</div>
<div id="why-choose-telge" data-section="why-choose-telge">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="The Roofing Experience Houston Homeowners Deserve"
description="At Telge Roofing, we redefine what it means to work with a contractor. Our commitment to luxury craftsmanship, transparent service, and lifetime peace of mind ensures an effortless journey from your first inspection to project completion."
metrics={[
{
value: "Premium Consultation",
title: "No pressure. No gimmicks. Just honest recommendations from experienced roofing professionals.",
},
{
value: "White-Glove Project Management",
title: "One dedicated project manager from inspection through completion.",
},
{
value: "Superior Installation",
title: "We use premium roofing systems designed for Texas heat, storms, and hurricanes.",
},
{
value: "Transparent Communication",
title: "Youll always know whats happening with your project.",
},
{
value: "Insurance Expertise",
title: "We help homeowners navigate claims and maximize eligible coverage.",
},
{
value: "Industry-Leading Warranties",
title: "Protection long after installation is complete.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/engineer-writing-condenser-values_482257-90848.jpg"
imageAlt="Roofing expert discussing with homeowner"
mediaAnimation="opacity"
metricsAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyFive
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "Residential Roof Replacement",
description: "Complete roofing systems engineered for long-term protection and beauty.",
icon: Home,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/long-shot-roofer-working-with-helmet_23-2149343709.jpg",
imageAlt: "New luxury architectural roof installation",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/man-walking-roof_1321-1041.jpg",
imageAlt: "Side view of a new asphalt shingle roof",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/dark-kitchen-cabinets-with-gold-hardware-details-elegant-interior-with-wooden-counter-plant_169016-72764.jpg",
imageAlt: "new luxury architectural roof installation",
},
{
title: "Storm Damage Restoration",
description: "Fast inspections and expert repairs following hail and wind events.",
icon: Cloud,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/boy-red-coat-looks-busy-talking-phone_8353-1103.jpg",
imageAlt: "Damaged roof after storm before repair",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/tile-roof-texture_23-2148164702.jpg",
imageAlt: "Repaired roof after storm restoration",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/iceland-landscape-beautiful-church_23-2149099948.jpg",
imageAlt: "new luxury architectural roof installation",
},
{
title: "Roof Repairs",
description: "Leak detection, emergency repairs, and preventative maintenance.",
icon: Wrench,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/man-with-helmet-sitting-roof-full-shot_23-2149343712.jpg",
imageAlt: "Leak detection on old roof interior",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/man-working-outdoors-full-shot_23-2149714278.jpg",
imageAlt: "Roof repair professional fixing shingles",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/beauty-style-fashion-femininity-concept-positive-beautiful-young-european-woman-blue-shirt-looking-camera-with-broad-happy-smile-being-good-mood-kitchen-interior-background_343059-2087.jpg",
imageAlt: "new luxury architectural roof installation",
},
{
title: "Insurance Claim Assistance",
description: "We work directly with insurance carriers to simplify the process and maximize your eligible coverage.",
icon: FileText,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/mid-adult-couple-reaching-agreement-with-real-estate-agent-office-women-are-handshaking_637285-1732.jpg",
imageAlt: "Homeowner talking to insurance agent roof",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/paper-credit-request-with-green-stamp_23-2147764209.jpg",
imageAlt: "Insurance check for roof repair",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-african-american-woman-cafe_273609-5073.jpg",
imageAlt: "new luxury architectural roof installation",
},
{
title: "Roof Inspections",
description: "Detailed assessments with photo documentation to give you a clear understanding of your roofs condition.",
icon: Search,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-hummer-tools-stairs-house-construction_181624-28753.jpg",
imageAlt: "Roofer performing detailed roof inspection",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/side-view-old-man-looking-tablet_23-2148269414.jpg",
imageAlt: "Detailed roof inspection report on tablet",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/experienced-senior-female-executive-eyeglasses_1262-5027.jpg",
imageAlt: "new luxury architectural roof installation",
},
{
title: "Exterior Improvements",
description: "Enhance your homes functionality and aesthetics with gutters, ventilation systems, and other exterior upgrades.",
icon: ListChecks,
mediaItems: [
{
imageSrc: "http://img.b2bpic.net/free-photo/painting-red_1385-599.jpg",
imageAlt: "New gutter installation luxury home",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/detail-urban-stairs_23-2148107136.jpg",
imageAlt: "Close-up of new seamless gutters",
},
],
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-smiling-camera_23-2148238839.jpg",
imageAlt: "new luxury architectural roof installation",
},
]}
title="Our Services"
description="Telge Roofing offers a comprehensive suite of luxury roofing solutions, ensuring your home is protected with beauty and durability."
/>
</div>
<div id="before-after" data-section="before-after">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "1",
name: "Aging Roof",
price: "",
variant: "Before",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-wood-texture-background_23-2148935976.jpg",
imageAlt: "Aging roof with missing shingles",
},
{
id: "2",
name: "Storm Damage",
price: "",
variant: "Before",
imageSrc: "http://img.b2bpic.net/free-photo/roof-building-covered-snow-against-cloudy-sky_181624-37509.jpg",
imageAlt: "Storm damaged roof",
},
{
id: "3",
name: "Missing Shingles",
price: "",
variant: "Before",
imageSrc: "http://img.b2bpic.net/free-photo/view-abandoned-decaying-house-nature_23-2150166582.jpg",
imageAlt: "Old roof with missing shingles",
},
{
id: "4",
name: "Luxury Architectural Roofing",
price: "",
variant: "After",
imageSrc: "http://img.b2bpic.net/free-photo/concrete-building-with-mirror-windows-clear-sky_181624-6780.jpg",
imageAlt: "Newly installed luxury architectural roof",
},
{
id: "5",
name: "Storm Restoration",
price: "",
variant: "After",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg",
imageAlt: "Restored roof after storm damage",
},
{
id: "6",
name: "Complete Exterior Renovation",
price: "",
variant: "After",
imageSrc: "http://img.b2bpic.net/free-photo/view-stone-building-with-large-windows_23-2148252828.jpg",
imageAlt: "Home with new roof after complete exterior renovation",
},
]}
title="Real Homes. Real Transformations."
description="Every roof we install enhances curb appeal, increases property value, and protects what matters most. See the dramatic difference Telge Roofing brings."
/>
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardFifteen
useInvertedBackground={true}
testimonial="“The entire process was seamless. Professional, honest, and responsive from start to finish. Our roof looks incredible and the team handled everything.”"
rating={5}
author="Sarah Johnson, CEO, TechCorp"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/portrait-young-man-white-background_641386-889.jpg",
alt: "Sarah Johnson",
},
{
src: "http://img.b2bpic.net/free-photo/business-woman-green-suit-using-phone-outside-street_1303-29546.jpg",
alt: "Michael Chen",
},
{
src: "http://img.b2bpic.net/free-photo/handsome-business-man-wearing-suit-looking-camera-smiling-broadly-with-happy-face-standing-white-background_141793-54115.jpg",
alt: "Emily Rodriguez",
},
{
src: "http://img.b2bpic.net/free-photo/smiling-blonde-woman-white_181624-25676.jpg",
alt: "David Kim",
},
{
src: "http://img.b2bpic.net/free-photo/man-posing-with-helmet-medium-shot_23-2148920603.jpg",
alt: "Satisfied customer",
},
]}
ratingAnimation="opacity"
avatarsAnimation="opacity"
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "How much does a roof replacement cost?",
content: "Every home is different, and costs vary based on materials, size, and complexity. We provide detailed inspections and transparent, no-obligation estimates tailored to your specific needs.",
},
{
id: "2",
title: "Do you help with insurance claims?",
content: "Absolutely. We specialize in storm damage restoration and work directly with insurance carriers to assist homeowners throughout the claims process, maximizing your eligible coverage and simplifying paperwork.",
},
{
id: "3",
title: "How long does a roof replacement take?",
content: "Most residential roof replacement projects are completed efficiently, typically within 12 days, weather permitting. Our dedicated project managers ensure a smooth and timely process.",
},
{
id: "4",
title: "Do you offer financing?",
content: "Yes, we understand that a new roof is a significant investment. Flexible financing options are available to help make your premium roofing project more affordable. Contact us to learn more.",
},
{
id: "5",
title: "Is the inspection really free?",
content: "Yes, our roof inspections are completely free, with no obligation. We provide a thorough assessment of your roof's condition, complete with photo documentation and honest recommendations.",
},
]}
title="Frequently Asked Questions"
description="Get quick answers to common questions about Telge Roofing services, pricing, and process."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactText
useInvertedBackground={true}
background={{
variant: "radial-gradient",
}}
text="Get Your Free Roof Inspection. Protect your home before minor issues become major expenses. Fill out the form below to schedule your complimentary assessment. (Note: Actual form fields for Name, Phone, Email, Address, Service Needed, Insurance Claim? (Yes/No) will be rendered here by the form component.)"
buttons={[
{
text: "GET MY FREE INSPECTION",
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-photo/dark-kitchen-cabinets-with-gold-hardware-details-elegant-interior-with-wooden-counter-plant_169016-72764.jpg"
logoAlt="Telge Roofing Logo"
logoText="Telge Roofing"
leftLink={{
text: "Privacy Policy",
href: "#",
}}
rightLink={{
text: "Terms of Service",
href: "#",
}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}