Files
6e07f6ac-0836-4610-a5c7-059…/src/app/page.tsx
2026-04-05 09:47:50 +00:00

232 lines
11 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import { BarChart2, Building2, Compass, Diamond, Shield, ShieldCheck } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="directional-hover"
defaultTextAnimation="background-highlight"
borderRadius="rounded"
contentWidth="compact"
sizing="medium"
background="none"
cardStyle="glass-elevated"
primaryButtonStyle="flat"
secondaryButtonStyle="layered"
headingFontWeight="extrabold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Home", id: "hero"},
{
name: "About", id: "about"},
{
name: "Services", id: "services"},
{
name: "Testimonials", id: "testimonials"},
{
name: "Contact", id: "contact"},
]}
brandName="Jireh Fence Corp"
button={{
text: "Get a Quote", href: "#contact"
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroCentered
background={{
variant: "plain"}}
title="Quality Fence Installation You Can Trust"
description="Jireh Fence Corp provides premium fencing solutions for residential and commercial properties. Built for durability, security, and style."
avatars={[
{
src: "http://img.b2bpic.net/free-photo/young-adult-traveling-using-sustainable-mobility_23-2149292681.jpg", alt: "Customer 1"},
{
src: "http://img.b2bpic.net/free-photo/greenhouse-owner-presenting-flowers-options-potential-customer-retailer-using-laptop_158595-7057.jpg", alt: "Customer 2"},
{
src: "http://img.b2bpic.net/free-photo/smiling-woman-carrying-bag-greenhouse_23-2148396841.jpg", alt: "Customer 3"},
{
src: "http://img.b2bpic.net/free-photo/beautiful-woman-managing-her-work-from-home-drinking-coffee-looking-laptop-sitting-kitchen_1258-199672.jpg", alt: "Customer 4"},
{
src: "http://img.b2bpic.net/free-photo/people-meeting-discussing-neighbourhood_23-2149447156.jpg", alt: "Customer 5"},
]}
buttons={[
{
text: "Get a Free Quote", href: "#contact"},
{
text: "View Our Services", href: "#services"},
]}
buttonAnimation="slide-up"
marqueeItems={[
{
type: "text-icon", text: "Licensed & Insured", icon: ShieldCheck,
},
{
type: "text-icon", text: "Free Estimates", icon: BarChart2,
},
{
type: "text-icon", text: "Custom Designs", icon: Compass,
},
{
type: "text-icon", text: "Premium Materials", icon: Diamond,
},
{
type: "text-icon", text: "Expert Craftsmanship", icon: Building2,
},
]}
/>
</div>
<div id="about" data-section="about">
<TestimonialAboutCard
useInvertedBackground={true}
tag="Our Commitment"
title="Crafting Boundaries with Integrity"
description="At Jireh Fence Corp, we believe in doing the job right the first time. Our team brings years of experience to every project, ensuring your property is secured with top-tier materials."
subdescription="From classic wood to modern aluminum, we focus on craftsmanship that stands the test of time."
icon={Shield}
imageSrc="http://img.b2bpic.net/free-photo/rebar-bending-by-worker-rusty-jig-construction-site_1150-10122.jpg"
mediaAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: "feat-1", title: "Durable Materials", subtitle: "Top-grade wood, metal, and PVC", category: "Quality", value: "100%"},
{
id: "feat-2", title: "Expert Installation", subtitle: "Skilled and careful craftsmanship", category: "Service", value: "Expert"},
{
id: "feat-3", title: "Custom Designs", subtitle: "Tailored to your specific needs", category: "Design", value: "Unique"},
]}
title="Why Choose Jireh Fence?"
description="We combine professional expertise with reliable service to deliver exceptional results."
/>
</div>
<div id="products" data-section="products">
<ProductCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{
id: "p1", name: "Cedar Wood Fence", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-field-full-yellow-flowers-trees-old-wooden-fence_181624-16284.jpg"},
{
id: "p2", name: "Modern Aluminum", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/house-entrance-japan-building_23-2149301080.jpg"},
{
id: "p3", name: "Privacy Vinyl", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/landscape-shot-brown-wooden-fence-mini-forest-with-clear-blue-sky_181624-17330.jpg"},
{
id: "p4", name: "Wrought Iron", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-stairs_1162-144.jpg"},
{
id: "p5", name: "Chain Link", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/shadows-made-by-daylight-city-with-architecture_23-2149451203.jpg"},
{
id: "p6", name: "Ranch Rail", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/wooden-cross-nature-with-wooden-fence-it_181624-45737.jpg"},
]}
title="Our Fence Offerings"
description="Explore our variety of high-quality fencing styles designed to enhance your property's value and security."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTen
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1", title: "Great Work", quote: "Jireh Fence transformed our backyard with a beautiful cedar fence. Professional and quick.", name: "Sarah J.", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/young-adult-traveling-using-sustainable-mobility_23-2149292681.jpg"},
{
id: "2", title: "Extremely Happy", quote: "The aluminum gate looks perfect. The team was punctual and tidy throughout.", name: "Michael D.", role: "Property Owner", imageSrc: "http://img.b2bpic.net/free-photo/greenhouse-owner-presenting-flowers-options-potential-customer-retailer-using-laptop_158595-7057.jpg"},
{
id: "3", title: "Solid Installation", quote: "Highly recommended for their quality and fair pricing. Our fence is very sturdy.", name: "Emily R.", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/smiling-woman-carrying-bag-greenhouse_23-2148396841.jpg"},
{
id: "4", title: "Perfect Privacy", quote: "We finally have the privacy we wanted. Jireh Fence exceeded our expectations.", name: "David W.", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-managing-her-work-from-home-drinking-coffee-looking-laptop-sitting-kitchen_1258-199672.jpg"},
{
id: "5", title: "Reliable Team", quote: "They installed a durable chain link fence for our warehouse. Very efficient.", name: "Robert M.", role: "Business Owner", imageSrc: "http://img.b2bpic.net/free-photo/people-meeting-discussing-neighbourhood_23-2149447156.jpg"},
]}
title="What Our Clients Say"
description="Building trust, one fence at a time."
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="default"
useInvertedBackground={true}
faqs={[
{
id: "f1", title: "Do you offer free estimates?", content: "Yes, we provide free onsite estimates for all fence projects."},
{
id: "f2", title: "How long does installation take?", content: "The duration depends on the fence type and size, usually 1-3 days."},
{
id: "f3", title: "Are your materials warrantied?", content: "Yes, we offer warranties on both our installation and materials."},
]}
title="Common Questions"
description="Here is what you need to know about our fence installation services."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain"}}
title="Start Your Project Today"
description="Ready for a new fence? Send us your details, and we'll reach out to schedule your free estimate."
imageSrc="http://img.b2bpic.net/free-photo/woman-sitting-ladder-looking-smart-phone-having-stress_1150-19380.jpg"
mediaAnimation="slide-up"
tag="Contact Us"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="Jireh Fence Corp"
columns={[
{
title: "Company", items: [
{
label: "About Us", href: "#about"},
{
label: "Contact", href: "#contact"},
],
},
{
title: "Services", items: [
{
label: "Fence Installation", href: "#services"},
{
label: "Repairs", href: "#services"},
],
},
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}