Merge version_1 into main #3

Merged
bender merged 3 commits from version_1 into main 2026-04-17 09:33:21 +00:00
3 changed files with 135 additions and 260 deletions

View File

@@ -1,135 +1,45 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FooterSimple from '@/components/sections/footer/FooterSimple';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import { ShieldCheck, Smile } from "lucide-react";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import { ShieldCheck } from "lucide-react";
export default function LandingPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Services", id: "/services" }
];
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="largeSmall"
background="aurora"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "/",
},
{
name: "About",
id: "/about",
},
{
name: "Services",
id: "/services",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="Empire Roofing"
button={{
text: "Call Now",
href: "tel:5555555555",
}}
/>
</div>
<div id="about-story" data-section="about-story">
<TestimonialAboutCard
useInvertedBackground={false}
tag="About Us"
title="Built on Trust. Backed by Results."
description="Empire Roofing & Construction was built to bring honesty back into the roofing industry. Too many homeowners get overcharged, misled, or left with poor workmanship. We do things differently."
subdescription="Rudy — Founder: 'We treat every home like its our own.'"
imageSrc="http://img.b2bpic.net/free-photo/front-view-rejoicing-male-engineer-sitting-his-working-place-writing-notes-document-plan-business-contractor-agenda-corporate-job-property-builder_140725-155596.jpg"
mediaAnimation="slide-up"
icon={ShieldCheck}
/>
</div>
<div id="metric" data-section="metric">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
title="Our Impact"
description="Quality matters to our community."
metrics={[
{
id: "am1",
value: "500+",
title: "Happy Homeowners",
description: "Serving families across the Ozarks",
icon: Smile,
},
{
id: "am2",
value: "12",
title: "Certifications",
description: "Quality standards strictly maintained",
icon: ShieldCheck,
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Contact",
href: "/contact",
},
],
},
{
title: "Services",
items: [
{
label: "Roof Repairs",
href: "/services",
},
{
label: "Full Replacements",
href: "/services",
},
{
label: "Claims",
href: "/services",
},
],
},
]}
bottomLeftText="© 2024 Empire Roofing & Construction"
bottomRightText="Built Like an Empire."
/>
</div>
</ReactLenis>
<ThemeProvider>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline navItems={navItems} brandName="Empire Roofing" />
</div>
<div id="about-story" data-section="about-story">
<TestimonialAboutCard
tag="About Us"
title="Built on Trust. Backed by Results."
description="Empire Roofing & Construction was built to bring honesty back into the roofing industry. Too many homeowners get overcharged, misled, or left with poor workmanship. We do things differently."
subdescription="Rudy — Founder: 'We treat every home like its our own.'"
imageSrc="http://img.b2bpic.net/free-photo/front-view-rejoicing-male-engineer-sitting-his-working-place-writing-notes-document-plan-business-contractor-agenda-corporate-job-property-builder_140725-155596.jpg"
icon={ShieldCheck}
mediaAnimation="slide-up"
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Contact", href: "/contact" }] },
{ title: "Services", items: [{ label: "Roof Repairs", href: "/services" }, { label: "Full Replacements", href: "/services" }, { label: "Claims", href: "/services" }] }
]}
bottomLeftText="© 2024 Empire Roofing & Construction"
bottomRightText="Built Like an Empire."
/>
</div>
</ThemeProvider>
);
}
}

View File

@@ -1,122 +1,41 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterSimple from "@/components/sections/footer/FooterSimple";
export default function LandingPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Services", id: "/services" }
];
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumLarge"
sizing="largeSmall"
background="aurora"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
headingFontWeight="medium"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home",
id: "/",
},
{
name: "About",
id: "/about",
},
{
name: "Services",
id: "/services",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="Empire Roofing"
button={{
text: "Call Now",
href: "tel:5555555555",
}}
/>
</div>
<div id="contact-page-form" data-section="contact-page-form">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "sparkles-gradient",
}}
title="Ready to Protect Your Home?"
description="Call (555) 555-5555 or fill out the form below."
tag="Get In Touch"
/>
</div>
<div id="socialProof" data-section="socialProof">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
title="Certified Partners"
description="Working with the industry's best materials."
names={[
"GAF Master Elite",
"Owens Corning Platinum",
"CertainTeed",
"Tamko Pro",
"IKO Pro",
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Contact",
href: "/contact",
},
],
},
{
title: "Services",
items: [
{
label: "Roof Repairs",
href: "/services",
},
{
label: "Full Replacements",
href: "/services",
},
{
label: "Claims",
href: "/services",
},
],
},
]}
bottomLeftText="© 2024 Empire Roofing & Construction"
bottomRightText="Built Like an Empire."
/>
</div>
</ReactLenis>
<ThemeProvider>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline navItems={navItems} brandName="Empire Roofing" />
</div>
<div id="contact-page-form" data-section="contact-page-form">
<ContactCenter
title="Ready to Protect Your Home?"
description="Call (555) 555-5555 or fill out the form below."
tag="Get In Touch"
background={{ variant: "sparkles-gradient" }}
useInvertedBackground={true}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{ title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Contact", href: "/contact" }] },
{ title: "Services", items: [{ label: "Roof Repairs", href: "/services" }, { label: "Full Replacements", href: "/services" }, { label: "Claims", href: "/services" }] }
]}
bottomLeftText="© 2024 Empire Roofing & Construction"
bottomRightText="Built Like an Empire."
/>
</div>
</ThemeProvider>
);
}
}

View File

@@ -1,4 +1,4 @@
'use client';
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroOverlayTestimonial from "@/components/sections/hero/HeroOverlayTestimonial";
@@ -6,38 +6,84 @@ import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwen
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import { Home, FileText, Award } from "lucide-react";
const navItems = [
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Services", id: "/services" },
{ name: "Contact", id: "/contact" }
{ name: "Contact", id: "/contact" },
{ name: "Services", id: "/services" }
];
export default function Home() {
export default function HomePage() {
return (
<ThemeProvider defaultButtonVariant="hover-magnetic" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
<ThemeProvider>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={navItems}
brandName="Empire Roofing"
button={{ text: "Get Quote", href: "/contact" }}
/>
<NavbarLayoutFloatingInline navItems={navItems} brandName="Empire Roofing" />
</div>
<div id="hero" data-section="hero">
<HeroOverlayTestimonial title="Missouris Most Trusted Roofing Experts" description="Roof Repairs • Insurance Claims • Full Replacements — Done Right the First Time" testimonials={[{name: "Kevin James", handle: "Homeowner", testimonial: "Professional. Honest. No shortcuts.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-handsome-male-smiling_181624-41237.jpg"}, {name: "Mark Mann", handle: "Homeowner", testimonial: "Out of 6 quotes, Empire was the only one that truly knew their craft.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-mother-home_23-2148321636.jpg"}, {name: "Ken Watson", handle: "Homeowner", testimonial: "They handled my insurance claim when it was denied and got it approved.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-confident-male-employee-white-collar-shirt-smiling-camera-standing-self-assured-against-studio-background_1258-26761.jpg"}, {name: "Mary Tuggle", handle: "Homeowner", testimonial: "Crew was clean, professional, and followed up.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg"}, {name: "Local Resident", handle: "Homeowner", testimonial: "Best service in Springfield area, hands down.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5365.jpg"}]} buttons={[{text: "Get Free Roof Inspection", href: "/contact"}, {text: "Call Now", href: "tel:5555555555"}]} imageSrc="http://img.b2bpic.net/free-photo/old-stone-building-with-blue-sky_23-2148252732.jpg" avatars={[{src: "http://img.b2bpic.net/free-photo/woman-smiling_1187-3196.jpg", alt: "happy customer portrait 1"}, {src: "http://img.b2bpic.net/free-photo/successful-young-man-stylish-hat-relaxing-alone-cozy-cafeteria-lunch-break-looking-with-happy-expression_273609-1935.jpg", alt: "happy customer portrait 2"}, {src: "http://img.b2bpic.net/free-photo/very-good-smiling-brunette-woman-shows-ok-okay-hand-sign-looking-satisfied-recommend-great-deal-pleased-with-quality-standing-white-background_176420-46695.jpg", alt: "happy customer portrait 3"}, {src: "http://img.b2bpic.net/free-photo/smiling-middle-aged-woman-showing-ok-sign_1262-17571.jpg", alt: "happy customer portrait 4"}, {src: "http://img.b2bpic.net/free-photo/cheerful-attractive-dark-haired-latin-man-posing-kitchen_74855-7991.jpg", alt: "happy customer portrait 5"}]} />
<HeroOverlayTestimonial
title="Missouris Most Trusted Roofing Experts"
description="Roof Repairs • Insurance Claims • Full Replacements — Done Right the First Time"
testimonials={[
{ name: "Kevin James", handle: "Homeowner", testimonial: "Professional. Honest. No shortcuts.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-handsome-male-smiling_181624-41237.jpg" },
{ name: "Mark Mann", handle: "Homeowner", testimonial: "Out of 6 quotes, Empire was the only one that truly knew their craft.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-mother-home_23-2148321636.jpg" },
{ name: "Ken Watson", handle: "Homeowner", testimonial: "They handled my insurance claim when it was denied and got it approved.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-confident-male-employee-white-collar-shirt-smiling-camera-standing-self-assured-against-studio-background_1258-26761.jpg" },
{ name: "Mary Tuggle", handle: "Homeowner", testimonial: "Crew was clean, professional, and followed up.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg" },
{ name: "Local Resident", handle: "Homeowner", testimonial: "Best service in Springfield area, hands down.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5365.jpg" }
]}
buttons={[{ text: "Get Free Roof Inspection", href: "/contact" }, { text: "Call Now", href: "tel:5555555555" }]}
imageSrc="http://img.b2bpic.net/free-photo/old-stone-building-with-blue-sky_23-2148252732.jpg"
/>
</div>
<div id="services-list" data-section="services-list">
<FeatureCardTwentyFour animationType="slide-up" title="Premium Roofing Services" description="Comprehensive care for your biggest asset." textboxLayout="split" useInvertedBackground={false} features={[{id: "s1", title: "Roof Inspection", author: "Pro Team", description: "Detailed inspections with photos & videos so you see exactly what we see.", tags: ["Safety", "Analysis"], imageSrc: "http://img.b2bpic.net/free-photo/cute-yellow-rural-house-with-wooden-stairs-countryside_176420-7157.jpg"}, {id: "s2", title: "Roof Repair", author: "Expert Crew", description: "From leaks to storm damage—we fix it fast and correctly.", tags: ["Speed", "Quality"], imageSrc: "http://img.b2bpic.net/free-photo/man-working-roof-front-view_23-2148748780.jpg"}, {id: "s3", title: "Full Replacement", author: "Master Craftsmen", description: "Premium materials, expert installation, built to last decades.", tags: ["Longevity", "Value"], imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beautiful-wooden-house-with-new-roof_23-2149343703.jpg"}, {id: "s4", title: "Insurance Help", author: "Claim Specialists", description: "We fight your insurance so you dont have to.", tags: ["Claims", "Ease"], imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-pen-close-up_23-2149191369.jpg"}]} />
<FeatureCardTwentyFour
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
title="Premium Roofing Services"
description="Comprehensive care for your biggest asset."
features={[
{ id: "s1", title: "Roof Inspection", author: "Pro Team", description: "Detailed inspections with photos & videos so you see exactly what we see.", tags: ["Safety", "Analysis"], imageSrc: "http://img.b2bpic.net/free-photo/cute-yellow-rural-house-with-wooden-stairs-countryside_176420-7157.jpg" },
{ id: "s2", title: "Roof Repair", author: "Expert Crew", description: "From leaks to storm damage—we fix it fast and correctly.", tags: ["Speed", "Quality"], imageSrc: "http://img.b2bpic.net/free-photo/man-working-roof-front-view_23-2148748780.jpg" },
{ id: "s3", title: "Full Replacement", author: "Master Craftsmen", description: "Premium materials, expert installation, built to last decades.", tags: ["Longevity", "Value"], imageSrc: "http://img.b2bpic.net/free-photo/high-angle-beautiful-wooden-house-with-new-roof_23-2149343703.jpg" },
{ id: "s4", title: "Insurance Help", author: "Claim Specialists", description: "We fight your insurance so you dont have to.", tags: ["Claims", "Ease"], imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hand-holding-pen-close-up_23-2149191369.jpg" }
]}
/>
</div>
<div id="before-after" data-section="before-after">
<ProductCardOne title="See the Difference" description="Real craftsmanship. Real transformation." animationType="slide-up" gridVariant="two-columns-alternating-heights" textboxLayout="default" useInvertedBackground={true} products={[{id: "ba1", name: "Before: Storm Damaged", price: "Damaged", imageSrc: "http://img.b2bpic.net/free-photo/view-old-abandoned-house-nature_23-2150166504.jpg"}, {id: "ba2", name: "After: Fully Restored", price: "Completed", imageSrc: "http://img.b2bpic.net/free-photo/modern-stadium_1127-110.jpg"}, {id: "ba3", name: "Before: Old Roof", price: "Weathered", imageSrc: "http://img.b2bpic.net/free-photo/metal-structure_181624-31076.jpg"}, {id: "ba4", name: "After: Modern Install", price: "Completed", imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13092.jpg"}, {id: "ba5", name: "Before: Leak Area", price: "Urgent", imageSrc: "http://img.b2bpic.net/free-photo/man-walking-roof_1321-1040.jpg"}, {id: "ba6", name: "After: Sealed Repair", price: "Completed", imageSrc: "http://img.b2bpic.net/free-photo/home-clay-roof-tile_657883-716.jpg"}]} />
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="two-columns-alternating-heights"
useInvertedBackground={true}
title="See the Difference"
description="Real craftsmanship. Real transformation."
products={[
{ id: "ba1", name: "Before: Storm Damaged", price: "Damaged", imageSrc: "http://img.b2bpic.net/free-photo/view-old-abandoned-house-nature_23-2150166504.jpg" },
{ id: "ba2", name: "After: Fully Restored", price: "Completed", imageSrc: "http://img.b2bpic.net/free-photo/modern-stadium_1127-110.jpg" },
{ id: "ba3", name: "Before: Old Roof", price: "Weathered", imageSrc: "http://img.b2bpic.net/free-photo/metal-structure_181624-31076.jpg" }
]}
/>
</div>
<div id="contact-home" data-section="contact-home">
<ContactCenter tag="Contact Us" title="Dont Wait Until It Gets Worse" description="A small roof issue today can cost thousands tomorrow. Get a free inspection." useInvertedBackground={false} background={{ variant: "gradient-bars" }} />
<ContactCenter
title="Dont Wait Until It Gets Worse"
description="A small roof issue today can cost thousands tomorrow. Get a free inspection."
tag="Contact Us"
background={{ variant: "gradient-bars" }}
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple columns={[{title: "Company", items: [{label: "About Us", href: "/about"}, {label: "Contact", href: "/contact"}]}, {title: "Services", items: [{label: "Roof Repairs", href: "/services"}, {label: "Full Replacements", href: "/services"}, {label: "Claims", href: "/services"}]}]} bottomLeftText="© 2024 Empire Roofing & Construction" bottomRightText="Built Like an Empire." />
<FooterSimple
columns={[
{ title: "Company", items: [{ label: "About Us", href: "/about" }, { label: "Contact", href: "/contact" }] },
{ title: "Services", items: [{ label: "Roof Repairs", href: "/services" }, { label: "Full Replacements", href: "/services" }, { label: "Claims", href: "/services" }] }
]}
bottomLeftText="© 2024 Empire Roofing & Construction"
bottomRightText="Built Like an Empire."
/>
</div>
</ThemeProvider>
);