Merge version_2 into main #4
149
src/app/page.tsx
149
src/app/page.tsx
@@ -2,14 +2,14 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
import TextAbout from '@/components/sections/about/TextAbout';
|
||||
import { Shield, Star, Zap } from "lucide-react";
|
||||
import { Shield, Star, Zap, Camera } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,16 +29,12 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Services", id: "features"},
|
||||
{
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Portfolio", id: "portfolio" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Henry's Fence"
|
||||
/>
|
||||
@@ -46,42 +42,13 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Crafting Your Perfect Boundary"
|
||||
description="At Henry's Fence, we deliver durable, beautiful fencing solutions tailored to your property. Quality craftsmanship that stands the test of time."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Quote", href: "#contact"},
|
||||
]}
|
||||
buttons={[{ text: "Get a Quote", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/pine-branches-white-wooden-fence_1372-71.jpg"
|
||||
imageAlt="Professional fence installation"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-goodlooking-tender-friendly-pretty-middleaged-30s-woman-extend-arm-hold-camera-hand-smiling-broadly-taking-selfie-photographing-record-videomessage-calling-husband_176420-51274.jpg", alt: "Customer 1"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-dress-standing-green-house_23-2148068656.jpg", alt: "Customer 2"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/performing-housework-gentle-dreamy-atmosphere_23-2151469427.jpg", alt: "Customer 3"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-using-mobile-phone_23-2148000041.jpg", alt: "Customer 4"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/boy-putting-up-electric-guitar_23-2148006422.jpg", alt: "Customer 5"},
|
||||
]}
|
||||
avatarText="Trusted by 500+ happy homeowners"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text", text: "Quality Guaranteed"},
|
||||
{
|
||||
type: "text", text: "Free Estimates"},
|
||||
{
|
||||
type: "text", text: "Expert Installation"},
|
||||
{
|
||||
type: "text", text: "Durable Materials"},
|
||||
{
|
||||
type: "text", text: "Custom Designs"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -89,10 +56,7 @@ export default function LandingPage() {
|
||||
<TextAbout
|
||||
useInvertedBackground={true}
|
||||
title="Expertise in Every Panel"
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More", href: "#features"},
|
||||
]}
|
||||
buttons={[{ text: "Learn More", href: "#features" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -102,54 +66,33 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Wood Fencing", description: "Classic and durable cedar or pressure-treated wood fences.", icon: Shield,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wood-with-aged-worn-surface_23-2148394769.jpg?_wi=1", imageAlt: "Wood Fence"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wood-with-aged-worn-surface_23-2148394769.jpg?_wi=2", imageAlt: "Wood Fence"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Aluminum Fencing", description: "Elegant, low-maintenance metal options for security and style.", icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-metal-fence-sidewalk_181624-40919.jpg?_wi=1", imageAlt: "Aluminum Fence"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-metal-fence-sidewalk_181624-40919.jpg?_wi=2", imageAlt: "Aluminum Fence"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Vinyl Fencing", description: "Modern, weather-resistant privacy fences that look great forever.", icon: Star,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-person-doing-arts-crafts_23-2151575713.jpg?_wi=1", imageAlt: "Vinyl Fence"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-person-doing-arts-crafts_23-2151575713.jpg?_wi=2", imageAlt: "Vinyl Fence"},
|
||||
],
|
||||
},
|
||||
{ title: "Wood Fencing", description: "Classic and durable cedar or pressure-treated wood fences.", icon: Shield, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/wood-with-aged-worn-surface_23-2148394769.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/wood-with-aged-worn-surface_23-2148394769.jpg?_wi=2" }] },
|
||||
{ title: "Aluminum Fencing", description: "Elegant, low-maintenance metal options for security and style.", icon: Zap, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-metal-fence-sidewalk_181624-40919.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-metal-fence-sidewalk_181624-40919.jpg?_wi=2" }] },
|
||||
{ title: "Vinyl Fencing", description: "Modern, weather-resistant privacy fences that look great forever.", icon: Star, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-person-doing-arts-crafts_23-2151575713.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/portrait-person-doing-arts-crafts_23-2151575713.jpg?_wi=2" }] },
|
||||
]}
|
||||
title="Our Services"
|
||||
description="High-quality materials and professional installation for every need."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Project Gallery"
|
||||
description="Explore our recent fence installations across the region."
|
||||
features={[
|
||||
{ title: "Modern Privacy", description: "Vinyl fence installation for a contemporary backyard.", icon: Camera, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/pine-branches-white-wooden-fence_1372-71.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/wood-with-aged-worn-surface_23-2148394769.jpg?_wi=1" }] },
|
||||
{ title: "Rustic Charm", description: "Custom cedar wood fence project.", icon: Camera, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-shot-metal-fence-sidewalk_181624-40919.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/portrait-person-doing-arts-crafts_23-2151575713.jpg?_wi=1" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Mark D.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-goodlooking-tender-friendly-pretty-middleaged-30s-woman-extend-arm-hold-camera-hand-smiling-broadly-taking-selfie-photographing-record-videomessage-calling-husband_176420-51274.jpg"},
|
||||
{
|
||||
id: "2", name: "Emily R.", imageSrc: "http://img.b2bpic.net/free-photo/woman-dress-standing-green-house_23-2148068656.jpg"},
|
||||
{
|
||||
id: "3", name: "Sarah L.", imageSrc: "http://img.b2bpic.net/free-photo/performing-housework-gentle-dreamy-atmosphere_23-2151469427.jpg"},
|
||||
{
|
||||
id: "4", name: "David K.", imageSrc: "http://img.b2bpic.net/free-photo/man-using-mobile-phone_23-2148000041.jpg"},
|
||||
{
|
||||
id: "5", name: "John M.", imageSrc: "http://img.b2bpic.net/free-photo/boy-putting-up-electric-guitar_23-2148006422.jpg"},
|
||||
]}
|
||||
testimonials={[{ id: "1", name: "Mark D.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-goodlooking-tender-friendly-pretty-middleaged-30s-woman-extend-arm-hold-camera-hand-smiling-broadly-taking-selfie-photographing-record-videomessage-calling-husband_176420-51274.jpg" }, { id: "2", name: "Emily R.", imageSrc: "http://img.b2bpic.net/free-photo/woman-dress-standing-green-house_23-2148068656.jpg" }]}
|
||||
cardTitle="Client Stories"
|
||||
cardTag="Testimonials"
|
||||
cardAnimation="slide-up"
|
||||
@@ -157,17 +100,13 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
<ContactSplit
|
||||
tag="Contact Us"
|
||||
title="Ready to Start?"
|
||||
description="Request your free consultation and quote for your property fence today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us Now", href: "mailto:info@henryfence.com"},
|
||||
]}
|
||||
title="Let's Connect"
|
||||
description="Henry's Fence Inc. is ready to help with your project. Contact us today for a free estimate."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/pine-branches-white-wooden-fence_1372-71.jpg"
|
||||
mediaPosition="left"
|
||||
className="py-20"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -175,22 +114,8 @@ export default function LandingPage() {
|
||||
<FooterBaseCard
|
||||
logoText="Henry's Fence"
|
||||
columns={[
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About", href: "#about"},
|
||||
{
|
||||
label: "Services", href: "#features"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
{
|
||||
label: "Privacy Policy", href: "#"},
|
||||
],
|
||||
},
|
||||
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#features" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "Privacy Policy", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user