Merge version_1 into main #1
464
src/app/page.tsx
464
src/app/page.tsx
@@ -1,342 +1,138 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import HeroCentered from '@/components/sections/hero/HeroCentered';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import { Award, CheckCircle, MapPin, Percent, Shield, ShieldCheck, Star } from "lucide-react";
|
||||
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import { ShieldCheck, MapPin, Star, Award, CheckCircle } from 'lucide-react';
|
||||
|
||||
export default function LandingPage() {
|
||||
const navItems = [
|
||||
{ name: 'Home', id: '/' },
|
||||
];
|
||||
|
||||
export default function Page() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="compact"
|
||||
sizing="mediumLarge"
|
||||
background="noiseDiagonalGradient"
|
||||
cardStyle="gradient-radial"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="normal"
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
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: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Hill of Hope"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
title="Premium Roofing & Renovations You Can Trust"
|
||||
description="Trusted by homeowners across the Lehigh Valley for high-quality roofing and renovations that last."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-smiley-man-looking-camera_23-2148306634.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/charming-student-girl-good-mood-relaxing-home_343059-139.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-cheerful-teenage-girl-sitting-cafe_1262-3048.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
]}
|
||||
avatarText="5.0 Rating (Based on 5+ Reviews)"
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Estimate",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:1234567890",
|
||||
},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Licensed & Insured",
|
||||
icon: ShieldCheck,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Local Experts",
|
||||
icon: MapPin,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Top-Rated Service",
|
||||
icon: Star,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Competitive Rates",
|
||||
icon: Percent,
|
||||
},
|
||||
{
|
||||
type: "text-icon",
|
||||
text: "Lifetime Warranty",
|
||||
icon: Award,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Christopher Bell",
|
||||
handle: "@cb",
|
||||
testimonial: "They did a fantastic job on our roof. I waited a year before reviewing to make sure — no issues at all. Highly recommend.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/home-comfort-coziness-domesticity-concept-cropped-portrait-confident-happy-young-woman-spending-day-home_343059-3893.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Gloria",
|
||||
handle: "@gloria",
|
||||
testimonial: "Exceeded my expectations. Professional, fast, and the results were amazing.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-with-tablet-park-looking-camera_23-2147779715.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Santiago Martinez",
|
||||
handle: "@sm",
|
||||
testimonial: "My go-to roofing company. Reliable and consistent every time.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-father-posing-with-arms-crossed_23-2148414862.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Christine Urbine",
|
||||
handle: "@cu",
|
||||
testimonial: "Very respectful, affordable, and high-quality work.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-handsome-male-smiling_181624-41237.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "John Doe",
|
||||
handle: "@jd",
|
||||
testimonial: "The communication was excellent throughout the whole renovation process.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-overjoyed-woman-rejoicing-her-success_74855-3513.jpg",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Real Results. Real Homeowners."
|
||||
description="Hear from our satisfied customers in the Lehigh Valley."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSix
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Roofing Services",
|
||||
description: "Full replacements, repairs, shingle installation, and leak detection.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/home-clay-roof-tile_657883-716.jpg",
|
||||
imageAlt: "Roofing services",
|
||||
},
|
||||
{
|
||||
title: "Home Renovations",
|
||||
description: "Exterior improvements, structural repairs, and complete home upgrades.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/worker-controls-cargo-crane_140725-7619.jpg",
|
||||
imageAlt: "Home renovations",
|
||||
},
|
||||
{
|
||||
title: "Additional Work",
|
||||
description: "Gutter systems, siding replacement, and storm damage repairs.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-paper-bag-bottle_23-2148773372.jpg",
|
||||
imageAlt: "Gutters and siding",
|
||||
},
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Expert roofing, exterior renovations, and structural repairs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="why-choose-us" data-section="why-choose-us">
|
||||
<MetricCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: CheckCircle,
|
||||
title: "Proven Results",
|
||||
value: "100% Quality",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Award,
|
||||
title: "Locally Trusted",
|
||||
value: "500+ Homes",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Shield,
|
||||
title: "Licensed & Insured",
|
||||
value: "Secure",
|
||||
},
|
||||
]}
|
||||
title="Why Homeowners Choose Hill of Hope"
|
||||
description="We stand by our quality and integrity."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="process" data-section="process">
|
||||
<FeatureCardSix
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Free Inspection",
|
||||
description: "We assess your home's needs with no obligation.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-doing-his-job-with-belt_23-2149343658.jpg",
|
||||
imageAlt: "Free inspection",
|
||||
},
|
||||
{
|
||||
title: "Transparent Estimate",
|
||||
description: "Honest, competitive pricing without hidden surprises.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/manual-worker-grinding-metal-steel-objects-workshop-with-tools_1163-3130.jpg",
|
||||
imageAlt: "Transparent estimate",
|
||||
},
|
||||
{
|
||||
title: "Professional Installation",
|
||||
description: "Skilled craftsmanship executed with the utmost care.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-abandoned-house-with-rusty-stairs_23-2149454766.jpg",
|
||||
imageAlt: "Installation",
|
||||
},
|
||||
{
|
||||
title: "Final Walkthrough",
|
||||
description: "Ensuring your satisfaction with our guarantee.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-man-working-roof_23-2149343672.jpg",
|
||||
imageAlt: "Final walkthrough",
|
||||
},
|
||||
]}
|
||||
title="Our Simple 4-Step Process"
|
||||
description="How we bring your dream home to life."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
tag="Ready to get started?"
|
||||
title="Get My Free Quote"
|
||||
description="Fill out the form below to receive your fast, free estimate from Hill of Hope Renovations."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-measuring-tools-still-life_23-2150440963.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Reviews",
|
||||
href: "#testimonials",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Use",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Lehigh Valley",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Bethlehem",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Allentown",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="Hill of Hope Renovations Inc."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple navItems={navItems} brandName="Hill of Hope" />
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Premium Roofing & Renovations You Can Trust"
|
||||
description="Trusted by homeowners across the Lehigh Valley for high-quality roofing and renovations that last."
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg", alt: "Client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-smiley-man-looking-camera_23-2148306634.jpg", alt: "Client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/charming-student-girl-good-mood-relaxing-home_343059-139.jpg", alt: "Client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg", alt: "Client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-cheerful-teenage-girl-sitting-cafe_1262-3048.jpg", alt: "Client 5" }
|
||||
]}
|
||||
avatarText="5.0 Rating (Based on 5+ Reviews)"
|
||||
buttons={[
|
||||
{ text: "Get Free Estimate", href: "#contact" },
|
||||
{ text: "Call Now", href: "tel:1234567890" }
|
||||
]}
|
||||
marqueeItems={[
|
||||
{ type: "text-icon", text: "Licensed & Insured", icon: ShieldCheck },
|
||||
{ type: "text-icon", text: "Local Experts", icon: MapPin },
|
||||
{ type: "text-icon", text: "Top-Rated Service", icon: Star },
|
||||
{ type: "text-icon", text: "Competitive Rates", icon: Percent },
|
||||
{ type: "text-icon", text: "Lifetime Warranty", icon: Award }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSix
|
||||
title="Our Services"
|
||||
description="Expert roofing, exterior renovations, and structural repairs."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ title: "Roofing Services", description: "Full replacements, repairs, shingle installation, and leak detection.", imageSrc: "http://img.b2bpic.net/free-photo/home-clay-roof-tile_657883-716.jpg", imageAlt: "Roofing services" },
|
||||
{ title: "Home Renovations", description: "Exterior improvements, structural repairs, and complete home upgrades.", imageSrc: "http://img.b2bpic.net/free-photo/worker-controls-cargo-crane_140725-7619.jpg", imageAlt: "Home renovations" },
|
||||
{ title: "Additional Work", description: "Gutter systems, siding replacement, and storm damage repairs.", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-paper-bag-bottle_23-2148773372.jpg", imageAlt: "Gutters and siding" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="why-choose-us" data-section="why-choose-us">
|
||||
<MetricCardThree
|
||||
title="Why Homeowners Choose Hill of Hope"
|
||||
description="We stand by our quality and integrity."
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
metrics={[
|
||||
{ id: "m1", icon: CheckCircle, title: "Proven Results", value: "100% Quality" },
|
||||
{ id: "m2", icon: Award, title: "Locally Trusted", value: "500+ Homes" },
|
||||
{ id: "m3", icon: Shield, title: "Licensed & Insured", value: "Secure" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
title="Real Results. Real Homeowners."
|
||||
description="Hear from our satisfied customers in the Lehigh Valley."
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
showRating={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Christopher Bell", handle: "@cb", testimonial: "They did a fantastic job on our roof. I waited a year before reviewing to make sure — no issues at all. Highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/home-comfort-coziness-domesticity-concept-cropped-portrait-confident-happy-young-woman-spending-day-home_343059-3893.jpg" },
|
||||
{ id: "2", name: "Gloria", handle: "@gloria", testimonial: "Exceeded my expectations. Professional, fast, and the results were amazing.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-with-tablet-park-looking-camera_23-2147779715.jpg" },
|
||||
{ id: "3", name: "Santiago Martinez", handle: "@sm", testimonial: "My go-to roofing company. Reliable and consistent every time.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-father-posing-with-arms-crossed_23-2148414862.jpg" },
|
||||
{ id: "4", name: "Christine Urbine", handle: "@cu", testimonial: "Very respectful, affordable, and high-quality work.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-handsome-male-smiling_181624-41237.jpg" },
|
||||
{ id: "5", name: "John Doe", handle: "@jd", testimonial: "The communication was excellent throughout the whole renovation process.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-overjoyed-woman-rejoicing-her-success_74855-3513.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="process" data-section="process">
|
||||
<FeatureCardSix
|
||||
title="Our Simple 4-Step Process"
|
||||
description="How we bring your dream home to life."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ title: "Free Inspection", description: "We assess your home's needs with no obligation.", imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-doing-his-job-with-belt_23-2149343658.jpg", imageAlt: "Free inspection" },
|
||||
{ title: "Transparent Estimate", description: "Honest, competitive pricing without hidden surprises.", imageSrc: "http://img.b2bpic.net/free-photo/manual-worker-grinding-metal-steel-objects-workshop-with-tools_1163-3130.jpg", imageAlt: "Transparent estimate" },
|
||||
{ title: "Professional Installation", description: "Skilled craftsmanship executed with the utmost care.", imageSrc: "http://img.b2bpic.net/free-photo/old-abandoned-house-with-rusty-stairs_23-2149454766.jpg", imageAlt: "Installation" },
|
||||
{ title: "Final Walkthrough", description: "Ensuring your satisfaction with our guarantee.", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-man-working-roof_23-2149343672.jpg", imageAlt: "Final walkthrough" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
tag="Ready to get started?"
|
||||
title="Get My Free Quote"
|
||||
description="Fill out the form below to receive your fast, free estimate from Hill of Hope Renovations."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/high-angle-measuring-tools-still-life_23-2150440963.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="Hill of Hope Renovations Inc."
|
||||
columns={[
|
||||
{ items: [{ label: "Home", href: "#hero" }, { label: "Services", href: "#services" }, { label: "Reviews", href: "#testimonials" }] },
|
||||
{ items: [{ label: "Contact", href: "#contact" }, { label: "Privacy Policy", href: "#" }, { label: "Terms of Use", href: "#" }] },
|
||||
{ items: [{ label: "Lehigh Valley", href: "#" }, { label: "Bethlehem", href: "#" }, { label: "Allentown", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user