222 lines
14 KiB
TypeScript
222 lines
14 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
|
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
|
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
|
import { Waves, ChefHat } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="sharp"
|
|
contentWidth="smallMedium"
|
|
sizing="largeSmallSizeMediumTitles"
|
|
background="plain"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="diagonal-gradient"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="The Salty Shore"
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "About", id: "about" },
|
|
{ name: "Menu", id: "menu" },
|
|
{ name: "Ambiance", id: "ambiance" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{
|
|
text: "Reserve Table", href: "#contact"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardGallery
|
|
title="Experience Coastal Luxury"
|
|
description="San Diego's premier beach club. Fresh seafood, craft cocktails, and unforgettable sunsets overlooking the Pacific."
|
|
tag="The Salty Shore"
|
|
tagIcon={Waves}
|
|
buttons={[
|
|
{ text: "Reserve Now", href: "#contact" },
|
|
{ text: "View Menu", href: "#menu" }
|
|
]}
|
|
mediaItems={[
|
|
{ imageSrc: "https://img.b2bpic.net/free-photo/beach-restaurant-evening_661209-253.jpg", imageAlt: "Beachfront dining at sunset" },
|
|
{ imageSrc: "https://img.b2bpic.net/free-photo/couple-summer-having-relaxing-picnic-day-together_23-2151426042.jpg", imageAlt: "Tropical cocktail by the ocean" },
|
|
{ imageSrc: "https://img.b2bpic.net/free-photo/photorealistic-wedding-venue-with-intricate-decor-ornaments_23-2151481508.jpg", imageAlt: "Fresh grilled seafood plate" },
|
|
{ imageSrc: "https://img.b2bpic.net/free-photo/couple-enjoying-picnic-together-outdoors-summertime_23-2151426043.jpg", imageAlt: "Outdoor patio seating with ocean view" },
|
|
{ imageSrc: "https://img.b2bpic.net/free-photo/side-view-friends-holding-sangria-drinks_23-2149426392.jpg", imageAlt: "Golden hour beach club ambiance" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MediaSplitTabsAbout
|
|
title="Welcome to The Salty Shore"
|
|
description="Discover a culinary haven where fresh ocean flavors meet exceptional hospitality"
|
|
tabs={[
|
|
{
|
|
id: "heritage", label: "Our Heritage", description: "Established in 2015, The Salty Shore has become San Diego's most beloved beach club destination. We combine coastal elegance with authentic hospitality, sourcing the finest local ingredients for our ever-evolving menu."
|
|
},
|
|
{
|
|
id: "philosophy", label: "Our Philosophy", description: "We believe dining should be an experience that engages all your senses. From the ocean breeze on our terrace to the perfectly crafted cocktail in your hand, every moment is curated for your enjoyment and relaxation."
|
|
},
|
|
{
|
|
id: "sustainability", label: "Sustainability", description: "We're committed to protecting our beautiful coastal environment. Our seafood is responsibly sourced, and we partner with local fishermen and farmers who share our values for ocean conservation."
|
|
}
|
|
]}
|
|
imageSrc="https://img.b2bpic.net/free-photo/silhouette-people-enjoying-their-time-sunset-cafe-potamos-beach-greece_181624-27427.jpg"
|
|
imageAlt="The Salty Shore restaurant interior with ocean views"
|
|
imagePosition="right"
|
|
useInvertedBackground="noInvert"
|
|
/>
|
|
</div>
|
|
|
|
<div id="menu" data-section="menu">
|
|
<ProductCardThree
|
|
title="Menu Highlights"
|
|
description="Explore our signature dishes crafted with the freshest seasonal ingredients"
|
|
tag="Culinary Excellence"
|
|
tagIcon={ChefHat}
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
animationType="slide-up"
|
|
gridVariant="three-columns-all-equal-width"
|
|
products={[
|
|
{
|
|
id: "1", name: "Pan-Seared Branzino", price: "$48", imageSrc: "https://img.b2bpic.net/free-photo/grilled-salmon-with-vegetables-lemon_141793-761.jpg", imageAlt: "Pan-seared branzino with seasonal vegetables"
|
|
},
|
|
{
|
|
id: "2", name: "Grilled Shrimp Skewers", price: "$32", imageSrc: "https://img.b2bpic.net/free-photo/fried-fish-with-tomatoes-sauce_140725-6177.jpg", imageAlt: "Herb-marinated grilled shrimp with lemon"
|
|
},
|
|
{
|
|
id: "3", name: "Prime Ribeye Steak", price: "$56", imageSrc: "https://img.b2bpic.net/free-photo/seafood-plate-with-fried-salmon-mussels-shrimps-calamari-lemon_140725-1613.jpg", imageAlt: "Prime ribeye steak with garlic butter"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="ambiance" data-section="ambiance">
|
|
<FeatureCardNineteen
|
|
title="Why Guests Love Us"
|
|
description="Every element of The Salty Shore is designed to elevate your coastal dining experience"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
features={[
|
|
{
|
|
id: 1,
|
|
tag: "Environment", title: "Oceanfront Views", subtitle: "Unobstructed vistas of the Pacific", description: "Dine with panoramic ocean views and natural sea breezes. Our terrace captures golden hour sunsets that inspire romance and memorable celebrations.", imageSrc: "https://img.b2bpic.net/free-photo/glass-beer-with-beautiful-tropical-maldives-island_1232-4472.jpg", imageAlt: "Oceanfront terrace with sunset view"
|
|
},
|
|
{
|
|
id: 2,
|
|
tag: "Service", title: "Impeccable Hospitality", subtitle: "Attentive, professional staff", description: "Our experienced team anticipates your needs with warmth and expertise. From wine pairings to dietary accommodations, we ensure your visit is perfectly tailored.", imageSrc: "https://img.b2bpic.net/free-photo/wooden-table-ready-lunch_1203-1650.jpg", imageAlt: "Professional waiter serving guests"
|
|
},
|
|
{
|
|
id: 3,
|
|
tag: "Beverages", title: "Craft Cocktails", subtitle: "Signature drinks by expert mixologists", description: "Our bar features fresh-squeezed juices, premium spirits, and house-made syrups. Each cocktail tells a story of coastal inspiration.", imageSrc: "https://img.b2bpic.net/free-photo/side-view-couple-with-pina-colada_23-2150184005.jpg", imageAlt: "Beautifully crafted tropical cocktails"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardFive
|
|
title="Guest Experiences"
|
|
description="Hear from our loyal guests about their unforgettable moments at The Salty Shore"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Michelle Rodriguez, Local Influencer", date: "Date: 15 January 2025", title: "My favorite spot in San Diego!", quote: "The Salty Shore has become my go-to for special occasions. The fresh seafood is incredible, and the sunset views are absolutely unmatched. The team makes you feel like family.", tag: "Regular Guest", avatarSrc: "https://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", avatarAlt: "Michelle Rodriguez"
|
|
},
|
|
{
|
|
id: "2", name: "James Chen, Business Executive", date: "Date: 10 January 2025", title: "Perfect for business dinners", quote: "I've hosted countless client dinners here and never once disappointed. The ambiance, food quality, and service elevate every meeting. It's where important deals happen.", tag: "Corporate Client", avatarSrc: "https://img.b2bpic.net/free-photo/blonde-businesswoman-portrait-with-copy-space_1194-633470.jpg", avatarAlt: "James Chen"
|
|
},
|
|
{
|
|
id: "3", name: "Sarah Williams, Event Planner", date: "Date: 5 January 2025", title: "Best venue for celebrations", quote: "We chose The Salty Shore for our wedding reception and it was magical. The oceanfront setting, exceptional cuisine, and attentive staff made our day truly unforgettable.", tag: "Wedding Host", avatarSrc: "https://img.b2bpic.net/free-photo/serious-beautiful-middle-aged-business-woman_1262-3072.jpg", avatarAlt: "Sarah Williams"
|
|
},
|
|
{
|
|
id: "4", name: "David Martinez, Restaurant Critic", date: "Date: 28 December 2024", title: "A gem on the San Diego coast", quote: "The Salty Shore represents everything great about coastal California dining. Fresh ingredients, creative preparations, and genuine hospitality. This is where to experience San Diego.", tag: "Food Critic", avatarSrc: "https://img.b2bpic.net/free-photo/portrait-beautiful-woman-home_23-2149122066.jpg", avatarAlt: "David Martinez"
|
|
},
|
|
{
|
|
id: "5", name: "Lisa Thompson, Travel Blogger", date: "Date: 20 December 2024", title: "A must-visit for beach lovers", quote: "Finally found a restaurant that lives up to the San Diego coast hype. The views are breathtaking, the cocktails are next-level, and every bite of food is pure joy.", tag: "Travel Enthusiast", avatarSrc: "https://img.b2bpic.net/free-photo/studio-portrait-beautiful-young-woman-posing_1301-3611.jpg", avatarAlt: "Lisa Thompson"
|
|
},
|
|
{
|
|
id: "6", name: "Robert Anderson, Local Chef", date: "Date: 12 December 2024", title: "Chef's respect for this establishment", quote: "As someone in the culinary world, I deeply appreciate what The Salty Shore is doing. The sourcing is impeccable, the techniques are refined, and the passion is evident in every plate.", tag: "Professional Chef", avatarSrc: "https://img.b2bpic.net/free-photo/portrait-woman-therapist_23-2148759115.jpg", avatarAlt: "Robert Anderson"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
title="Make Your Reservation"
|
|
description="Plan your next dining experience at The Salty Shore. Our team will ensure your visit is absolutely memorable."
|
|
useInvertedBackground="noInvert"
|
|
inputs={[
|
|
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
|
{ name: "email", type: "email", placeholder: "Email Address", required: true },
|
|
{ name: "phone", type: "tel", placeholder: "Phone Number", required: true },
|
|
{ name: "date", type: "date", placeholder: "Preferred Date", required: true }
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder: "Special requests or occasions...", rows: 4,
|
|
required: false
|
|
}}
|
|
buttonText="Reserve Table"
|
|
imageSrc="https://img.b2bpic.net/free-photo/luxury-vacations-tropical-resort-lanterns-illuminate-table-generated-by-ai_188544-39221.jpg"
|
|
imageAlt="Scenic San Diego beach sunset"
|
|
mediaPosition="right"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseCard
|
|
logoText="The Salty Shore"
|
|
columns={[
|
|
{
|
|
title: "Location", items: [
|
|
{ label: "Pacific Beach, San Diego", href: "https://maps.google.com" },
|
|
{ label: "(619) 555-0123", href: "tel:6195550123" },
|
|
{ label: "info@thesaltyshore.com", href: "mailto:info@thesaltyshore.com" }
|
|
]
|
|
},
|
|
{
|
|
title: "Hours", items: [
|
|
{ label: "Mon-Thu: 5:00 PM - 11:00 PM", href: "#" },
|
|
{ label: "Fri-Sat: 5:00 PM - Midnight", href: "#" },
|
|
{ label: "Sun: 4:00 PM - 10:00 PM", href: "#" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Us", href: "#about" },
|
|
{ label: "Menu", href: "#menu" },
|
|
{ label: "Reservations", href: "#contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Follow", items: [
|
|
{ label: "Instagram", href: "https://instagram.com" },
|
|
{ label: "Facebook", href: "https://facebook.com" },
|
|
{ label: "TikTok", href: "https://tiktok.com" }
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2025 The Salty Shore. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |