557 lines
20 KiB
TypeScript
557 lines
20 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import ReactLenis from "lenis/react";
|
||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||
import { Coffee, Star } from "lucide-react";
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="text-shift"
|
||
defaultTextAnimation="background-highlight"
|
||
borderRadius="soft"
|
||
contentWidth="medium"
|
||
sizing="largeSizeMediumTitles"
|
||
background="grid"
|
||
cardStyle="layered-gradient"
|
||
primaryButtonStyle="gradient"
|
||
secondaryButtonStyle="glass"
|
||
headingFontWeight="extrabold"
|
||
>
|
||
<ReactLenis root>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarStyleCentered
|
||
navItems={[
|
||
{
|
||
name: "Home",
|
||
id: "#home",
|
||
},
|
||
{
|
||
name: "Menu",
|
||
id: "#menu",
|
||
},
|
||
{
|
||
name: "About Us",
|
||
id: "#about",
|
||
},
|
||
{
|
||
name: "Reviews",
|
||
id: "#testimonials",
|
||
},
|
||
{
|
||
name: "Contact",
|
||
id: "#contact",
|
||
},
|
||
]}
|
||
button={{
|
||
text: "Order Now",
|
||
href: "#menu",
|
||
}}
|
||
logoSrc="http://img.b2bpic.net/free-vector/hand-drawn-kawaii-business-card-template_23-2148220152.jpg"
|
||
logoAlt="Cafetería Natsuko Logo"
|
||
brandName="Cafetería Natsuko"
|
||
/>
|
||
</div>
|
||
|
||
<div id="home" data-section="home">
|
||
<HeroSplitKpi
|
||
background={{
|
||
variant: "radial-gradient",
|
||
}}
|
||
title="Authentic Asian Fusion, Freshly Made Daily"
|
||
description="Award-rated ramen, sushi, and pastries in a beautifully designed space. Order online for delivery, takeout, or dine-in—open daily from 9 am."
|
||
kpis={[
|
||
{
|
||
value: "4.7★",
|
||
label: "Star Rating",
|
||
},
|
||
{
|
||
value: "5+",
|
||
label: "Years Serving",
|
||
},
|
||
{
|
||
value: "10K+",
|
||
label: "Happy Customers",
|
||
},
|
||
]}
|
||
enableKpiAnimation={false}
|
||
buttons={[
|
||
{
|
||
text: "Order Now",
|
||
href: "#menu",
|
||
},
|
||
{
|
||
text: "View Menu",
|
||
href: "#menu",
|
||
},
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/close-up-meat-with-baked-potatoes-eggplant-tomato-pepper-decorated-with-pomegranate-plate-served-table_176474-2442.jpg?_wi=1"
|
||
imageAlt="Delicious Asian Fusion dish at Cafetería Natsuko"
|
||
mediaAnimation="opacity"
|
||
avatars={[
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/beautiful-woman-smiling_93675-133804.jpg",
|
||
alt: "Happy customer avatar",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/front-view-cute-girl-looking-away_23-2148436134.jpg",
|
||
alt: "Satisfied customer avatar",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/woman-smiling_1187-3196.jpg",
|
||
alt: "Smiling customer avatar",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/smiling-young-caucasian-man-looking-camera-clenching-fists-isolated-olive-green-background-with-copy-space_141793-75152.jpg",
|
||
alt: "Pleased customer avatar",
|
||
},
|
||
{
|
||
src: "http://img.b2bpic.net/free-photo/positive-smiling-woman-with-collected-hair-wearing-white-shirt_291650-656.jpg",
|
||
alt: "Content customer avatar",
|
||
},
|
||
]}
|
||
avatarText="Join 10K+ happy customers"
|
||
marqueeItems={[
|
||
{
|
||
type: "text",
|
||
text: "Fresh Sushi",
|
||
},
|
||
{
|
||
type: "text-icon",
|
||
text: "Hot Ramen",
|
||
icon: Star,
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Sweet Pastries",
|
||
},
|
||
{
|
||
type: "text-icon",
|
||
text: "Specialty Coffee",
|
||
icon: Coffee,
|
||
},
|
||
{
|
||
type: "text",
|
||
text: "Daily Specials",
|
||
},
|
||
]}
|
||
/>
|
||
</div>
|
||
|
||
<div id="about" data-section="about">
|
||
<MetricSplitMediaAbout
|
||
useInvertedBackground={true}
|
||
title="Our Story & Passion for Flavor"
|
||
description="At Cafetería Natsuko, we blend traditional Asian flavors with modern culinary techniques to create an unforgettable dining experience. Our commitment to fresh, high-quality ingredients and a warm, inviting atmosphere sets us apart. We believe food is an art form, crafted with love and precision."
|
||
metrics={[
|
||
{
|
||
value: "5+",
|
||
title: "Years of Experience",
|
||
},
|
||
{
|
||
value: "50+",
|
||
title: "Unique Dishes Crafted",
|
||
},
|
||
{
|
||
value: "Daily",
|
||
title: "Fresh Ingredients Sourced",
|
||
},
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/man-white-long-sleeve-shirt-sitting-chair-cafe_250224-25.jpg?_wi=1"
|
||
imageAlt="Interior of Cafetería Natsuko with elegant decor"
|
||
mediaAnimation="opacity"
|
||
metricsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features">
|
||
<FeatureCardNine
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
features={[
|
||
{
|
||
title: "Hearty Ramen Bowls",
|
||
description: "Savor our rich broths, perfectly cooked noodles, and tender toppings. A comforting experience in every spoonful.",
|
||
phoneOne: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/ramen-noodles_74190-5040.jpg",
|
||
imageAlt: "Authentic ramen bowl",
|
||
},
|
||
phoneTwo: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/steaming-bowl-ramen_23-2151950855.jpg",
|
||
imageAlt: "Delicious shoyu ramen",
|
||
},
|
||
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-kawaii-business-card-template_23-2148220152.jpg",
|
||
imageAlt: "authentic ramen bowl side view",
|
||
},
|
||
{
|
||
title: "Exquisite Sushi & Sashimi",
|
||
description: "Hand-rolled with the freshest seafood and vibrant ingredients, our sushi and sashimi platters are a true culinary art.",
|
||
phoneOne: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/sushi-rolls-with-salmon-tuna-roe-black-slate-plate_84443-94446.jpg",
|
||
imageAlt: "Assorted sushi platter",
|
||
},
|
||
phoneTwo: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/sushi-roll_1203-3587.jpg",
|
||
imageAlt: "Dragon roll sushi",
|
||
},
|
||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-meat-with-baked-potatoes-eggplant-tomato-pepper-decorated-with-pomegranate-plate-served-table_176474-2442.jpg?_wi=2",
|
||
imageAlt: "authentic ramen bowl side view",
|
||
},
|
||
{
|
||
title: "Artisanal Pastries & Coffee",
|
||
description: "Indulge in our selection of freshly baked pastries, perfectly paired with our premium coffee and specialty beverages.",
|
||
phoneOne: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-delicious-alfajores-arrangement_23-2148740231.jpg",
|
||
imageAlt: "Assorted Japanese pastries",
|
||
},
|
||
phoneTwo: {
|
||
imageSrc: "http://img.b2bpic.net/free-photo/chopped-biscuit-with-fruit_23-2147693569.jpg",
|
||
imageAlt: "Croissant with coffee",
|
||
},
|
||
imageSrc: "http://img.b2bpic.net/free-photo/man-white-long-sleeve-shirt-sitting-chair-cafe_250224-25.jpg?_wi=2",
|
||
imageAlt: "authentic ramen bowl side view",
|
||
},
|
||
]}
|
||
showStepNumbers={true}
|
||
title="Culinary Delights for Every Palate"
|
||
description="Explore our diverse menu, meticulously prepared to satisfy all your cravings, from savory ramen bowls to exquisite sushi and delightful pastries."
|
||
/>
|
||
</div>
|
||
|
||
<div id="menu" data-section="menu">
|
||
<ProductCardTwo
|
||
animationType="slide-up"
|
||
textboxLayout="default"
|
||
gridVariant="three-columns-all-equal-width"
|
||
useInvertedBackground={true}
|
||
products={[
|
||
{
|
||
id: "ramen-1",
|
||
brand: "Ramen",
|
||
name: "Classic Tonkotsu Ramen",
|
||
price: "$12.500",
|
||
rating: 5,
|
||
reviewCount: "120",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-delicious-asian-food_23-2149091587.jpg",
|
||
imageAlt: "Classic Tonkotsu Ramen",
|
||
},
|
||
{
|
||
id: "sushi-1",
|
||
brand: "Sushi",
|
||
name: "Rainbow Maki Roll",
|
||
price: "$14.000",
|
||
rating: 4,
|
||
reviewCount: "95",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/different-sushi-delivery-varieties-sushi-lunch-dinner_132075-14375.jpg",
|
||
imageAlt: "Rainbow Maki Roll",
|
||
},
|
||
{
|
||
id: "pastry-1",
|
||
brand: "Pastry",
|
||
name: "Matcha Swiss Roll",
|
||
price: "$5.500",
|
||
rating: 5,
|
||
reviewCount: "80",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/green-pandan-roll-cake-ready-eat_1150-34413.jpg",
|
||
imageAlt: "Matcha Swiss Roll",
|
||
},
|
||
{
|
||
id: "beverage-1",
|
||
brand: "Beverage",
|
||
name: "Iced Matcha Latte",
|
||
price: "$4.000",
|
||
rating: 5,
|
||
reviewCount: "110",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/cute-elegant-calm-happy-woman-green-summer-dress-sits-with-coffee-cafe-enjoying-morning_343596-3676.jpg",
|
||
imageAlt: "Iced Matcha Latte",
|
||
},
|
||
{
|
||
id: "ramen-2",
|
||
brand: "Ramen",
|
||
name: "Spicy Tantanmen",
|
||
price: "$13.500",
|
||
rating: 4,
|
||
reviewCount: "75",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/arrangement-noodles-bowl_23-2148803812.jpg",
|
||
imageAlt: "Spicy Tantanmen Ramen",
|
||
},
|
||
{
|
||
id: "sushi-2",
|
||
brand: "Sushi",
|
||
name: "Spicy Salmon Maki",
|
||
price: "$13.000",
|
||
rating: 5,
|
||
reviewCount: "60",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/eel-sushi-roll_74190-211.jpg",
|
||
imageAlt: "Spicy Salmon Maki",
|
||
},
|
||
{
|
||
id: "pastry-2",
|
||
brand: "Pastry",
|
||
name: "Strawberry Mochi",
|
||
price: "$4.500",
|
||
rating: 4,
|
||
reviewCount: "50",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/japanese-food-cooking_23-2149428632.jpg",
|
||
imageAlt: "Strawberry Mochi",
|
||
},
|
||
{
|
||
id: "beverage-2",
|
||
brand: "Beverage",
|
||
name: "Classic Iced Americano",
|
||
price: "$3.500",
|
||
rating: 5,
|
||
reviewCount: "90",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/refreshing-iced-tea-with-lemon-summer-day_23-2151986832.jpg",
|
||
imageAlt: "Classic Iced Americano",
|
||
},
|
||
{
|
||
id: "ramen-3",
|
||
brand: "Ramen",
|
||
name: "Vegetarian Miso Ramen",
|
||
price: "$11.000",
|
||
rating: 4,
|
||
reviewCount: "40",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-shot-asian-meal-with-salmon-seasonings_181624-36900.jpg",
|
||
imageAlt: "Vegetarian Miso Ramen",
|
||
},
|
||
{
|
||
id: "sushi-3",
|
||
brand: "Sushi",
|
||
name: "Nigiri Deluxe Set",
|
||
price: "$16.000",
|
||
rating: 5,
|
||
reviewCount: "85",
|
||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-delicious-sushi-sushi-delivery-advertising-sushi-rolls-made-fish-cheese_132075-14587.jpg",
|
||
imageAlt: "Nigiri Deluxe Set",
|
||
},
|
||
]}
|
||
title="Our Signature Dishes"
|
||
description="Discover a taste of tradition and innovation with our highly-rated menu items, perfect for any time of day."
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardThirteen
|
||
animationType="depth-3d"
|
||
textboxLayout="default"
|
||
useInvertedBackground={false}
|
||
carouselMode="auto"
|
||
testimonials={[
|
||
{
|
||
id: "1",
|
||
name: "Isabel M.",
|
||
handle: "@IsabelFoodie",
|
||
testimonial: "Cafetería Natsuko is a hidden gem in Padre Hurtado! The ramen is incredibly flavorful, and their sushi is always fresh. A must-visit for Asian fusion lovers.",
|
||
rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-afro-american-woman_23-2148332136.jpg",
|
||
imageAlt: "Isabel M.",
|
||
},
|
||
{
|
||
id: "2",
|
||
name: "Ricardo S.",
|
||
handle: "@RicardoReviews",
|
||
testimonial: "Fantastic experience every time. The pastries are divine, and their iced matcha latte is my go-to. Perfect for a quick lunch or a relaxing coffee break.",
|
||
rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-handsome-bearded-guy-showing-okay-gesture-smiling-standing-blue-background_1258-160947.jpg",
|
||
imageAlt: "Ricardo S.",
|
||
},
|
||
{
|
||
id: "3",
|
||
name: "Sofía A.",
|
||
handle: "@SofiaEats",
|
||
testimonial: "I'm obsessed with their spicy tantanmen! The ambiance is lovely, and the staff are always so welcoming. Highly recommend ordering online for delivery.",
|
||
rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/enthusiastic-european-girl-standing-kitchen-with-cup-tea-pretty-brunette-woman-posing-with-pizza-laughing_197531-9681.jpg",
|
||
imageAlt: "Sofía A.",
|
||
},
|
||
{
|
||
id: "4",
|
||
name: "Carlos L.",
|
||
handle: "@CarlosCravings",
|
||
testimonial: "The best Asian fusion spot in the area. Their Rainbow Maki is a work of art, and the price is incredibly reasonable for the quality. My family loves it here!",
|
||
rating: 4,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-woman-holding-speech-bubble-with-various-type-emoticons_23-2147849477.jpg",
|
||
imageAlt: "Carlos L.",
|
||
},
|
||
{
|
||
id: "5",
|
||
name: "Valentina G.",
|
||
handle: "@ValenVentures",
|
||
testimonial: "A delightful cafe with a unique menu. From savory dishes to sweet treats, everything is delicious. The online ordering system is super convenient.",
|
||
rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-sitting-indoor-urban-cafe_158595-669.jpg",
|
||
imageAlt: "Valentina G.",
|
||
},
|
||
{
|
||
id: "6",
|
||
name: "Javier P.",
|
||
handle: "@JavierJourneys",
|
||
testimonial: "Great spot for professionals looking for a quality meal. Their vegetarian options are surprisingly robust and flavorful. Consistent 5-star service.",
|
||
rating: 5,
|
||
imageSrc: "http://img.b2bpic.net/free-photo/contemplating-cafe_1098-14559.jpg",
|
||
imageAlt: "Javier P.",
|
||
},
|
||
]}
|
||
showRating={true}
|
||
title="What Our Customers Say"
|
||
description="Our 4.7-star rating reflects the consistent quality and exceptional service we strive for. Hear directly from those who love Cafetería Natsuko!"
|
||
/>
|
||
</div>
|
||
|
||
<div id="faq" data-section="faq">
|
||
<FaqSplitMedia
|
||
textboxLayout="default"
|
||
useInvertedBackground={true}
|
||
faqs={[
|
||
{
|
||
id: "faq-1",
|
||
title: "What are your operating hours?",
|
||
content: "We are open daily from 9 AM to 9 PM, offering dine-in, takeout, and delivery services for your convenience.",
|
||
},
|
||
{
|
||
id: "faq-2",
|
||
title: "Do you offer online ordering and delivery?",
|
||
content: "Yes, you can easily place your order through our website for both pickup and delivery within the Padre Hurtado area.",
|
||
},
|
||
{
|
||
id: "faq-3",
|
||
title: "Are there vegetarian or vegan options available?",
|
||
content: "Absolutely! We offer a variety of vegetarian and vegan-friendly dishes, clearly marked on our menu, to cater to all dietary preferences.",
|
||
},
|
||
{
|
||
id: "faq-4",
|
||
title: "Can I make a reservation for dine-in? ",
|
||
content: "While we primarily operate on a first-come, first-served basis, we do accommodate reservations for groups of 6 or more. Please contact us directly to arrange.",
|
||
},
|
||
{
|
||
id: "faq-5",
|
||
title: "What is the average price range per person?",
|
||
content: "Our main courses and sushi platters range from $10,000–$15,000 CLP per person, with pastries and beverages available at more affordable prices.",
|
||
},
|
||
]}
|
||
imageSrc="http://img.b2bpic.net/free-photo/chef-working-together-professional-kitchen_23-2149728034.jpg"
|
||
imageAlt="Cafe staff preparing food in a clean kitchen"
|
||
mediaAnimation="opacity"
|
||
mediaPosition="right"
|
||
title="Frequently Asked Questions"
|
||
description="Find quick answers to common questions about our menu, ordering, and services. We're here to make your experience as smooth as possible."
|
||
faqsAnimation="slide-up"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplitForm
|
||
useInvertedBackground={false}
|
||
title="Visit Us or Get in Touch"
|
||
description="We'd love to hear from you! Whether you have a question, feedback, or want to place a large order, our team is ready to assist."
|
||
inputs={[
|
||
{
|
||
name: "name",
|
||
type: "text",
|
||
placeholder: "Your Name",
|
||
required: true,
|
||
},
|
||
{
|
||
name: "email",
|
||
type: "email",
|
||
placeholder: "Your Email",
|
||
required: true,
|
||
},
|
||
{
|
||
name: "phone",
|
||
type: "tel",
|
||
placeholder: "Your Phone (Optional)",
|
||
required: false,
|
||
},
|
||
]}
|
||
textarea={{
|
||
name: "message",
|
||
placeholder: "Your Message",
|
||
rows: 4,
|
||
required: true,
|
||
}}
|
||
imageSrc="http://img.b2bpic.net/free-photo/street-restaurant-old-town-regensburg-germany_1127-3372.jpg"
|
||
imageAlt="Exterior view of Cafetería Natsuko"
|
||
mediaAnimation="opacity"
|
||
mediaPosition="left"
|
||
buttonText="Send Message"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterBase
|
||
columns={[
|
||
{
|
||
title: "Explore",
|
||
items: [
|
||
{
|
||
label: "Home",
|
||
href: "#home",
|
||
},
|
||
{
|
||
label: "Menu",
|
||
href: "#menu",
|
||
},
|
||
{
|
||
label: "About Us",
|
||
href: "#about",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
title: "Services",
|
||
items: [
|
||
{
|
||
label: "Order Online",
|
||
href: "#menu",
|
||
},
|
||
{
|
||
label: "Delivery",
|
||
href: "#menu",
|
||
},
|
||
{
|
||
label: "Takeout",
|
||
href: "#menu",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
title: "Connect",
|
||
items: [
|
||
{
|
||
label: "Contact Us",
|
||
href: "#contact",
|
||
},
|
||
{
|
||
label: "Reviews",
|
||
href: "#testimonials",
|
||
},
|
||
{
|
||
label: "Instagram",
|
||
href: "#",
|
||
},
|
||
],
|
||
},
|
||
]}
|
||
logoSrc="http://img.b2bpic.net/free-vector/hand-drawn-kawaii-business-card-template_23-2148220152.jpg"
|
||
logoAlt="Cafetería Natsuko Logo"
|
||
logoText="Cafetería Natsuko"
|
||
copyrightText="© 2024 Cafetería Natsuko. All rights reserved."
|
||
/>
|
||
</div>
|
||
</ReactLenis>
|
||
</ThemeProvider>
|
||
);
|
||
}
|