268 lines
13 KiB
TypeScript
268 lines
13 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FaqBase from '@/components/sections/faq/FaqBase';
|
|
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
|
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
import { Star, TreePine, Waves } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-shift"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="smallMedium"
|
|
sizing="large"
|
|
background="circleGradient"
|
|
cardStyle="glass-depth"
|
|
primaryButtonStyle="radial-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="medium"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "About", id: "about"},
|
|
{
|
|
name: "Activities", id: "features"},
|
|
{
|
|
name: "FAQ", id: "faq"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="San Diego Guide"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboard
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
title="Experience the Best of San Diego"
|
|
description="Golden beaches, vibrant culture, and endless sunshine await. Discover why San Diego is California's premier travel destination."
|
|
imageSrc="http://img.b2bpic.net/free-photo/la-jolla-cove-view-san-diego-usa_1268-14454.jpg"
|
|
imageAlt="Sunny day in San Diego"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/front-view-smiley-woman-wearing-hat_23-2148631369.jpg", alt: "Portrait of a traveler"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/photo-surprised-cheerful-european-woman-keeps-hand-hat-drinks-takeaway-coffee-walks-city-street_273609-25763.jpg", alt: "Portrait of a traveler"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/smiley-woman-with-glasses-waving_23-2148631360.jpg", alt: "Portrait of a traveler"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/handsome-caucasian-man-wearing-summer-hat-flowers-shirt-smiling-happy-outdoors_839833-8950.jpg", alt: "Portrait of a traveler"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/happy-hipster-man-with-beard-retro-photo-camera_273443-2284.jpg", alt: "Portrait of a traveler"},
|
|
]}
|
|
avatarText="Join 10,000+ travelers monthly"
|
|
marqueeItems={[
|
|
{
|
|
type: "text", text: "Sun-Drenched Beaches"},
|
|
{
|
|
type: "text", text: "World-Class Dining"},
|
|
{
|
|
type: "text", text: "Historic Balboa Park"},
|
|
{
|
|
type: "text", text: "Surf Paradise"},
|
|
{
|
|
type: "text", text: "Family Adventure"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MetricSplitMediaAbout
|
|
useInvertedBackground={false}
|
|
title="California's Finest City"
|
|
description="With year-round temperate weather and a rich history, San Diego offers a perfect mix of relaxation and excitement. Explore historic parks, pristine shorelines, and world-class attractions."
|
|
metrics={[
|
|
{
|
|
value: "70 miles", title: "Coastline"},
|
|
{
|
|
value: "300+", title: "Sunny Days/Year"},
|
|
{
|
|
value: "17", title: "Museums"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/beautiful-coconut-palm-tree-blue-sky_74190-1025.jpg"
|
|
imageAlt="San Diego city view"
|
|
mediaAnimation="slide-up"
|
|
metricsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyFive
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "World-Class Attractions", description: "The San Diego Zoo, Safari Park, and Balboa Park offer endless family fun.", icon: Star,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-women-with-dyed-hair-near-seaside_23-2149488637.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-ring-tailed-lemur-wooden-post_23-2147924052.jpg"},
|
|
]
|
|
},
|
|
{
|
|
title: "Surf & Sand", description: "Beautiful beaches perfect for surfing, swimming, and watching the sunset.", icon: Waves,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/girl-posing-with-board-sunset_1321-1353.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-walks-with-surfboard-wild-beach-amazing-view-from-top_72229-1193.jpg"},
|
|
]
|
|
},
|
|
{
|
|
title: "Lush Landscapes", description: "Discover incredible botanical gardens and hiking trails through scenic canyons.", icon: TreePine,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/famous-botanical-garden-funchal-madeira-island-portugal_231208-6666.jpg"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/life-mexico-landscape-with-tall-building_23-2149862545.jpg"},
|
|
]
|
|
},
|
|
]}
|
|
title="Why Visitors Love It"
|
|
description="From families to adventure seekers, San Diego has something for everyone."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "1", name: "Surf Lessons", price: "$80", variant: "Active", imageSrc: "http://img.b2bpic.net/free-photo/surfer-blue-wave_72229-1309.jpg"},
|
|
{
|
|
id: "2", name: "Taco Tour", price: "$50", variant: "Culinary", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-lesbian-couple-restaurant_23-2150276444.jpg"},
|
|
{
|
|
id: "3", name: "Coastal Hike", price: "Free", variant: "Adventure", imageSrc: "http://img.b2bpic.net/free-photo/man-trekking-mountains_23-2148106716.jpg"},
|
|
{
|
|
id: "4", name: "Bay Yacht Cruise", price: "$120", variant: "Luxury", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-ballerina-dancing-posing-outside_176420-1435.jpg"},
|
|
{
|
|
id: "5", name: "Museum Pass", price: "$45", variant: "Cultural", imageSrc: "http://img.b2bpic.net/free-photo/female-painter-takes-notes-teaches-art-painting-atelier_482257-124839.jpg"},
|
|
{
|
|
id: "6", name: "Beach Sunset", price: "Free", variant: "Relaxation", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-beach-with-camera_23-2149046410.jpg"},
|
|
]}
|
|
title="Must-Do Experiences"
|
|
description="Make the most of your vacation with these highly-rated experiences."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqBase
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "When is the best time to visit?", content: "San Diego is great year-round, but spring and fall offer the best weather."},
|
|
{
|
|
id: "2", title: "Do I need a car?", content: "While you can get around, a rental car is recommended for exploring San Diego's various coastal spots."},
|
|
{
|
|
id: "3", title: "Are beaches free?", content: "Yes, all beaches in San Diego are public and free to access!"},
|
|
]}
|
|
title="Visitor FAQ"
|
|
description="Have questions about your trip? Here are the most common ones."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardFifteen
|
|
useInvertedBackground={false}
|
|
testimonial="Our family vacation to San Diego was the best we've had! The zoo was incredible and the beaches are just beautiful."
|
|
rating={5}
|
|
author="Sarah J."
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/outdoor-portrait-fashionable-attractive-dark-skinned-man-with-afro-hairstyle-wearing-headphones-neck-talking-smartphone-drinking-coffee-while-strolling-city-with-backpack_176420-19828.jpg", alt: "Sarah J."},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/smiling-young-caucasian-traveler-man-with-straw-beach-hat-sun-glasses-holding-swim-ring-pointing-back-isolated-pink-wall-with-copy-space_141793-106499.jpg", alt: "Mike D."},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/happy-stylish-caucasian-man-with-backpack-travel-rice-plantation-making-self-portrai-memories_273443-3007.jpg", alt: "Jen B."},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/medium-shot-women-traveling-together_23-2149137183.jpg", alt: "The Smiths"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/front-view-young-male-with-bag-binoculars-pink-background_140725-122314.jpg", alt: "Alex T."},
|
|
]}
|
|
ratingAnimation="slide-up"
|
|
avatarsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="blog" data-section="blog">
|
|
<BlogCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
title="Travel Insights"
|
|
description="Check out our latest tips for your next trip to California."
|
|
blogs={[
|
|
{
|
|
id: "1", category: "Road Trip", title: "Coastal Drive Ideas", excerpt: "How to make the most of your Pacific coastal drive.", imageSrc: "http://img.b2bpic.net/free-photo/young-man-near-woman-s-legs-leaning-out-from-car_23-2148039069.jpg", authorName: "Jane Doe", authorAvatar: "http://img.b2bpic.net/free-photo/slim-beautiful-woman-white-cotton-dress-walking-tropical-beach-sunset-holding-leather-backpack_285396-3621.jpg", date: "Oct 1, 2023"},
|
|
{
|
|
id: "2", category: "Local", title: "Hidden Beaches", excerpt: "San Diego's best-kept secret spots along the shoreline.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-natural-rock-arches-near-sand-beach-sunny-day_181624-13307.jpg", authorName: "John Smith", authorAvatar: "http://img.b2bpic.net/free-photo/front-view-woman-smiling-waving_23-2148631402.jpg", date: "Oct 5, 2023"},
|
|
{
|
|
id: "3", category: "Dining", title: "City Food Scene", excerpt: "Where to find the best tacos in town.", imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-holding-pizza-slice_23-2149333834.jpg", authorName: "Chef Dave", authorAvatar: "http://img.b2bpic.net/free-photo/medium-shot-couple-holding-hands_23-2148970146.jpg", date: "Oct 10, 2023"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCenter
|
|
useInvertedBackground={false}
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
tag="Stay Informed"
|
|
title="Ready to Visit?"
|
|
description="Sign up to receive travel tips, seasonal discounts, and local recommendations directly to your inbox."
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterSimple
|
|
columns={[
|
|
{
|
|
title: "Destinations", items: [
|
|
{
|
|
label: "Beaches", href: "#features"},
|
|
{
|
|
label: "Attractions", href: "#features"},
|
|
],
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{
|
|
label: "FAQ", href: "#faq"},
|
|
{
|
|
label: "Contact", href: "#contact"},
|
|
],
|
|
},
|
|
]}
|
|
bottomLeftText="© 2024 San Diego Tourism Guide"
|
|
bottomRightText="All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |