Add src/app/gallery/page.tsx

This commit is contained in:
2026-03-06 15:12:04 +00:00
parent aa7e3122c4
commit c2d3c686bc

138
src/app/gallery/page.tsx Normal file
View File

@@ -0,0 +1,138 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
import TeamCardSix from "@/components/sections/team/TeamCardSix";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import { Image, Heart } from "lucide-react";
export default function GalleryPage() {
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumSmall"
sizing="large"
background="circleGradient"
cardStyle="gradient-mesh"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="bold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Daily Tracker"
navItems={[
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Gallery", id: "/gallery" },
]}
button={{ text: "Book Services", href: "/services" }}
animateOnLoad={true}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardCarousel
tag="Photo Gallery"
title="Our Portfolio"
description="Explore our collection of stunning balloon decorations, elegant wedding setups, and beautiful event celebrations. Each image tells a story of our commitment to creating magical moments."
background={{ variant: "animated-grid" }}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-vector/celebration-background-with-balloons_1212-343.jpg?_wi=1", imageAlt: "Balloon arch decoration"},
{
imageSrc: "http://img.b2bpic.net/free-vector/wedding-couple-illustration_1212-456.jpg?_wi=1", imageAlt: "Wedding venue setup"},
{
imageSrc: "http://img.b2bpic.net/free-vector/party-decoration-elements_1212-789.jpg?_wi=1", imageAlt: "Party decorations"},
{
imageSrc: "http://img.b2bpic.net/free-vector/event-planning-concept_1212-321.jpg?_wi=1", imageAlt: "Event decoration detail"},
{
imageSrc: "http://img.b2bpic.net/free-vector/balloons-confetti-celebration_1212-654.jpg?_wi=1", imageAlt: "Festive celebration setup"},
]}
buttons={[
{ text: "View Services", href: "/services" },
{ text: "Get Quote", href: "#contact" },
]}
buttonAnimation="slide-up"
/>
</div>
<div id="gallery" data-section="gallery">
<TeamCardSix
tag="Project Gallery"
title="Our Best Works"
description="A curated collection of our most stunning balloon decorations and wedding celebrations. Each image showcases our attention to detail and creative expertise."
textboxLayout="default"
useInvertedBackground={false}
gridVariant="bento-grid"
animationType="scale-rotate"
members={[
{
id: "1", name: "Elegant Balloon Arch", role: "Wedding Entrance", imageSrc: "http://img.b2bpic.net/free-vector/celebration-background-with-balloons_1212-343.jpg?_wi=2", imageAlt: "Elegant balloon arch decoration"},
{
id: "2", name: "Wedding Ceremony Setup", role: "Venue Decoration", imageSrc: "http://img.b2bpic.net/free-vector/wedding-couple-illustration_1212-456.jpg?_wi=2", imageAlt: "Wedding ceremony venue"},
{
id: "3", name: "Birthday Balloon Display", role: "Party Decoration", imageSrc: "http://img.b2bpic.net/free-vector/party-decoration-elements_1212-789.jpg?_wi=2", imageAlt: "Colorful birthday balloon display"},
{
id: "4", name: "Event Centerpieces", role: "Table Decoration", imageSrc: "http://img.b2bpic.net/free-vector/event-planning-concept_1212-321.jpg?_wi=2", imageAlt: "Elegant event centerpieces"},
{
id: "5", name: "Grand Balloon Installation", role: "Large Event Setup", imageSrc: "http://img.b2bpic.net/free-vector/balloons-confetti-celebration_1212-654.jpg?_wi=2", imageAlt: "Grand balloon installation"},
{
id: "6", name: "Reception Ambiance", role: "Wedding Reception", imageSrc: "http://img.b2bpic.net/free-vector/celebration-background-with-balloons_1212-343.jpg?_wi=3", imageAlt: "Wedding reception ambiance"},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCTA
tag="Inspired?"
tagIcon={Heart}
tagAnimation="slide-up"
title="Let's Create Something Beautiful"
description="Interested in booking our services? Contact us to discuss your event vision and let us help you create an unforgettable celebration with our professional balloon decoration and wedding services."
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
buttons={[
{ text: "Book Now", href: "/services" },
{ text: "Contact Us", href: "#" },
]}
buttonAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterSimple
columns={[
{
title: "Pages", items: [
{ label: "Home", href: "/" },
{ label: "Services", href: "/services" },
{ label: "Gallery", href: "/gallery" },
],
},
{
title: "Services", items: [
{ label: "Balloon Decoration", href: "/services" },
{ label: "Wedding Planning", href: "/services" },
{ label: "Event Decoration", href: "/services" },
],
},
{
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
{ label: "Contact", href: "#contact" },
],
},
]}
bottomLeftText="© 2025 Event Celebrations. All rights reserved."
bottomRightText="Creating unforgettable moments"
/>
</div>
</ThemeProvider>
);
}