Merge version_1 into main #2
364
src/app/page.tsx
364
src/app/page.tsx
@@ -14,278 +14,114 @@ import { Award, Camera, Clock } from "lucide-react";
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="shift-hover"
|
||||
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">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Portfolio",
|
||||
id: "portfolio",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Lens & Light"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Portfolio", id: "portfolio" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Lens & Light"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Capturing Timeless Moments"
|
||||
description="Professional photography services tailored to your unique story. Immersive, high-quality, and creative visuals delivered with precision."
|
||||
buttons={[
|
||||
{
|
||||
text: "View Portfolio",
|
||||
href: "#portfolio",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photographers-exploring-abandoned-location_23-2150974366.jpg?_wi=1",
|
||||
imageAlt: "Portrait photography",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-circular-neon-lights-background_23-2147815472.jpg?_wi=1",
|
||||
imageAlt: "Light photography",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-having-sake-drink-restaurant_107420-65731.jpg?_wi=1",
|
||||
imageAlt: "Wedding photography",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-taking-pictures_23-2149735270.jpg?_wi=1",
|
||||
imageAlt: "Black and white photography",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-white-clothes_23-2148910210.jpg?_wi=1",
|
||||
imageAlt: "Street photography",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915105.jpg",
|
||||
imageAlt: "Fashion photography",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Capturing Timeless Moments"
|
||||
description="Professional photography services tailored to your unique story. Immersive, high-quality, and creative visuals delivered with precision."
|
||||
buttons={[{ text: "View Portfolio", href: "#portfolio" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/photographers-exploring-abandoned-location_23-2150974366.jpg", imageAlt: "Portrait photography" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/blue-circular-neon-lights-background_23-2147815472.jpg", imageAlt: "Light photography" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/couple-having-sake-drink-restaurant_107420-65731.jpg", imageAlt: "Wedding photography" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-taking-pictures_23-2149735270.jpg", imageAlt: "Black and white photography" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-white-clothes_23-2148910210.jpg", imageAlt: "Street photography" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/spotlight-portrait-golden-hour_23-2151915105.jpg", imageAlt: "Fashion photography" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Expertise Behind the Lens"
|
||||
metrics={[
|
||||
{
|
||||
icon: Camera,
|
||||
label: "Projects Completed",
|
||||
value: "500+",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Industry Awards",
|
||||
value: "15",
|
||||
},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Years Experience",
|
||||
value: "10+",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Expertise Behind the Lens"
|
||||
metrics={[
|
||||
{ icon: Camera, label: "Projects Completed", value: "500+" },
|
||||
{ icon: Award, label: "Industry Awards", value: "15" },
|
||||
{ icon: Clock, label: "Years Experience", value: "10+" },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Wedding Collection",
|
||||
price: "From $500",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cute-lovely-couple-beach_1328-1316.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Studio Portrait",
|
||||
price: "From $200",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-16435.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Landscape Series",
|
||||
price: "From $150",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/decorative-dreamy-arrangement-with-dried-flowers_23-2151363338.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Editorial Fashion",
|
||||
price: "From $600",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-long-brown-hair-white-shorts-black-jacket-posing-floor-studio_613910-11025.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Event Highlights",
|
||||
price: "From $400",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-walking-evening-outside-street_1303-17045.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Culinary Art",
|
||||
price: "From $300",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/plate-with-boiled-egg-wild-garlic-flower_166373-664.jpg",
|
||||
},
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="A glimpse into our photography collection covering weddings, portraits, and landscapes."
|
||||
/>
|
||||
</div>
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="split-description"
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Wedding Collection", price: "From $500", imageSrc: "http://img.b2bpic.net/free-photo/cute-lovely-couple-beach_1328-1316.jpg" },
|
||||
{ id: "p2", name: "Studio Portrait", price: "From $200", imageSrc: "http://img.b2bpic.net/free-photo/portrait-bearded-black-man-wool-suit_613910-16435.jpg" },
|
||||
{ id: "p3", name: "Landscape Series", price: "From $150", imageSrc: "http://img.b2bpic.net/free-photo/decorative-dreamy-arrangement-with-dried-flowers_23-2151363338.jpg" },
|
||||
{ id: "p4", name: "Editorial Fashion", price: "From $600", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-with-long-brown-hair-white-shorts-black-jacket-posing-floor-studio_613910-11025.jpg" },
|
||||
{ id: "p5", name: "Event Highlights", price: "From $400", imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-walking-evening-outside-street_1303-17045.jpg" },
|
||||
{ id: "p6", name: "Culinary Art", price: "From $300", imageSrc: "http://img.b2bpic.net/free-photo/plate-with-boiled-egg-wild-garlic-flower_166373-664.jpg" },
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="A glimpse into our photography collection covering weddings, portraits, and landscapes."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Miller",
|
||||
date: "Jan 2024",
|
||||
title: "Wedding Client",
|
||||
quote: "Incredible eye for detail. Every shot captured the emotion perfectly.",
|
||||
tag: "Wedding",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/joyful-happy-student-guy-calling-phone-park_1262-20582.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photographers-exploring-abandoned-location_23-2150974366.jpg?_wi=2",
|
||||
imageAlt: "photographer holding camera professional portrait",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "John Davis",
|
||||
date: "Dec 2023",
|
||||
title: "Corporate Client",
|
||||
quote: "Professional, efficient, and great quality photos. Will definitely book again.",
|
||||
tag: "Portrait",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020792.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-circular-neon-lights-background_23-2147815472.jpg?_wi=2",
|
||||
imageAlt: "abstract light lens flare photography",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emma Wilson",
|
||||
date: "Nov 2023",
|
||||
title: "Engaged Couple",
|
||||
quote: "The session was so fun and the results were breathtaking. Thank you!",
|
||||
tag: "Couple",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-couple-spend-time-autumn-field_1157-26844.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-having-sake-drink-restaurant_107420-65731.jpg?_wi=2",
|
||||
imageAlt: "wedding photography candid moment emotional",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Robert Chen",
|
||||
date: "Oct 2023",
|
||||
title: "Fashion Model",
|
||||
quote: "A true professional with an amazing creative vision.",
|
||||
tag: "Editorial",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/welldressed-young-woman-turban-looking-away-studio-shot-graceful-female-model-isolated-pink-background_197531-25919.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-taking-pictures_23-2149735270.jpg?_wi=2",
|
||||
imageAlt: "black and white portrait photography artistic",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Laura Bennett",
|
||||
date: "Sep 2023",
|
||||
title: "Family Client",
|
||||
quote: "So patient with my kids. The photos are our most cherished family memories.",
|
||||
tag: "Family",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/cute-family-playing-summer-park_1157-21056.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-white-clothes_23-2148910210.jpg?_wi=2",
|
||||
imageAlt: "urban street photography style creative",
|
||||
},
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="Hear what our amazing clients have to say about their experience."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="split-description"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Miller", date: "Jan 2024", title: "Wedding Client", quote: "Incredible eye for detail. Every shot captured the emotion perfectly.", tag: "Wedding", avatarSrc: "http://img.b2bpic.net/free-photo/joyful-happy-student-guy-calling-phone-park_1262-20582.jpg", imageSrc: "http://img.b2bpic.net/free-photo/photographers-exploring-abandoned-location_23-2150974366.jpg", imageAlt: "photographer holding camera professional portrait" },
|
||||
{ id: "2", name: "John Davis", date: "Dec 2023", title: "Corporate Client", quote: "Professional, efficient, and great quality photos. Will definitely book again.", tag: "Portrait", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020792.jpg", imageSrc: "http://img.b2bpic.net/free-photo/blue-circular-neon-lights-background_23-2147815472.jpg", imageAlt: "abstract light lens flare photography" },
|
||||
{ id: "3", name: "Emma Wilson", date: "Nov 2023", title: "Engaged Couple", quote: "The session was so fun and the results were breathtaking. Thank you!", tag: "Couple", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-couple-spend-time-autumn-field_1157-26844.jpg", imageSrc: "http://img.b2bpic.net/free-photo/couple-having-sake-drink-restaurant_107420-65731.jpg", imageAlt: "wedding photography candid moment emotional" },
|
||||
{ id: "4", name: "Robert Chen", date: "Oct 2023", title: "Fashion Model", quote: "A true professional with an amazing creative vision.", tag: "Editorial", avatarSrc: "http://img.b2bpic.net/free-photo/welldressed-young-woman-turban-looking-away-studio-shot-graceful-female-model-isolated-pink-background_197531-25919.jpg", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-taking-pictures_23-2149735270.jpg", imageAlt: "black and white portrait photography artistic" },
|
||||
{ id: "5", name: "Laura Bennett", date: "Sep 2023", title: "Family Client", quote: "So patient with my kids. The photos are our most cherished family memories.", tag: "Family", avatarSrc: "http://img.b2bpic.net/free-photo/cute-family-playing-summer-park_1157-21056.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-white-clothes_23-2148910210.jpg", imageAlt: "urban street photography style creative" },
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="Hear what our amazing clients have to say about their experience."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "rotated-rays-animated",
|
||||
}}
|
||||
text="Ready to capture your next big moment? Let’s work together to create something beautiful."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "mailto:hello@lensandlight.com",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "rotated-rays-animated" }}
|
||||
text="Ready to capture your next big moment? Let’s work together to create something beautiful."
|
||||
buttons={[{ text: "Contact Us", href: "mailto:hello@lensandlight.com" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Lens & Light"
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Weddings",
|
||||
href: "#portfolio",
|
||||
},
|
||||
{
|
||||
label: "Portraits",
|
||||
href: "#portfolio",
|
||||
},
|
||||
{
|
||||
label: "Editorial",
|
||||
href: "#portfolio",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Lens & Light"
|
||||
columns={[
|
||||
{ title: "Services", items: [{ label: "Weddings", href: "#portfolio" }, { label: "Portraits", href: "#portfolio" }, { label: "Editorial", href: "#portfolio" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }, { label: "Privacy", href: "#" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user