Files
dca8bc2b-7d92-47e2-8c47-c86…/src/app/page.tsx
2026-06-07 11:49:53 +00:00

288 lines
14 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import { Compass, Crown, Music, Sparkles, Star } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="smallMedium"
sizing="mediumLargeSizeLargeTitles"
background="aurora"
cardStyle="glass-elevated"
primaryButtonStyle="double-inset"
secondaryButtonStyle="layered"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home", id: "hero"},
{
name: "About", id: "about"},
{
name: "Menu", id: "menu"},
{
name: "Highlights", id: "highlights"},
{
name: "Services", id: "services"},
{
name: "Reviews", id: "reviews"},
{
name: "Partners", id: "partners"},
{
name: "FAQ", id: "faq"},
{
name: "Contact", id: "contact"},
]}
logoSrc="http://img.b2bpic.net/free-psd/delicious-food-buffet-template_23-2151881727.jpg"
logoAlt="The Haze Karaköy Logo"
brandName="The Haze Karaköy"
button={{
text: "Reservations", href: "#contact"}}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "plain"}}
imagePosition="right"
title="Experience The Haze Karaköy"
description="Where refined tastes meet the vibrant soul of Istanbul. Indulge in an unparalleled culinary journey and sophisticated ambiance by the Bosphorus."
kpis={[
{
value: "12+", label: "Years of Excellence"},
{
value: "200+", label: "Exclusive Dishes"},
{
value: "15K+", label: "Happy Guests"},
]}
enableKpiAnimation={true}
buttons={[
{
text: "View Our Menu", href: "#menu"},
{
text: "Make a Reservation", href: "#contact"},
]}
imageSrc="http://img.b2bpic.net/free-photo/glass-raspberry-cocktail-with-ice_140725-4866.jpg"
imageAlt="Luxurious interior of The Haze Karaköy"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/handsome-groom-feeding-his-bride-with-croissant-cafe_176420-2272.jpg", alt: "Smiling woman enjoying fine dining"},
{
src: "http://img.b2bpic.net/free-photo/fashionable-african-american-man-suit-glasses-sitting-cafe-eating-salad_627829-1782.jpg", alt: "Elegant man enjoying a meal"},
{
src: "http://img.b2bpic.net/free-photo/elegant-couple-spend-time-restaurant_1157-20509.jpg", alt: "Couple having a romantic dinner"},
{
src: "http://img.b2bpic.net/free-photo/pretty-woman-with-candid-smile-laughing-sitting-summer-cafe-with-cup-cappuccino_285396-7965.jpg", alt: "Stylish guest at a luxury restaurant"},
{
src: "http://img.b2bpic.net/free-photo/front-view-couple-having-romantic-dinner-together_23-2148435808.jpg", alt: "Food critic reviewing a dish"},
]}
avatarText="Loved by 15,000+ Guests"
marqueeItems={[
{
type: "text-icon", text: "Exquisite Flavors", icon: Sparkles,
},
{
type: "text-icon", text: "Artisanal Cocktails", icon: Crown,
},
{
type: "text-icon", text: "Unforgettable Ambiance", icon: Star,
},
{
type: "text-icon", text: "Live Entertainment", icon: Music,
},
{
type: "text-icon", text: "Bosphorus Views", icon: Compass,
},
]}
marqueeSpeed={40}
/>
</div>
<div id="about" data-section="about">
<TextSplitAbout
useInvertedBackground={false}
title="Our Story & Vision"
description={[
"Nestled in the heart of Karaköy, The Haze is more than just a restaurant and bar; it's a destination. We blend Istanbul's rich history with a modern, luxurious experience, creating a unique space where every visit becomes a cherished memory.", "Our vision is to offer a sanctuary of taste and elegance, where exceptional cuisine, artfully crafted cocktails, and a captivating atmosphere converge. We pride ourselves on sourcing the finest local ingredients, transformed into culinary masterpieces by our award-winning chefs."]}
buttons={[
{
text: "Learn More About Us", href: "#about"},
]}
showBorder={false}
/>
</div>
<div id="menu" data-section="menu">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
products={[
{
id: "dish-1", name: "Ottoman Lamb Shank", price: "₺450", variant: "Main Course", imageSrc: "http://img.b2bpic.net/free-photo/grilled-foie-gras_1203-3591.jpg", imageAlt: "Ottoman Lamb Shank dish"},
{
id: "dish-2", name: "Bosphorus Seabass", price: "₺380", variant: "Seafood", imageSrc: "http://img.b2bpic.net/free-photo/seafood-crab-salad-with-fresh-parmesan-crackers-greenery-inside-white-plate_114579-1799.jpg", imageAlt: "Bosphorus Seabass dish"},
{
id: "dish-3", name: "Truffle Mushroom Risotto", price: "₺320", variant: "Vegetarian", imageSrc: "http://img.b2bpic.net/free-photo/spaghetti-with-meat-creamy-sauce-garnished-with-grated-parmesan_141793-1830.jpg", imageAlt: "Truffle Mushroom Risotto"},
{
id: "cocktail-1", name: "Karaköy Sunset", price: "₺200", variant: "Signature Cocktail", imageSrc: "http://img.b2bpic.net/free-photo/still-life-cocktail-tablecloth_23-2151318415.jpg", imageAlt: "Karaköy Sunset cocktail"},
{
id: "dessert-1", name: "Pistachio Baklava Platter", price: "₺180", variant: "Dessert", imageSrc: "http://img.b2bpic.net/free-photo/traditional-turkish-delight-oriental-sweets_114579-14948.jpg", imageAlt: "Pistachio Baklava Platter"},
{
id: "wine-1", name: "Anatolian Red Blend", price: "₺750", variant: "Wine", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-tasting-wine_23-2149428834.jpg", imageAlt: "Anatolian Red Blend wine"},
]}
title="Our Exquisite Menu"
description="Savor a fusion of traditional Turkish flavors and international culinary artistry, crafted to delight every palate."
/>
</div>
<div id="highlights" data-section="highlights">
<MetricCardTwo
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
animationType="slide-up"
metrics={[
{
id: "metric-1", value: "20+", description: "Industry Awards & Recognitions for Culinary Excellence"},
{
id: "metric-2", value: "5-Star", description: "Guest Ratings on Leading Travel & Dining Platforms"},
{
id: "metric-3", value: "100%", description: "Satisfaction Rate for Private Events & Gatherings"},
]}
title="Our Achievements & Impact"
description="Beyond exquisite dining, The Haze Karaköy is recognized for its dedication to quality, innovation, and guest satisfaction."
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentyEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: "feat-1", title: "Bespoke Cocktails", subtitle: "Our expert mixologists craft personalized drinks to match your mood.", category: "Bar Service", value: "Tailored just for you"},
{
id: "feat-2", title: "Private Dining", subtitle: "Host intimate gatherings or corporate events in our luxurious private spaces.", category: "Events", value: "Unforgettable moments"},
{
id: "feat-3", title: "Live Music Nights", subtitle: "Enjoy soulful jazz and contemporary tunes from Istanbul's top artists.", category: "Entertainment", value: "Enchanting evenings"},
]}
title="Exclusive Experiences"
description="The Haze Karaköy offers more than just meals; we provide bespoke experiences tailored to your desires."
/>
</div>
<div id="reviews" data-section="reviews">
<TestimonialCardTwelve
useInvertedBackground={false}
testimonials={[
{
id: "t1", name: "Elif Demir", imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-woman-sitting-table_23-2149212131.jpg", imageAlt: "Elif Demir profile picture"},
{
id: "t2", name: "Mustafa Yılmaz", imageSrc: "http://img.b2bpic.net/free-photo/portrait-pensive-african-american-man-dressed-classic-brown-jacket-standing-studio-dark-background_613910-17787.jpg", imageAlt: "Mustafa Yılmaz profile picture"},
{
id: "t3", name: "Sophie Dubois", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-elegant-brunette-with-her-husband-walking-ale-city-streets-enjoying-there-time-wearing-black-classic-suit-long-cocktail-dress_273443-741.jpg", imageAlt: "Sophie Dubois profile picture"},
{
id: "t4", name: "David Chen", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-luxury-restaurant_23-2150598348.jpg", imageAlt: "David Chen profile picture"},
{
id: "t5", name: "Ayşe Kaya", imageSrc: "http://img.b2bpic.net/free-photo/man-enjoys-bio-lemons-smell_482257-76627.jpg", imageAlt: "Ayşe Kaya profile picture"},
]}
cardTitle="What Our Guests Say"
cardTag="Rave Reviews"
buttons={[
{
text: "Read All Reviews", href: "#reviews"},
]}
cardAnimation="slide-up"
/>
</div>
<div id="partners" data-section="partners">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={[
"Condé Nast Traveler", "Michelin Guide", "Timeout Istanbul", "Gourmet Magazine", "Bosphorus Life", "Istanbul Journal", "Luxury Living"]}
title="Trusted & Featured By"
description="Our commitment to excellence has earned us recognition from leading hospitality and lifestyle publications."
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "faq-1", title: "Do I need a reservation?", content: "Reservations are highly recommended, especially for weekend evenings and private dining experiences, to ensure we can accommodate you and provide the best service."},
{
id: "faq-2", title: "What is the dress code?", content: "The Haze Karaköy observes an elegant smart-casual dress code. We encourage guests to dress in a manner appropriate for a premium dining and lounge environment."},
{
id: "faq-3", title: "Can you accommodate dietary restrictions?", content: "Our culinary team is happy to accommodate most dietary restrictions and allergies. Please inform us in advance when making your reservation."},
{
id: "faq-4", title: "Do you host private events?", content: "Yes, we offer exclusive private dining rooms and can host bespoke events for various occasions. Please contact our events team for personalized arrangements."},
]}
title="Frequently Asked Questions"
description="Find answers to common inquiries about reservations, dress code, private events, and more."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain"}}
tag="Connect With Us"
title="Plan Your Visit or Event"
description="Whether it's a dinner reservation, a private celebration, or simply an inquiry, our team is here to assist you. Reach out to experience the allure of The Haze."
imageSrc="http://img.b2bpic.net/free-photo/busy-employee-checking-her-email_1157-454.jpg"
imageAlt="The Haze Karaköy interior with contact form overlay"
mediaAnimation="opacity"
mediaPosition="right"
inputPlaceholder="Your Email Address"
buttonText="Send Inquiry"
termsText="By submitting, you agree to our privacy policy and terms of service."
onSubmit={(email) => console.log(email)}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoSrc="http://img.b2bpic.net/free-psd/delicious-food-buffet-template_23-2151881727.jpg"
logoAlt="The Haze Karaköy Logo"
logoText="The Haze Karaköy"
leftLink={{
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service", href: "#"}}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}