Merge version_1 into main #2
@@ -2,166 +2,72 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
|
||||
export default function LandingPage() {
|
||||
export default function AboutPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about-content" data-section="about-content">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="About Pinnacle A Roofing"
|
||||
description="Since 1996, Pinnacle A Roofing Company has passionately upheld the core principles of integrity, ethics, and honesty."
|
||||
metrics={[
|
||||
{
|
||||
value: "27+",
|
||||
title: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "100%",
|
||||
title: "Client Satisfaction",
|
||||
},
|
||||
{
|
||||
value: "500+",
|
||||
title: "Projects Completed",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/site-engineer-construction-site_53876-42834.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Mission"
|
||||
description="To be the best"
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "Best",
|
||||
description: "Local quality",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Values"
|
||||
description="We care"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "User",
|
||||
role: "Client",
|
||||
testimonial: "Excellent service",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-old-man-with-laptop-outdoors_23-2148269386.jpg",
|
||||
imageAlt: "Side view old man with laptop outdoors",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg?_wi=2"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
{
|
||||
label: "Emergency Repair",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Maintenance",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Certifications",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "3712 NW 71st St, Miami, FL",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "(305) 672-7464",
|
||||
href: "tel:+13056727464",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
<div id="about-content" data-section="about-content">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="About Pinnacle A Roofing"
|
||||
description="Since 1996, Pinnacle A Roofing Company has passionately upheld the core principles of integrity, ethics, and honesty."
|
||||
metrics={[{ value: "27+", title: "Years Experience" }, { value: "100%", title: "Client Satisfaction" }, { value: "500+", title: "Projects Completed" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/site-engineer-construction-site_53876-42834.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Mission"
|
||||
description="To be the best"
|
||||
metrics={[{ id: "1", value: "Best", description: "Local quality" }, { id: "2", value: "100%", description: "Safety Compliance" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Values"
|
||||
description="We care"
|
||||
testimonials={[{ id: "1", name: "User", role: "Client", testimonial: "Excellent service", imageSrc: "http://img.b2bpic.net/free-photo/side-view-old-man-with-laptop-outdoors_23-2148269386.jpg", imageAlt: "Side view old man with laptop outdoors" }, { id: "2", name: "Client B", role: "Customer", testimonial: "Professional work", imageSrc: "http://img.b2bpic.net/free-photo/smiley-architect-wearing-his-safety-equipment_23-2148242918.jpg", imageAlt: "Architect" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] }, { title: "Resources", items: [{ label: "Emergency Repair", href: "#" }, { label: "Maintenance", href: "#" }, { label: "Certifications", href: "#" }] }, { title: "Contact", items: [{ label: "3712 NW 71st St, Miami, FL", href: "#" }, { label: "(305) 672-7464", href: "tel:+13056727464" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
@@ -2,151 +2,70 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
|
||||
export default function LandingPage() {
|
||||
export default function ContactPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact-content" data-section="contact-content">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
tag="Contact Us"
|
||||
title="Ready to Start Your Project?"
|
||||
description="Contact our team at (305) 672-7464 or schedule your free roofing consultation today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Estimate",
|
||||
href: "/contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Contact"
|
||||
title="Get in touch"
|
||||
description="Reach out anytime"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Hours"
|
||||
description="Open daily"
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "24/7",
|
||||
description: "Availability",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg?_wi=4"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
{
|
||||
label: "Emergency Repair",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Maintenance",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Certifications",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "3712 NW 71st St, Miami, FL",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "(305) 672-7464",
|
||||
href: "tel:+13056727464",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact-content" data-section="contact-content">
|
||||
<ContactCTA
|
||||
tag="Contact Us"
|
||||
title="Ready to Start Your Project?"
|
||||
description="Contact our team at (305) 672-7464 or schedule your free roofing consultation today."
|
||||
buttons={[{ text: "Get Free Estimate", href: "/contact" }]}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Contact"
|
||||
title="Get in touch"
|
||||
description="Reach out anytime"
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Hours"
|
||||
description="Open daily"
|
||||
metrics={[{ id: "1", value: "24/7", description: "Availability" }, { id: "2", value: "M-F", description: "Support" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] }, { title: "Resources", items: [{ label: "Emergency Repair", href: "#" }, { label: "Maintenance", href: "#" }, { label: "Certifications", href: "#" }] }, { title: "Contact", items: [{ label: "3712 NW 71st St, Miami, FL", href: "#" }, { label: "(305) 672-7464", href: "tel:+13056727464" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
394
src/app/page.tsx
394
src/app/page.tsx
@@ -2,324 +2,98 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Reliable Roofing Solutions Built to Last"
|
||||
description="Serving Miami with quality craftsmanship, competitive pricing, and dependable service."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Free Estimate",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+13056727464",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-man-working-with-earphones_23-2149343656.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/worker-with-level-building-roof-house_23-2148748855.jpg",
|
||||
alt: "Worker 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/specialist-technician-professional-engineer-with-laptop-tablet-maintenance-checking-installing-solar-roof-panel-factory-rooftop-sunlight-engineers-team-survey-check-solar-panel-roof_609648-2202.jpg",
|
||||
alt: "Worker 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/side-view-man-working-roof-with-drill_23-2148748775.jpg",
|
||||
alt: "Worker 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-sitting-roof_23-2148748778.jpg",
|
||||
alt: "Worker 4",
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-4zp5q9yi.png",
|
||||
alt: "Worker 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by our 500+ commercial clients"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Commercial Roofing",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Residential Experts",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "24/7 Emergency Repairs",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Licensed & Insured",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "South Florida Specialists",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services-overview" data-section="services-overview">
|
||||
<FeatureCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Roofing Systems",
|
||||
description: "Expert design, installation, and replacement of TPO, Metal, Tile, and Shingle roofs.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13174.jpg",
|
||||
},
|
||||
{
|
||||
title: "Waterproofing",
|
||||
description: "Protect your building envelope with our advanced, seamless hot and cold applied membranes.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-4zp5q9yi.png",
|
||||
},
|
||||
{
|
||||
title: "Specialty Roofing",
|
||||
description: "Customized solutions including solar PV panels, green roofs, and custom architectural accents.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-1dxxnsl3.jpg",
|
||||
},
|
||||
{
|
||||
title: "Service & Maintenance",
|
||||
description: "Routine inspections and emergency response to maximize roof longevity and save costs.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-bm4u3c7n.jpg",
|
||||
},
|
||||
]}
|
||||
title="Our Roofing Services"
|
||||
description="Specializing in commercial and residential roofing with 20+ years of experience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Johnson",
|
||||
role: "CEO",
|
||||
company: "TechCorp",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-handsome-male-smiling_181624-41237.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael Chen",
|
||||
role: "Property Manager",
|
||||
company: "InnovateLab",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/successful-young-businessman-with-his-arms-crossed-standing-front-building_23-2148176205.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily Rodriguez",
|
||||
role: "Director",
|
||||
company: "GrowthCo",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
role: "Project Manager",
|
||||
company: "StartupXYZ",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-working-as-real-estate-agent_23-2151064880.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Lisa Wang",
|
||||
role: "Operations",
|
||||
company: "GlobalTech",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-equipment_23-2149366625.jpg",
|
||||
},
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Trusted by businesses and residents throughout South Florida."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Service Plans"
|
||||
description="Choose the best plan for your property maintenance needs."
|
||||
plans={[
|
||||
{
|
||||
id: "basic",
|
||||
name: "Basic Inspection",
|
||||
price: "$199",
|
||||
features: [
|
||||
"Annual Inspection",
|
||||
"Report Summary",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
name: "Pro Maintenance",
|
||||
price: "$499",
|
||||
features: [
|
||||
"Bi-Annual Inspection",
|
||||
"Small Repairs Included",
|
||||
"Priority Support",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Select",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Our Standards"
|
||||
description="Excellence in every roofing project."
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "24/7",
|
||||
description: "Emergency Support",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "100%",
|
||||
description: "Safety Compliant",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg?_wi=1"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
{
|
||||
label: "Emergency Repair",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Maintenance",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Certifications",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "3712 NW 71st St, Miami, FL",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "(305) 672-7464",
|
||||
href: "tel:+13056727464",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Reliable Roofing Solutions Built to Last"
|
||||
description="Serving Miami with quality craftsmanship, competitive pricing, and dependable service."
|
||||
buttons={[{ text: "Get a Free Estimate", href: "/contact" }, { text: "Call Now", href: "tel:+13056727464" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-man-working-with-earphones_23-2149343656.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[{ src: "http://img.b2bpic.net/free-photo/worker-with-level-building-roof-house_23-2148748855.jpg", alt: "Worker 1" }, { src: "http://img.b2bpic.net/free-photo/specialist-technician-professional-engineer-with-laptop-tablet-maintenance-checking-installing-solar-roof-panel-factory-rooftop-sunlight-engineers-team-survey-check-solar-panel-roof_609648-2202.jpg", alt: "Worker 2" }, { src: "http://img.b2bpic.net/free-photo/side-view-man-working-roof-with-drill_23-2148748775.jpg", alt: "Worker 3" }, { src: "http://img.b2bpic.net/free-photo/man-sitting-roof_23-2148748778.jpg", alt: "Worker 4" }, { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-4zp5q9yi.png", alt: "Worker 5" }]}
|
||||
avatarText="Trusted by our 500+ commercial clients"
|
||||
marqueeItems={[{ type: "text", text: "Commercial Roofing" }, { type: "text", text: "Residential Experts" }, { type: "text", text: "24/7 Emergency Repairs" }, { type: "text", text: "Licensed & Insured" }, { type: "text", text: "South Florida Specialists" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="services-overview" data-section="services-overview">
|
||||
<FeatureCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
useInvertedBackground={true}
|
||||
features={[{ title: "Roofing Systems", description: "Expert design, installation, and replacement of TPO, Metal, Tile, and Shingle roofs.", imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13174.jpg" }, { title: "Waterproofing", description: "Protect your building envelope with our advanced, seamless hot and cold applied membranes.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-4zp5q9yi.png" }, { title: "Specialty Roofing", description: "Customized solutions including solar PV panels, green roofs, and custom architectural accents.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-1dxxnsl3.jpg" }, { title: "Service & Maintenance", description: "Routine inspections and emergency response to maximize roof longevity and save costs.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CxSkc6NOjtry37B1C4CFRgvFWI/uploaded-1777342183296-bm4u3c7n.jpg" }]}
|
||||
title="Our Roofing Services"
|
||||
description="Specializing in commercial and residential roofing with 20+ years of experience."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="one-large-left-three-stacked-right"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[{ id: "1", name: "Sarah Johnson", role: "CEO", company: "TechCorp", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-handsome-male-smiling_181624-41237.jpg" }, { id: "2", name: "Michael Chen", role: "Property Manager", company: "InnovateLab", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/successful-young-businessman-with-his-arms-crossed-standing-front-building_23-2148176205.jpg" }, { id: "3", name: "Emily Rodriguez", role: "Director", company: "GrowthCo", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg" }, { id: "4", name: "David Kim", role: "Project Manager", company: "StartupXYZ", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-working-as-real-estate-agent_23-2151064880.jpg" }, { id: "5", name: "Lisa Wang", role: "Operations", company: "GlobalTech", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-equipment_23-2149366625.jpg" }]}
|
||||
title="What Our Clients Say"
|
||||
description="Trusted by businesses and residents throughout South Florida."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Service Plans"
|
||||
description="Choose the best plan for your property maintenance needs."
|
||||
plans={[{ id: "basic", name: "Basic Inspection", price: "$199", features: ["Annual Inspection", "Report Summary"], buttons: [{ text: "Select", href: "/contact" }] }, { id: "pro", name: "Pro Maintenance", price: "$499", features: ["Bi-Annual Inspection", "Small Repairs Included", "Priority Support"], buttons: [{ text: "Select", href: "/contact" }] }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Our Standards"
|
||||
description="Excellence in every roofing project."
|
||||
metrics={[{ id: "m1", value: "24/7", description: "Emergency Support" }, { id: "m2", value: "100%", description: "Safety Compliant" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] }, { title: "Resources", items: [{ label: "Emergency Repair", href: "#" }, { label: "Maintenance", href: "#" }, { label: "Certifications", href: "#" }] }, { title: "Contact", items: [{ label: "3712 NW 71st St, Miami, FL", href: "#" }, { label: "(305) 672-7464", href: "tel:+13056727464" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
@@ -2,168 +2,74 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
|
||||
export default function LandingPage() {
|
||||
export default function ServicesPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="elastic-effect"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "/",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "/about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "/services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "/contact",
|
||||
},
|
||||
]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq-content" data-section="faq-content">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Do you provide emergency service?",
|
||||
content: "Yes, we offer 24/7 emergency roof repair service for all our commercial and residential clients.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Are you licensed and insured?",
|
||||
content: "Yes, our Florida State license number is CCC055594.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Do you offer free estimates?",
|
||||
content: "Yes, we invite you to call us today for a free estimate on your roofing project.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-hammer-with-hard-hat-construction_23-2150530708.jpg"
|
||||
title="Frequently Asked Questions"
|
||||
description="Information you need regarding our roofing and maintenance agreements."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="product" data-section="product">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Materials"
|
||||
description="High end quality"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Roof Tile",
|
||||
price: "$10",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/metallic-structure_1127-2046.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Stats"
|
||||
description="Numbers"
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "99%",
|
||||
description: "Reliability",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg?_wi=3"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
label: "About",
|
||||
href: "/about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "/services",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "/contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Resources",
|
||||
items: [
|
||||
{
|
||||
label: "Emergency Repair",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Maintenance",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Certifications",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "3712 NW 71st St, Miami, FL",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "(305) 672-7464",
|
||||
href: "tel:+13056727464",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Services", id: "/services" }, { name: "Contact", id: "/contact" }]}
|
||||
brandName="Pinnacle A Roofing"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq-content" data-section="faq-content">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[{ id: "1", title: "Do you provide emergency service?", content: "Yes, we offer 24/7 emergency roof repair service for all our commercial and residential clients." }, { id: "2", title: "Are you licensed and insured?", content: "Yes, our Florida State license number is CCC055594." }, { id: "3", title: "Do you offer free estimates?", content: "Yes, we invite you to call us today for a free estimate on your roofing project." }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-hammer-with-hard-hat-construction_23-2150530708.jpg"
|
||||
title="Frequently Asked Questions"
|
||||
description="Information you need regarding our roofing and maintenance agreements."
|
||||
faqsAnimation="slide-up"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="product" data-section="product">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Materials"
|
||||
description="High end quality"
|
||||
products={[{ id: "1", name: "Roof Tile", price: "$10", imageSrc: "http://img.b2bpic.net/free-photo/metallic-structure_1127-2046.jpg" }, { id: "2", name: "Metal Panels", price: "$20", imageSrc: "http://img.b2bpic.net/free-photo/metallic-structure_1127-2046.jpg" }, { id: "3", name: "Membrane", price: "$15", imageSrc: "http://img.b2bpic.net/free-photo/metallic-structure_1127-2046.jpg" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
title="Stats"
|
||||
description="Numbers"
|
||||
metrics={[{ id: "1", value: "99%", description: "Reliability" }, { id: "2", value: "24/7", description: "Availability" }]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/many-metal-kegs-beer_1398-2532.jpg"
|
||||
logoText="Pinnacle A Roofing"
|
||||
columns={[{ title: "Navigation", items: [{ label: "Home", href: "/" }, { label: "About", href: "/about" }, { label: "Services", href: "/services" }, { label: "Contact", href: "/contact" }] }, { title: "Resources", items: [{ label: "Emergency Repair", href: "#" }, { label: "Maintenance", href: "#" }, { label: "Certifications", href: "#" }] }, { title: "Contact", items: [{ label: "3712 NW 71st St, Miami, FL", href: "#" }, { label: "(305) 672-7464", href: "tel:+13056727464" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user