Merge version_1 into main #2

Merged
bender merged 1 commits from version_1 into main 2026-04-10 12:18:33 +00:00

View File

@@ -9,6 +9,7 @@ import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import { ShoppingBasket, CalendarDays, Truck, Flame } from 'lucide-react';
export default function LandingPage() {
return (
@@ -16,281 +17,119 @@ export default function LandingPage() {
defaultButtonVariant="text-stagger"
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: "About",
id: "about",
},
{
name: "Services",
id: "services",
},
{
name: "Reviews",
id: "reviews",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="The Crab Connect"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "hero" },
{ name: "About", id: "about" },
{ name: "Services", id: "services" },
{ name: "Reviews", id: "reviews" },
{ name: "Contact", id: "contact" },
]}
brandName="The Crab Connect"
button={{ text: "Order Online", href: "#contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "plain",
}}
title="The best crabs Delaware has to offer!"
description="Online ordering available now for local pickup! Serving Lewes, DE and surrounding areas with top-quality, local seafood."
kpis={[
{
value: "Est. 2019",
label: "Local Business",
},
{
value: "Fresh",
label: "Quality Catch",
},
{
value: "Daily",
label: "Support",
},
]}
enableKpiAnimation={true}
buttons={[
{
text: "Place your Order",
href: "#contact",
},
{
text: "Leave a Review",
href: "#reviews",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/single-crab-animal-with-copy-space_1194-638740.jpg?_wi=1"
mediaAnimation="blur-reveal"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/woman-supermarket-beautiful-young-woman-holding-salmon-fish-her-hands-concept-healthy-eating-seafood_169016-4496.jpg",
alt: "Local Customer",
},
{
src: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-food_23-2149536952.jpg",
alt: "Local Customer",
},
{
src: "http://img.b2bpic.net/free-photo/hands-holding-basket-purple-figs-white-with-blue-tablecloth_114579-29538.jpg",
alt: "Local Customer",
},
{
src: "http://img.b2bpic.net/free-photo/tom-yum-mixed-seafood-thick-soup-hot-pot-spicy-thai-food_1150-26553.jpg",
alt: "Local Customer",
},
{
src: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-basket-with-chips-light-blue-surface_140725-69485.jpg",
alt: "Local Customer",
},
]}
avatarText="Trusted by 500+ locals"
marqueeItems={[
{
type: "text",
text: "Locally Sourced",
},
{
type: "text",
text: "Delaware Pride",
},
{
type: "text",
text: "Fresh Catch Daily",
},
{
type: "text",
text: "Sustainable Fishing",
},
{
type: "text",
text: "Family Owned",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{ variant: "plain" }}
title="The best crabs Delaware has to offer!"
description="Online ordering available now for local pickup! Serving Lewes, DE and surrounding areas with top-quality, local seafood."
kpis={[
{ value: "Est. 2019", label: "Local Business" },
{ value: "Fresh", label: "Quality Catch" },
{ value: "Daily", label: "Support" },
]}
enableKpiAnimation={true}
buttons={[
{ text: "Place your Order", href: "#contact" },
{ text: "Leave a Review", href: "#reviews" },
]}
imageSrc="http://img.b2bpic.net/free-photo/single-crab-animal-with-copy-space_1194-638740.jpg"
mediaAnimation="blur-reveal"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Our Story"
description="Growing up in the small town of Lewes, DE, with a family of local water-men, Bryan Stewart's destiny was set before he was born. A dream became reality in 2019 when he created The Crab Connect to share his passion for the ocean with friends and family."
metrics={[
{
value: "5+",
title: "Years Serving",
},
{
value: "100%",
title: "Freshness",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/young-wedding-couple-sailing-boat_7502-4948.jpg?_wi=1"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Our Story"
description="Growing up in the small town of Lewes, DE, with a family of local water-men, Bryan Stewart's destiny was set before he was born. A dream became reality in 2019 when he created The Crab Connect to share his passion for the ocean with friends and family."
metrics={[
{ value: "5+", title: "Years Serving" },
{ value: "100%", title: "Freshness" },
]}
imageSrc="http://img.b2bpic.net/free-photo/young-wedding-couple-sailing-boat_7502-4948.jpg"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Local Pickup",
description: "Order online and pick up at our Lewes, DE location.",
buttonIcon: "ShoppingBasket",
imageSrc: "http://img.b2bpic.net/free-photo/single-crab-animal-with-copy-space_1194-638740.jpg?_wi=2",
imageAlt: "fresh blue crabs top view",
},
{
title: "Event Booking",
description: "Book our steam trailer for your next special event.",
buttonIcon: "CalendarDays",
imageSrc: "http://img.b2bpic.net/free-photo/young-wedding-couple-sailing-boat_7502-4948.jpg?_wi=2",
imageAlt: "waterman on boat lewes delaware",
},
{
title: "Wholesale Seafood",
description: "High-quality seafood solutions for local businesses.",
buttonIcon: "Truck",
imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-salmon-fish-brown-wooden-cutting-board-with-green-pepper-fir-branches-cutlery-set-fallen-oil-bottle-tomato-salt-pepper-dark-table_140725-143816.jpg",
imageAlt: "steaming hot crabs trailer",
},
{
title: "Fresh Steaming",
description: "We steam your crabs on-site so they're ready to eat.",
buttonIcon: "Flame",
imageSrc: "http://img.b2bpic.net/free-photo/woman-supermarket-beautiful-young-woman-holding-salmon-fish-her-hands-concept-healthy-eating-seafood_169016-4496.jpg?_wi=1",
imageAlt: "happy customer seafood market",
},
]}
title="What We Do"
description="From local pickups to event wholesale, we bring the best seafood straight to you. Don't feel like cooking? Use our mobile steam trailer!"
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={false}
title="What We Do"
description="From local pickups to event wholesale, we bring the best seafood straight to you. Don't feel like cooking? Use our mobile steam trailer!"
features={[
{ title: "Local Pickup", description: "Order online and pick up at our Lewes, DE location.", buttonIcon: ShoppingBasket, imageSrc: "http://img.b2bpic.net/free-photo/single-crab-animal-with-copy-space_1194-638740.jpg" },
{ title: "Event Booking", description: "Book our steam trailer for your next special event.", buttonIcon: CalendarDays, imageSrc: "http://img.b2bpic.net/free-photo/young-wedding-couple-sailing-boat_7502-4948.jpg" },
{ title: "Wholesale Seafood", description: "High-quality seafood solutions for local businesses.", buttonIcon: Truck, imageSrc: "http://img.b2bpic.net/free-photo/vertical-view-salmon-fish-brown-wooden-cutting-board-with-green-pepper-fir-branches-cutlery-set-fallen-oil-bottle-tomato-salt-pepper-dark-table_140725-143816.jpg" },
{ title: "Fresh Steaming", description: "We steam your crabs on-site so they're ready to eat.", buttonIcon: Flame, imageSrc: "http://img.b2bpic.net/free-photo/woman-supermarket-beautiful-young-woman-holding-salmon-fish-her-hands-concept-healthy-eating-seafood_169016-4496.jpg" },
]}
/>
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Faith Hauger",
handle: "@faith",
testimonial: "Friendly, knowledgeable and helpful staff. Great prices and convenient location.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-supermarket-beautiful-young-woman-holding-salmon-fish-her-hands-concept-healthy-eating-seafood_169016-4496.jpg?_wi=2",
},
{
id: "2",
name: "Jill Greenleigh",
handle: "@jill",
testimonial: "The best place in the area to get your crabs! They were large and heavy!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-food_23-2149536952.jpg",
},
{
id: "3",
name: "Local Patron",
handle: "@crablover",
testimonial: "Excellent service and always fresh. Highly recommended!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-basket-purple-figs-white-with-blue-tablecloth_114579-29538.jpg",
},
{
id: "4",
name: "Family Gatherer",
handle: "@bbq",
testimonial: "Crab Connect is amazing. The staff is so helpful.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/tom-yum-mixed-seafood-thick-soup-hot-pot-spicy-thai-food_1150-26553.jpg",
},
{
id: "5",
name: "Happy Camper",
handle: "@lewedes",
testimonial: "We love the convenience of the local pickup location.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-basket-with-chips-light-blue-surface_140725-69485.jpg",
},
]}
showRating={true}
title="Customer Reviews"
description="See why our customers keep coming back for more."
/>
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardThirteen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
showRating={true}
title="Customer Reviews"
description="See why our customers keep coming back for more."
testimonials={[
{ id: "1", name: "Faith Hauger", handle: "@faith", testimonial: "Friendly, knowledgeable and helpful staff. Great prices and convenient location.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-supermarket-beautiful-young-woman-holding-salmon-fish-her-hands-concept-healthy-eating-seafood_169016-4496.jpg" },
{ id: "2", name: "Jill Greenleigh", handle: "@jill", testimonial: "The best place in the area to get your crabs! They were large and heavy!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-food_23-2149536952.jpg" },
{ id: "3", name: "Local Patron", handle: "@crablover", testimonial: "Excellent service and always fresh. Highly recommended!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/hands-holding-basket-purple-figs-white-with-blue-tablecloth_114579-29538.jpg" },
{ id: "4", name: "Family Gatherer", handle: "@bbq", testimonial: "Crab Connect is amazing. The staff is so helpful.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/tom-yum-mixed-seafood-thick-soup-hot-pot-spicy-thai-food_1150-26553.jpg" },
{ id: "5", name: "Happy Camper", handle: "@lewedes", testimonial: "We love the convenience of the local pickup location.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-holding-basket-with-chips-light-blue-surface_140725-69485.jpg" },
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "plain",
}}
tag="Get in Touch"
title="Location & Contact"
description="Questions? Visit us at 17580 Coastal Highway, Lewes, DE 19958. Give us a call at (302)-396-4041."
inputPlaceholder="Enter your email for updates"
buttonText="Subscribe"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{ variant: "plain" }}
tag="Get in Touch"
title="Location & Contact"
description="Questions? Visit us at 17580 Coastal Highway, Lewes, DE 19958. Give us a call at (302)-396-4041."
inputPlaceholder="Enter your email for updates"
buttonText="Subscribe"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Home",
href: "#hero",
},
{
label: "About",
href: "#about",
},
{
label: "Reviews",
href: "#reviews",
},
],
},
{
items: [
{
label: "Facebook",
href: "https://facebook.com",
},
{
label: "Contact",
href: "#contact",
},
],
},
]}
logoText="The Crab Connect"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="The Crab Connect"
columns={[
{ items: [{ label: "Home", href: "#hero" }, { label: "About", href: "#about" }, { label: "Reviews", href: "#reviews" }] },
{ items: [{ label: "Facebook", href: "https://facebook.com" }, { label: "Contact", href: "#contact" }] },
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}