Merge version_1 into main #2
394
src/app/page.tsx
394
src/app/page.tsx
@@ -17,287 +17,137 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="bounce-effect"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Fish & Fins"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Fish & Fins"
|
||||
button={{ text: "Contact Us", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
title="Bring Your Underwater World to Life"
|
||||
description="Premium accessories and supplies for every fish enthusiast. From advanced filtration to stunning decor, we provide everything your aquarium needs to thrive."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Accessories",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/glass-vase-with-plants-inside_23-2147997178.jpg?_wi=1"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/handsome-man-holding-glass-jar-with-sweets-inside_1368-3847.jpg",
|
||||
alt: "Customer 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/handsome-man-engraving-wood-outdoors_23-2149061721.jpg",
|
||||
alt: "Customer 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/side-view-happy-woman-with-cute-dinosaur_23-2148287870.jpg",
|
||||
alt: "Customer 3",
|
||||
},
|
||||
{
|
||||
src: "test-4",
|
||||
alt: "Customer 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/family-three-spending-time-together-outdoors-father-s-day_23-2150167745.jpg",
|
||||
alt: "Customer 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Trusted by 10,000+ happy aquarists"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Premium Filtration",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Sustainable Decor",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Expert Lighting",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "High-Nutrition Feed",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Freshwater Essentials",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Bring Your Underwater World to Life"
|
||||
description="Premium accessories and supplies for every fish enthusiast. From advanced filtration to stunning decor, we provide everything your aquarium needs to thrive."
|
||||
buttons={[{ text: "Shop Accessories", href: "#products" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/glass-vase-with-plants-inside_23-2147997178.jpg"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/handsome-man-holding-glass-jar-with-sweets-inside_1368-3847.jpg", alt: "Customer 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/handsome-man-engraving-wood-outdoors_23-2149061721.jpg", alt: "Customer 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/side-view-happy-woman-with-cute-dinosaur_23-2148287870.jpg", alt: "Customer 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/obese-bearded-male-sailor-wiith-fishing-net_273609-48279.jpg", alt: "Customer 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/family-three-spending-time-together-outdoors-father-s-day_23-2150167745.jpg", alt: "Customer 5" }
|
||||
]}
|
||||
avatarText="Trusted by 10,000+ happy aquarists"
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Premium Filtration" },
|
||||
{ type: "text", text: "Sustainable Decor" },
|
||||
{ type: "text", text: "Expert Lighting" },
|
||||
{ type: "text", text: "High-Nutrition Feed" },
|
||||
{ type: "text", text: "Freshwater Essentials" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Years of Excellence in Aquatics"
|
||||
description="We specialize in high-quality accessories that ensure your fish stay healthy and your tank remains a centerpiece in your home."
|
||||
metrics={[
|
||||
{
|
||||
value: "10k+",
|
||||
title: "Happy Fish",
|
||||
},
|
||||
{
|
||||
value: "500+",
|
||||
title: "Unique Products",
|
||||
},
|
||||
{
|
||||
value: "15",
|
||||
title: "Expert Team",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/back-view-woman-playing-theme-park_23-2148287918.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Years of Excellence in Aquatics"
|
||||
description="We specialize in high-quality accessories that ensure your fish stay healthy and your tank remains a centerpiece in your home."
|
||||
metrics={[
|
||||
{ value: "10k+", title: "Happy Fish" },
|
||||
{ value: "500+", title: "Unique Products" },
|
||||
{ value: "15", title: "Expert Team" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/back-view-woman-playing-theme-park_23-2148287918.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Premium Filter",
|
||||
price: "$49.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hand-pouring-water-glass-container-filled-with-pieces-paper_23-2147845512.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "LED Smart Light",
|
||||
price: "$89.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-colorful-siamese-betta-fish_1150-9448.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Nutri-Flakes",
|
||||
price: "$12.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wooden-board-with-delicious-oatmeal-slice-orange-fruit_114579-86620.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Blue Sand Substrate",
|
||||
price: "$19.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vibrant-coral-reef-underwater-scene_23-2152006400.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Stone Ornament",
|
||||
price: "$24.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/surreal-rendering-dolphin-ruins_23-2151253629.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Green Foliage Pack",
|
||||
price: "$15.99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/active-tail-fanning-carpathian-newt-lissotriton-montandi-trying-attract-female-reproduce_181624-55853.jpg",
|
||||
},
|
||||
]}
|
||||
title="Curated Fish Essentials"
|
||||
description="Browse our hand-picked selection of top-tier aquarium hardware and decor."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", name: "Premium Filter", price: "$49.99", imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hand-pouring-water-glass-container-filled-with-pieces-paper_23-2147845512.jpg" },
|
||||
{ id: "2", name: "LED Smart Light", price: "$89.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-colorful-siamese-betta-fish_1150-9448.jpg" },
|
||||
{ id: "3", name: "Nutri-Flakes", price: "$12.99", imageSrc: "http://img.b2bpic.net/free-photo/wooden-board-with-delicious-oatmeal-slice-orange-fruit_114579-86620.jpg" },
|
||||
{ id: "4", name: "Blue Sand Substrate", price: "$19.99", imageSrc: "http://img.b2bpic.net/free-photo/vibrant-coral-reef-underwater-scene_23-2152006400.jpg" },
|
||||
{ id: "5", name: "Stone Ornament", price: "$24.99", imageSrc: "http://img.b2bpic.net/free-photo/surreal-rendering-dolphin-ruins_23-2151253629.jpg" },
|
||||
{ id: "6", name: "Green Foliage Pack", price: "$15.99", imageSrc: "http://img.b2bpic.net/free-photo/active-tail-fanning-carpathian-newt-lissotriton-montandi-trying-attract-female-reproduce_181624-55853.jpg" }
|
||||
]}
|
||||
title="Curated Fish Essentials"
|
||||
description="Browse our hand-picked selection of top-tier aquarium hardware and decor."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alice M.",
|
||||
date: "2023-10-01",
|
||||
title: "Fantastic quality",
|
||||
quote: "My fish have never looked healthier.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/handsome-man-holding-glass-jar-with-sweets-inside_1368-3847.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glass-vase-with-plants-inside_23-2147997178.jpg?_wi=2",
|
||||
imageAlt: "beautiful tropical fish aquarium setup",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Bob D.",
|
||||
date: "2023-11-15",
|
||||
title: "Great decor",
|
||||
quote: "The ornaments look natural.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/handsome-man-engraving-wood-outdoors_23-2149061721.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/back-view-woman-playing-theme-park_23-2148287918.jpg?_wi=2",
|
||||
imageAlt: "professional aquarium maintenance services",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Carol S.",
|
||||
date: "2023-12-05",
|
||||
title: "Reliable store",
|
||||
quote: "Fast shipping and great service.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/side-view-happy-woman-with-cute-dinosaur_23-2148287870.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hand-pouring-water-glass-container-filled-with-pieces-paper_23-2147845512.jpg?_wi=2",
|
||||
imageAlt: "high quality aquarium filter setup",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David L.",
|
||||
date: "2024-01-20",
|
||||
title: "Amazing lights",
|
||||
quote: "The LED lighting is perfect.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/obese-bearded-male-sailor-wiith-fishing-net_273609-48279.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-colorful-siamese-betta-fish_1150-9448.jpg?_wi=2",
|
||||
imageAlt: "aquarium lights led for fish",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Eve W.",
|
||||
date: "2024-02-12",
|
||||
title: "Highly recommend",
|
||||
quote: "The best range of accessories.",
|
||||
tag: "Verified",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/family-three-spending-time-together-outdoors-father-s-day_23-2150167745.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wooden-board-with-delicious-oatmeal-slice-orange-fruit_114579-86620.jpg?_wi=2",
|
||||
imageAlt: "aquarium food premium fish flakes",
|
||||
},
|
||||
]}
|
||||
title="What Our Community Says"
|
||||
description="Trusted by hundreds of hobbyists worldwide."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alice M.", date: "2023-10-01", title: "Fantastic quality", quote: "My fish have never looked healthier.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/handsome-man-holding-glass-jar-with-sweets-inside_1368-3847.jpg", imageSrc: "http://img.b2bpic.net/free-photo/glass-vase-with-plants-inside_23-2147997178.jpg" },
|
||||
{ id: "2", name: "Bob D.", date: "2023-11-15", title: "Great decor", quote: "The ornaments look natural.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/handsome-man-engraving-wood-outdoors_23-2149061721.jpg", imageSrc: "http://img.b2bpic.net/free-photo/back-view-woman-playing-theme-park_23-2148287918.jpg" },
|
||||
{ id: "3", name: "Carol S.", date: "2023-12-05", title: "Reliable store", quote: "Fast shipping and great service.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/side-view-happy-woman-with-cute-dinosaur_23-2148287870.jpg", imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hand-pouring-water-glass-container-filled-with-pieces-paper_23-2147845512.jpg" },
|
||||
{ id: "4", name: "David L.", date: "2024-01-20", title: "Amazing lights", quote: "The LED lighting is perfect.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/obese-bearded-male-sailor-wiith-fishing-net_273609-48279.jpg", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-colorful-siamese-betta-fish_1150-9448.jpg" },
|
||||
{ id: "5", name: "Eve W.", date: "2024-02-12", title: "Highly recommend", quote: "The best range of accessories.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/family-three-spending-time-together-outdoors-father-s-day_23-2150167745.jpg", imageSrc: "http://img.b2bpic.net/free-photo/wooden-board-with-delicious-oatmeal-slice-orange-fruit_114579-86620.jpg" }
|
||||
]}
|
||||
title="What Our Community Says"
|
||||
description="Trusted by hundreds of hobbyists worldwide."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How often should I clean my filter?",
|
||||
content: "We recommend cleaning every 4-6 weeks for optimal performance.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Are these plants safe for goldfish?",
|
||||
content: "Yes, our artificial plants are completely non-toxic and goldfish-safe.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Do you ship internationally?",
|
||||
content: "Currently we only ship within the continental US.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Quick answers to help you get the most out of your aquarium."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqBase
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "1", title: "How often should I clean my filter?", content: "We recommend cleaning every 4-6 weeks for optimal performance." },
|
||||
{ id: "2", title: "Are these plants safe for goldfish?", content: "Yes, our artificial plants are completely non-toxic and goldfish-safe." },
|
||||
{ id: "3", title: "Do you ship internationally?", content: "Currently we only ship within the continental US." }
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Quick answers to help you get the most out of your aquarium."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Keep in touch"
|
||||
title="Join the Aquatic Newsletter"
|
||||
description="Get exclusive tips and product updates delivered to your inbox."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Keep in touch"
|
||||
title="Join the Aquatic Newsletter"
|
||||
description="Get exclusive tips and product updates delivered to your inbox."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Fish & Fins"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Fish & Fins"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user