Merge version_2 into main #1
296
src/app/page.tsx
296
src/app/page.tsx
@@ -19,34 +19,22 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
contentWidth="compact"
|
||||
sizing="mediumLarge"
|
||||
background="grid"
|
||||
cardStyle="gradient-bordered"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="extrabold"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="none"
|
||||
cardStyle="outline"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Our Story",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Find an OB",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Menu", id: "products" },
|
||||
{ name: "Our Story", id: "about" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Ocean Basket"
|
||||
/>
|
||||
@@ -54,48 +42,17 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Welcome to Ocean Basket"
|
||||
description="Giving you the best of the Mediterranean lifestyle with generous portions of quality seafood for you and your family."
|
||||
buttons={[
|
||||
{
|
||||
text: "Find an OB",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
background={{ variant: "plain" }}
|
||||
title="Ocean Basket"
|
||||
description="Mediterranean-inspired seafood with a passion for freshness and family sharing."
|
||||
buttons={[{ text: "Explore Menu", href: "#products" }]}
|
||||
carouselItems={[
|
||||
{
|
||||
id: "1",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/homemade-noodle-with-beans-bowl-blue-background_114579-39736.jpg",
|
||||
imageAlt: "Fresh seafood",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-trash-cooking-concept_23-2149056449.jpg",
|
||||
imageAlt: "Grilled prawns",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-fish-with-lemon-plate_23-2148643620.jpg",
|
||||
imageAlt: "Mediterranean family platter",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-raw-salmon-steak-with-pepper-ingredients_23-2148440903.jpg",
|
||||
imageAlt: "Dining ambiance",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fried-beef-wooden-board_140725-741.jpg",
|
||||
imageAlt: "Calamari platter",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-arrangement-with-delicious-shrimps_23-2148308050.jpg",
|
||||
imageAlt: "Fish fillet meal",
|
||||
},
|
||||
{ id: "1", imageSrc: "https://img.b2bpic.net/free-photo/grilled-salmon-fish-plate_1398-4549.jpg", imageAlt: "Grilled Salmon" },
|
||||
{ id: "2", imageSrc: "https://img.b2bpic.net/free-photo/calamari-ring_74190-4730.jpg", imageAlt: "Calamari" },
|
||||
{ id: "3", imageSrc: "https://img.b2bpic.net/free-photo/top-view-fish-with-lemon-plate_23-2148643620.jpg", imageAlt: "Fish Plate" },
|
||||
{ id: "4", imageSrc: "https://img.b2bpic.net/free-photo/side-view-grilled-shrimp-with-ketchup-carrots-plate_141793-12497.jpg", imageAlt: "Prawns" },
|
||||
{ id: "5", imageSrc: "https://img.b2bpic.net/free-photo/stir-fried-spaghetti-seafood_1339-3426.jpg", imageAlt: "Seafood Pasta" },
|
||||
{ id: "6", imageSrc: "https://img.b2bpic.net/free-photo/flat-lay-plate-cooked-mussels-with-copy-space_23-2148234977.jpg", imageAlt: "Mussels" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -103,13 +60,7 @@ export default function LandingPage() {
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Our Mediterranean Heart"
|
||||
buttons={[
|
||||
{
|
||||
text: "Read Our Story",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
title="Mediterranean Roots"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -117,44 +68,14 @@ export default function LandingPage() {
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Fresh Quality",
|
||||
author: "Ocean Basket",
|
||||
description: "Sourced daily to ensure peak freshness for our guests.",
|
||||
tags: [
|
||||
"Fresh",
|
||||
"Quality",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-fresh-sliced-fish-with-seasonings-onion-rings-fresh-tomatoes-dark-background_140725-133001.jpg",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Generous Portions",
|
||||
author: "Ocean Basket",
|
||||
description: "Hearty meals meant for sharing with friends and family.",
|
||||
tags: [
|
||||
"Generous",
|
||||
"Family",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/middle-age-friends-having-fun-food-festival_23-2149490828.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Mediterranean Style",
|
||||
author: "Ocean Basket",
|
||||
description: "Celebrating the joy of the sea in a vibrant, welcoming atmosphere.",
|
||||
tags: [
|
||||
"Vibrant",
|
||||
"Med",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/traditional-delicious-gulas-dish-composition_23-2149072551.jpg",
|
||||
},
|
||||
{ id: "f1", title: "Freshness", author: "Quality", description: "Wild-caught or sustainably sourced.", tags: ["Sustainable"], imageSrc: "https://img.b2bpic.net/free-photo/top-view-fresh-sliced-fish-with-seasonings-onion-rings-fresh-tomatoes-dark-background_140725-133001.jpg" },
|
||||
{ id: "f2", title: "Sharing", author: "Family", description: "Generous portions made for tables full of friends.", tags: ["Family"], imageSrc: "https://img.b2bpic.net/free-photo/middle-age-friends-having-fun-food-festival_23-2149490828.jpg" },
|
||||
{ id: "f3", title: "Authentic", author: "Values", description: "Simple recipes, big flavors.", tags: ["Authentic"], imageSrc: "https://img.b2bpic.net/free-photo/traditional-delicious-gulas-dish-composition_23-2149072551.jpg" }
|
||||
]}
|
||||
title="Why Ocean Basket?"
|
||||
description="Experience quality and warmth in every bite."
|
||||
title="Our Promise"
|
||||
description="We believe in quality seafood prepared with love."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -165,183 +86,56 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Kingklip Platter",
|
||||
price: "R180",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fried-dushbara-onion-rings-with-shrimps_140725-1135.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Prawn Feast",
|
||||
price: "R220",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-grilled-shrimp-with-ketchup-carrots-plate_141793-12497.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Crispy Calamari",
|
||||
price: "R120",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/calamari-ring_74190-4730.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Classic Fish & Chips",
|
||||
price: "R95",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/grilled-salmon-fish-plate_1398-4549.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Seafood Pasta",
|
||||
price: "R160",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stir-fried-spaghetti-seafood_1339-3426.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Mussel Pot",
|
||||
price: "R140",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-plate-cooked-mussels-with-copy-space_23-2148234977.jpg",
|
||||
},
|
||||
{ id: "p1", name: "Kingklip Platter", price: "R195", imageSrc: "https://img.b2bpic.net/free-photo/fried-dushbara-onion-rings-with-shrimps_140725-1135.jpg" },
|
||||
{ id: "p2", name: "Prawn Platter", price: "R245", imageSrc: "https://img.b2bpic.net/free-photo/side-view-grilled-shrimp-with-ketchup-carrots-plate_141793-12497.jpg" }
|
||||
]}
|
||||
title="Our Seafood Menu"
|
||||
description="Discover our signature Mediterranean-inspired dishes."
|
||||
title="Our Menu"
|
||||
description="Explore our signature seafood dishes."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Where can I find an OB?",
|
||||
content: "Visit our 'Find an OB' section to locate your nearest restaurant.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Are there vegetarian options?",
|
||||
content: "Yes, we offer a variety of fresh Mediterranean sides and vegetarian-friendly dishes.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Can I book a table?",
|
||||
content: "Yes, we recommend contacting your local restaurant directly to book a table.",
|
||||
},
|
||||
{ id: "q1", title: "Are you sustainable?", content: "Yes, we pride ourselves on responsible sourcing." },
|
||||
{ id: "q2", title: "Do you have kids meals?", content: "Yes, we cater for the whole family." }
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Answers to your questions about our restaurant."
|
||||
description="We're here to help."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFifteen
|
||||
useInvertedBackground={false}
|
||||
testimonial="The Mediterranean lifestyle shines through in every meal. Absolutely delicious seafood experience for the whole family!"
|
||||
useInvertedBackground={true}
|
||||
testimonial="The freshest seafood experience in the city. Perfectly seasoned and generous."
|
||||
rating={5}
|
||||
author="Sarah Johnson"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/office-workers-working-together-as-team_23-2149310903.jpg",
|
||||
alt: "Customer",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/three-stylish-young-people-having-fun-lunch-cafe-talking-each-other-laughing-jokes_273609-9011.jpg",
|
||||
alt: "Customer",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/delicious-dish-restaurant_23-2148018840.jpg",
|
||||
alt: "Customer",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/unrecognizable-cook-flipping-shrimps-frying-big-pan_23-2148253408.jpg",
|
||||
alt: "Customer",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-smiley-people-with-food_23-2149152879.jpg",
|
||||
alt: "Customer",
|
||||
},
|
||||
]}
|
||||
author="The Miller Family"
|
||||
avatars={[]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"Facebook",
|
||||
"Instagram",
|
||||
"TikTok",
|
||||
"LinkedIn",
|
||||
"Twitter",
|
||||
]}
|
||||
title="Stay in the loop"
|
||||
description="Follow us on social media for news and promos."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Contact"
|
||||
title="Find Your Ocean Basket"
|
||||
description="Locate a restaurant near you."
|
||||
background={{ variant: "plain" }}
|
||||
title="Visit Us"
|
||||
description="Find your local Ocean Basket restaurant today."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Ocean Basket"
|
||||
columns={[
|
||||
{
|
||||
title: "Navigate",
|
||||
items: [
|
||||
{
|
||||
label: "Home",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Menu",
|
||||
href: "#products",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "About",
|
||||
items: [
|
||||
{
|
||||
label: "Our Story",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Promotions",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Find an OB",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
columns={[{ title: "Explore", items: [{ label: "Menu", href: "#products" }] }]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user