Merge version_2 into main #2

Merged
bender merged 7 commits from version_2 into main 2026-06-07 06:00:05 +00:00
7 changed files with 660 additions and 29 deletions

79
src/app/clients/page.tsx Normal file
View File

@@ -0,0 +1,79 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import { Star } from "lucide-react";
export default function ClientsPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "About Us", id: "/#about" },
{ name: "Services", id: "/#services" },
{ name: "Quality", id: "/#quality" },
{ name: "Metrics", id: "/metrics" },
{ name: "Clients", id: "/clients" },
{ name: "Pricing", id: "/#pricing" },
{ name: "FAQ", id: "/#faq" },
{ name: "Contact", id: "/#contact" },
];
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="mediumLarge"
background="fluid"
cardStyle="subtle-shadow"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={navItems}
button={{ text: "Get a Free Quote", href: "/#contact" }}
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
brandName="Miami Roof Tech"
/>
</div>
<div id="clients-page-section" data-section="clients-page-section">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
testimonials={[
{ id: "1", name: "Maria Garcia", role: "Homeowner", company: "Coral Gables", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-senior-woman-showing-thumbs-up_1262-5331.jpg" },
{ id: "2", name: "David Chen", role: "Property Manager", company: "Downtown Miami", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/adult-american-beautiful-cafe-african_1303-1341.jpg" },
{ id: "3", name: "Jessica Lopez", role: "Business Owner", company: "Brickell", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-white-shirt-showing-ok-signs-looking-happy_176474-17426.jpg" },
{ id: "4", name: "Robert Johnson", role: "Retired Couple", company: "South Beach", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-intercultural-friends-walking-together_23-2148300900.jpg" },
{ id: "5", name: "Emily White", role: "New Homeowner", company: "Pinecrest", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-little-girl-her-parents-moving-into-their-new-home_637285-12390.jpg" },
]}
title="What Our Clients Say About Us"
description="Our commitment to quality and customer satisfaction speaks for itself. Read testimonials from happy homeowners and business owners across Miami."
tag="Client Success"
tagIcon={Star}
tagAnimation="slide-up"
buttonAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
logoText="Miami Roof Tech"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

110
src/app/faq/page.tsx Normal file
View File

@@ -0,0 +1,110 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import { HelpCircle, Phone } from "lucide-react";
export default function FaqPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="mediumLarge"
background="fluid"
cardStyle="subtle-shadow"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home", id: "#home"},
{
name: "About Us", id: "#about"},
{
name: "Services", id: "#services"},
{
name: "Quality", id: "#quality"},
{
name: "Clients", id: "#clients"},
{
name: "Pricing", id: "/pricing"},
{
name: "FAQ", id: "/faq"},
{
name: "Contact", id: "#contact"},
]}
button={{
text: "Get a Free Quote", href: "#contact"}}
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
brandName="Miami Roof Tech"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitMedia
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "1", title: "How long does a roof replacement take?", content: "A typical residential roof replacement can take anywhere from 1-3 days, depending on the size of your roof, weather conditions, and the complexity of the project. Commercial projects may vary."},
{
id: "2", title: "Do you offer free estimates?", content: "Yes, Miami Roof Tech provides complimentary, no-obligation estimates for all potential clients. We'll assess your needs and provide a detailed quote."},
{
id: "3", title: "Are you licensed and insured?", content: "Absolutely. Miami Roof Tech is fully licensed, bonded, and insured in the state of Florida. Your peace of mind is our top priority."},
]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-engineer-architect-shaking-hands_23-2148233782.jpg"
imageAlt="Roofer explaining a plan to a homeowner"
mediaAnimation="slide-up"
mediaPosition="left"
title="Your Roofing Questions, Answered"
description="Have questions about your upcoming roofing project? We've compiled a list of frequently asked questions to help you make informed decisions."
tag="Common Questions"
tagIcon={HelpCircle}
tagAnimation="slide-up"
buttonAnimation="slide-up"
faqsAnimation="slide-up"
showCard={true}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "sparkles-gradient"}}
tag="Get a Free Quote"
title="Transform Your Roof Today!"
description="Ready to experience the Miami Roof Tech difference? Contact us now for a free consultation and personalized estimate. Your dream roof is just a click away."
tagIcon={Phone}
tagAnimation="slide-up"
inputPlaceholder="Enter your email"
buttonText="Send Message"
termsText="By submitting this form, you agree to our Terms and Conditions and Privacy Policy."
onSubmit={(email) => console.log(email)}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
logoText="Miami Roof Tech"
leftLink={{
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service", href: "#"}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

77
src/app/metrics/page.tsx Normal file
View File

@@ -0,0 +1,77 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import { Trophy } from "lucide-react";
export default function MetricsPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "About Us", id: "/#about" },
{ name: "Services", id: "/#services" },
{ name: "Quality", id: "/#quality" },
{ name: "Metrics", id: "/metrics" },
{ name: "Clients", id: "/clients" },
{ name: "Pricing", id: "/#pricing" },
{ name: "FAQ", id: "/#faq" },
{ name: "Contact", id: "/#contact" },
];
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="mediumLarge"
background="fluid"
cardStyle="subtle-shadow"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={navItems}
button={{ text: "Get a Free Quote", href: "/#contact" }}
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
brandName="Miami Roof Tech"
/>
</div>
<div id="metrics-page-section" data-section="metrics-page-section">
<MetricCardTwo
animationType="depth-3d"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={true}
metrics={[
{ id: "1", value: "15+", description: "Years of Experience" },
{ id: "2", value: "1200+", description: "Projects Completed" },
{ id: "3", value: "98%", description: "Customer Satisfaction" },
]}
title="Proven Results You Can Trust"
description="Our track record speaks volumes. Miami Roof Tech consistently delivers exceptional results, ensuring peace of mind for all our clients."
tag="Our Achievements"
tagIcon={Trophy}
tagAnimation="slide-up"
buttonAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
logoText="Miami Roof Tech"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -2,10 +2,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
@@ -48,10 +48,10 @@ export default function LandingPage() {
{
name: "FAQ", id: "#faq"},
{
name: "Contact", id: "#contact"},
name: "Contact", href: "/contact"},
]}
button={{
text: "Get a Free Quote", href: "#contact"}}
text: "Get a Free Quote", href: "/contact"}}
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
brandName="Miami Roof Tech"
/>
@@ -78,7 +78,7 @@ export default function LandingPage() {
avatarText="Trusted by over 1000+ satisfied clients in Miami!"
buttons={[
{
text: "Get a Free Estimate", href: "#contact"},
text: "Get a Free Estimate", href: "/contact"},
{
text: "View Our Services", href: "#services"},
]}
@@ -243,7 +243,7 @@ export default function LandingPage() {
id: "basic", badge: "Standard", badgeIcon: Sparkles,
price: "Starting at $299", name: "Roof Repair Service", buttons: [
{
text: "Request Repair", href: "#contact"},
text: "Request Repair", href: "/contact"},
],
features: [
"Minor Leak Fixes", "Damaged Tile Replacement", "Gutter Adjustments", "Free Inspection Report"],
@@ -252,7 +252,7 @@ export default function LandingPage() {
id: "standard", badge: "Best Value", badgeIcon: Zap,
price: "Starting at $8,000", name: "Full Roof Replacement", buttons: [
{
text: "Get a Quote", href: "#contact"},
text: "Get a Quote", href: "/contact"},
],
features: [
"Complete Tear-off & Installation", "Premium Shingle Options", "Enhanced Leak Protection", "20-Year Material Warranty"],
@@ -261,7 +261,7 @@ export default function LandingPage() {
id: "premium", badge: "Comprehensive", badgeIcon: ShieldCheck,
price: "Custom Quote", name: "New Roof Installation", buttons: [
{
text: "Consult an Expert", href: "#contact"},
text: "Consult an Expert", href: "/contact"},
],
features: [
"Architectural Design Support", "Luxury Tile & Metal Options", "Advanced Ventilation Systems", "Lifetime Workmanship Guarantee"],
@@ -303,31 +303,34 @@ export default function LandingPage() {
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "sparkles-gradient"}}
tag="Get a Free Quote"
title="Transform Your Roof Today!"
description="Ready to experience the Miami Roof Tech difference? Contact us now for a free consultation and personalized estimate. Your dream roof is just a click away."
tagIcon={Phone}
tagAnimation="slide-up"
inputPlaceholder="Enter your email"
buttonText="Send Message"
termsText="By submitting this form, you agree to our Terms and Conditions and Privacy Policy."
onSubmit={(email) => console.log(email)}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
<FooterBaseReveal
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
logoText="Miami Roof Tech"
leftLink={{
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service", href: "#"}}
columns={[
{
title: "Company", items: [
{ label: "Home", href: "/" },
{ label: "About Us", href: "/#about" },
{ label: "Services", href: "/#services" },
{ label: "Contact", href: "/contact" }
]
},
{
title: "Resources", items: [
{ label: "FAQ", href: "/#faq" },
{ label: "Pricing", href: "/#pricing" }
]
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" }
]
}
]}
copyrightText="© 2024 Miami Roof Tech. All rights reserved."
/>
</div>
</ReactLenis>

126
src/app/pricing/page.tsx Normal file
View File

@@ -0,0 +1,126 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import { Sparkles, Zap, ShieldCheck, Tag, Phone } from "lucide-react";
export default function PricingPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="mediumLarge"
background="fluid"
cardStyle="subtle-shadow"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home", id: "#home"},
{
name: "About Us", id: "#about"},
{
name: "Services", id: "#services"},
{
name: "Quality", id: "#quality"},
{
name: "Clients", id: "#clients"},
{
name: "Pricing", id: "/pricing"},
{
name: "FAQ", id: "/faq"},
{
name: "Contact", id: "#contact"},
]}
button={{
text: "Get a Free Quote", href: "#contact"}}
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
brandName="Miami Roof Tech"
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardThree
animationType="scale-rotate"
textboxLayout="default"
useInvertedBackground={true}
plans={[
{
id: "basic", badge: "Standard", badgeIcon: Sparkles,
price: "Starting at $299", name: "Roof Repair Service", buttons: [
{
text: "Request Repair", href: "#contact"},
],
features: [
"Minor Leak Fixes", "Damaged Tile Replacement", "Gutter Adjustments", "Free Inspection Report"],
},
{
id: "standard", badge: "Best Value", badgeIcon: Zap,
price: "Starting at $8,000", name: "Full Roof Replacement", buttons: [
{
text: "Get a Quote", href: "#contact"},
],
features: [
"Complete Tear-off & Installation", "Premium Shingle Options", "Enhanced Leak Protection", "20-Year Material Warranty"],
},
{
id: "premium", badge: "Comprehensive", badgeIcon: ShieldCheck,
price: "Custom Quote", name: "New Roof Installation", buttons: [
{
text: "Consult an Expert", href: "#contact"},
],
features: [
"Architectural Design Support", "Luxury Tile & Metal Options", "Advanced Ventilation Systems", "Lifetime Workmanship Guarantee"],
},
]}
title="Transparent Roofing Solutions"
description="Find the perfect roofing plan that fits your needs and budget. We offer clear, competitive pricing with no hidden fees."
tag="Our Packages"
tagIcon={Tag}
tagAnimation="slide-up"
buttonAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "sparkles-gradient"}}
tag="Get a Free Quote"
title="Transform Your Roof Today!"
description="Ready to experience the Miami Roof Tech difference? Contact us now for a free consultation and personalized estimate. Your dream roof is just a click away."
tagIcon={Phone}
tagAnimation="slide-up"
inputPlaceholder="Enter your email"
buttonText="Send Message"
termsText="By submitting this form, you agree to our Terms and Conditions and Privacy Policy."
onSubmit={(email) => console.log(email)}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
logoText="Miami Roof Tech"
leftLink={{
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service", href: "#"}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

111
src/app/quality/page.tsx Normal file
View File

@@ -0,0 +1,111 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Phone, Star } from "lucide-react";
export const metadata = {
title: 'Quality & Guarantees | Miami Roof Tech',
description: 'Discover Miami Roof Tech\'s commitment to quality, customer satisfaction, and the guarantees we offer on our superior roofing services.',
};
export default function QualityPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="mediumLarge"
background="fluid"
cardStyle="subtle-shadow"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "#home" },
{ name: "About Us", id: "#about" },
{ name: "Services", id: "/services" },
{ name: "Quality", id: "/quality" },
{ name: "Clients", id: "#clients" },
{ name: "Pricing", id: "#pricing" },
{ name: "FAQ", id: "#faq" },
{ name: "Contact", id: "#contact" },
]}
button={{ text: "Get a Free Quote", href: "#contact" }}
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
brandName="Miami Roof Tech"
/>
</div>
<div id="quality" data-section="quality">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
testimonials={[
{
id: "1", name: "Maria Garcia", role: "Homeowner", company: "Coral Gables", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-senior-woman-showing-thumbs-up_1262-5331.jpg"},
{
id: "2", name: "David Chen", role: "Property Manager", company: "Downtown Miami", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/adult-american-beautiful-cafe-african_1303-1341.jpg"},
{
id: "3", name: "Jessica Lopez", role: "Business Owner", company: "Brickell", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-white-shirt-showing-ok-signs-looking-happy_176474-17426.jpg"},
{
id: "4", name: "Robert Johnson", role: "Retired Couple", company: "South Beach", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiley-intercultural-friends-walking-together_23-2148300900.jpg"},
{
id: "5", name: "Emily White", role: "New Homeowner", company: "Pinecrest", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-little-girl-her-parents-moving-into-their-new-home_637285-12390.jpg"},
]}
title="What Our Clients Say About Us"
description="Our commitment to quality and customer satisfaction speaks for itself. Read testimonials from happy homeowners and business owners across Miami."
tag="Client Success"
tagIcon={Star}
tagAnimation="slide-up"
buttonAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "sparkles-gradient"}}
tag="Get a Free Quote"
title="Transform Your Roof Today!"
description="Ready to experience the Miami Roof Tech difference? Contact us now for a free consultation and personalized estimate. Your dream roof is just a click away."
tagIcon={Phone}
tagAnimation="slide-up"
inputPlaceholder="Enter your email"
buttonText="Send Message"
termsText="By submitting this form, you agree to our Terms and Conditions and Privacy Policy."
onSubmit={(email) => console.log(email)}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
logoText="Miami Roof Tech"
leftLink={{
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service", href: "#"}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}

125
src/app/services/page.tsx Normal file
View File

@@ -0,0 +1,125 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Building, Wrench, Zap, Award, Sparkles, ShieldCheck, Phone } from "lucide-react";
export const metadata = {
title: 'Our Services | Miami Roof Tech',
description: 'Explore the comprehensive roofing services offered by Miami Roof Tech, including residential, commercial, repair, and maintenance solutions.',
};
export default function ServicesPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="mediumLarge"
background="fluid"
cardStyle="subtle-shadow"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "#home" },
{ name: "About Us", id: "#about" },
{ name: "Services", id: "/services" },
{ name: "Quality", id: "/quality" },
{ name: "Clients", id: "#clients" },
{ name: "Pricing", id: "#pricing" },
{ name: "FAQ", id: "#faq" },
{ name: "Contact", id: "#contact" },
]}
button={{ text: "Get a Free Quote", href: "#contact" }}
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
brandName="Miami Roof Tech"
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwelve
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
features={[
{
id: "residential-roofing", label: "Residential Roofing", title: "Protecting Your Home", items: [
"New Roof Installations", "Complete Roof Replacements", "Shingle & Tile Roof Services", "Leak Detection & Repair"
],
buttons: [
{
text: "Residential Details", href: "#"
}
]
},
{
id: "commercial-solutions", label: "Commercial Solutions", title: "Reliability for Businesses", items: [
"Flat Roof Systems (TPO, PVC)", "Commercial Roof Maintenance", "Emergency Repair Services", "Large-Scale Re-roofing Projects"
],
buttons: [
{
text: "Commercial Details", href: "#"
}
]
},
{
id: "repair-maintenance", label: "Repair & Maintenance", title: "Extend Your Roof's Life", items: [
"Storm Damage Restoration", "Preventative Maintenance Plans", "Gutter & Downspout Services", "Roof Cleaning & Coating"
],
buttons: [
{
text: "Repair Solutions", href: "#"
}
]
}
]}
title="Our Superior Roofing Services"
description="We offer a comprehensive range of roofing services, ensuring your property is protected and looks its best. From new installations to urgent repairs, our certified team handles it all with precision and care."
tag="What We Offer"
tagIcon={Wrench}
tagAnimation="slide-up"
buttonAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "sparkles-gradient"}}
tag="Get a Free Quote"
title="Transform Your Roof Today!"
description="Ready to experience the Miami Roof Tech difference? Contact us now for a free consultation and personalized estimate. Your dream roof is just a click away."
tagIcon={Phone}
tagAnimation="slide-up"
inputPlaceholder="Enter your email"
buttonText="Send Message"
termsText="By submitting this form, you agree to our Terms and Conditions and Privacy Policy."
onSubmit={(email) => console.log(email)}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg"
logoText="Miami Roof Tech"
leftLink={{
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service", href: "#"}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}