312 lines
9.3 KiB
TypeScript
312 lines
9.3 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
|
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="mediumLarge"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="grid"
|
|
cardStyle="outline"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
navItems={[
|
|
{
|
|
name: "About",
|
|
id: "about",
|
|
},
|
|
{
|
|
name: "Services",
|
|
id: "services",
|
|
},
|
|
{
|
|
name: "Testimonials",
|
|
id: "testimonials",
|
|
},
|
|
{
|
|
name: "Pricing",
|
|
id: "pricing",
|
|
},
|
|
{
|
|
name: "Contact",
|
|
id: "contact",
|
|
},
|
|
]}
|
|
brandName="Foto Business"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
background={{
|
|
variant: "gradient-bars",
|
|
}}
|
|
title="Capture Your Moments, Preserve Your Memories"
|
|
description="Professional photography for weddings, portraits, and events. See our portfolio and book your session today."
|
|
kpis={[
|
|
{
|
|
value: "500+",
|
|
label: "Sessions Completed",
|
|
},
|
|
{
|
|
value: "150+",
|
|
label: "Happy Families",
|
|
},
|
|
{
|
|
value: "100%",
|
|
label: "Client Satisfaction",
|
|
},
|
|
]}
|
|
enableKpiAnimation={true}
|
|
buttons={[
|
|
{
|
|
text: "View Our Gallery",
|
|
href: "#services",
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-psd/wedding-celebration-landing-page_23-2149980631.jpg"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/side-view-smiley-bride-looking-mirror_23-2149721987.jpg",
|
|
alt: "Client 1",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/romantic-couple-dancing-medium-shot_23-2149478711.jpg",
|
|
alt: "Client 2",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/family-have-fun-park_1157-15860.jpg",
|
|
alt: "Client 3",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/closeup-smiling-middle-aged-business-leader_1262-4845.jpg",
|
|
alt: "Client 4",
|
|
},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/beautiful-fashion-woman-her-handsome-elegant-boyfriend-suit-sexy-brunette-model-black-evening-dress-fashionable-couple-posing-street-europe-brutal-man-his-female-outdoors_158538-22944.jpg",
|
|
alt: "Client 5",
|
|
},
|
|
]}
|
|
avatarText="Trusted by over 500+ happy clients"
|
|
marqueeItems={[
|
|
{
|
|
type: "text",
|
|
text: "Wedding Photography",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Portrait Sessions",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Commercial Work",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Event Coverage",
|
|
},
|
|
{
|
|
type: "text",
|
|
text: "Professional Editing",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<InlineImageSplitTextAbout
|
|
useInvertedBackground={false}
|
|
heading={[
|
|
{
|
|
type: "text",
|
|
content: "Capturing the story behind every frame.",
|
|
},
|
|
{
|
|
type: "image",
|
|
src: "http://img.b2bpic.net/free-photo/medium-shot-man-taking-photos_23-2148503568.jpg",
|
|
alt: "Photographer at work",
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureCardEight
|
|
textboxLayout="inline-image"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
id: 1,
|
|
title: "Wedding Photography",
|
|
description: "Capturing every candid emotion and special detail of your wedding day with artistic precision.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-fashion-woman-her-handsome-elegant-boyfriend-suit-sexy-brunette-model-black-evening-dress-fashionable-couple-posing-street-europe-brutal-man-his-female-outdoors_158538-22944.jpg",
|
|
},
|
|
{
|
|
id: 2,
|
|
title: "Portrait Sessions",
|
|
description: "High-quality portrait photography for individuals and families, focusing on authenticity and style.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/our-family-is-priority-us_329181-8640.jpg",
|
|
},
|
|
{
|
|
id: 3,
|
|
title: "Commercial Photography",
|
|
description: "Elevating your brand identity with sharp, professional imagery for your business and products.",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-working-photography-studio_23-2150254644.jpg",
|
|
},
|
|
]}
|
|
title="Professional Photography Services"
|
|
description="From intimate portraits to large-scale events, we offer a range of specialized photography services tailored to your unique needs."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1",
|
|
name: "Sarah & Mark",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-bride-looking-mirror_23-2149721987.jpg?_wi=1",
|
|
},
|
|
{
|
|
id: "2",
|
|
name: "The Williams Family",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/romantic-couple-dancing-medium-shot_23-2149478711.jpg",
|
|
},
|
|
{
|
|
id: "3",
|
|
name: "Elite Design Studio",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/family-have-fun-park_1157-15860.jpg",
|
|
},
|
|
{
|
|
id: "4",
|
|
name: "John Doe",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-middle-aged-business-leader_1262-4845.jpg",
|
|
},
|
|
{
|
|
id: "5",
|
|
name: "Anna Smith",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-bride-looking-mirror_23-2149721987.jpg?_wi=2",
|
|
},
|
|
]}
|
|
cardTitle="What Our Clients Say"
|
|
cardTag="Testimonials"
|
|
cardAnimation="blur-reveal"
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardFive
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
plans={[
|
|
{
|
|
id: "basic",
|
|
tag: "Essentials",
|
|
price: "$250",
|
|
period: "session",
|
|
description: "Ideal for quick professional portraits.",
|
|
button: {
|
|
text: "Book Basic",
|
|
href: "#contact",
|
|
},
|
|
featuresTitle: "Includes:",
|
|
features: [
|
|
"1 hour session",
|
|
"15 edited digital photos",
|
|
"Digital delivery",
|
|
],
|
|
},
|
|
{
|
|
id: "pro",
|
|
tag: "Popular",
|
|
price: "$600",
|
|
period: "session",
|
|
description: "Perfect for events and detailed portraits.",
|
|
button: {
|
|
text: "Book Pro",
|
|
href: "#contact",
|
|
},
|
|
featuresTitle: "Includes:",
|
|
features: [
|
|
"3 hour session",
|
|
"50 edited digital photos",
|
|
"Full print rights",
|
|
],
|
|
},
|
|
]}
|
|
title="Simple Pricing"
|
|
description="Choose a package that fits your needs. Transparent pricing for exceptional memories."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "plain",
|
|
}}
|
|
tag="Booking"
|
|
title="Ready to book your session?"
|
|
description="We'd love to hear from you. Reach out today and let's start planning your photo session."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="Foto Business"
|
|
columns={[
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{
|
|
label: "About",
|
|
href: "#about",
|
|
},
|
|
{
|
|
label: "Services",
|
|
href: "#services",
|
|
},
|
|
],
|
|
},
|
|
{
|
|
title: "Support",
|
|
items: [
|
|
{
|
|
label: "Contact",
|
|
href: "#contact",
|
|
},
|
|
{
|
|
label: "Pricing",
|
|
href: "#pricing",
|
|
},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|