b
This commit is contained in:
@@ -0,0 +1,103 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { ArrowRight, Clock, Users } from "lucide-react";
|
||||
import ScrollReveal from "@/components/ScrollReveal";
|
||||
|
||||
import prisma from "@/lib/prisma";
|
||||
|
||||
export default async function AktivitelerPage({ params }: { params: Promise<{ lang: string }> }) {
|
||||
const { lang } = await params;
|
||||
const activities = await prisma.activity.findMany({ where: { lang }, orderBy: { order: "asc" } });
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-background">
|
||||
|
||||
{/* Page Header */}
|
||||
<section className="relative h-[55vh] w-full flex items-end overflow-hidden">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1526367790999-0150786686a2?q=80&w=2940&auto=format&fit=crop"
|
||||
alt="Aktiviteler"
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-dark/85 via-dark/30 to-black/20" />
|
||||
</div>
|
||||
<div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-14 w-full">
|
||||
<span className="block text-accent text-xs tracking-[0.3em] uppercase font-semibold mb-3 animate-fade-up">
|
||||
Deneyimler
|
||||
</span>
|
||||
<h1 className="font-serif text-5xl md:text-7xl text-white font-bold animate-fade-up delay-100">
|
||||
Aktiviteler
|
||||
</h1>
|
||||
<p className="text-white/60 text-lg mt-3 font-light animate-fade-up delay-200">
|
||||
Rüzgarı hisset, doğayla bir ol.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Activities */}
|
||||
<section className="py-20 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
{activities.length > 0 ? activities.map((act, i) => (
|
||||
<ScrollReveal key={act.id} delay={i * 80}>
|
||||
<div className="card-lift group bg-white rounded-3xl overflow-hidden border border-sand flex flex-col h-full">
|
||||
<div className="relative h-64 overflow-hidden">
|
||||
<Image
|
||||
src={act.image}
|
||||
alt={act.title}
|
||||
fill
|
||||
className="object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
/>
|
||||
{act.badge && (
|
||||
<span className="absolute top-4 left-4 text-[10px] font-bold px-3 py-1.5 rounded-full tracking-widest uppercase bg-accent text-white shadow">
|
||||
{act.badge}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="p-8 flex-grow flex flex-col">
|
||||
<h2 className="font-serif text-2xl font-bold text-dark mb-3">{act.title}</h2>
|
||||
<p className="text-gray-500 text-[14px] leading-relaxed mb-6 flex-grow">{act.description}</p>
|
||||
|
||||
<div className="flex justify-between items-center pt-6 border-t border-sand">
|
||||
<div>
|
||||
<span className="text-2xl font-bold text-dark">{act.price}</span>
|
||||
</div>
|
||||
<Link
|
||||
href={`/${lang}/iletisim`}
|
||||
className="inline-flex items-center gap-2 text-accent font-bold text-[12px] tracking-wider uppercase hover:text-primary transition-colors group/link"
|
||||
>
|
||||
Bilgi Al
|
||||
<ArrowRight size={14} className="group-hover/link:translate-x-1 transition-transform" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
)) : (
|
||||
<div className="col-span-2 text-center py-20 text-gray-500">Henüz aktivite eklenmedi.</div>
|
||||
)}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* CTA */}
|
||||
<section className="py-20 bg-primary">
|
||||
<div className="max-w-3xl mx-auto px-4 text-center">
|
||||
<h3 className="font-serif text-4xl text-white font-bold mb-4">
|
||||
Özel Paket Teklifi Al
|
||||
</h3>
|
||||
<p className="text-white/60 mb-8">
|
||||
Kitesurf + konaklama veya yoga + SUP gibi özel aktivite paketleri için bizimle iletişime geçin.
|
||||
</p>
|
||||
<Link
|
||||
href="/iletisim"
|
||||
className="btn-shimmer inline-block bg-accent text-white px-10 py-4 rounded-full text-xs font-bold tracking-[0.15em] uppercase"
|
||||
>
|
||||
İletişime Geç
|
||||
</Link>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,61 @@
|
||||
export default async function CookiesPage({ params }: { params: Promise<{ lang: string }> }) {
|
||||
const { lang } = await params;
|
||||
|
||||
const content = {
|
||||
tr: {
|
||||
title: "Çerez Politikası",
|
||||
subtitle: "Web sitemizdeki çerez kullanımı hakkında bilgiler.",
|
||||
text: `Kite Beach Akyaka olarak, web sitemizden en verimli şekilde faydalanabilmeniz ve kullanıcı deneyiminizi geliştirebilmek amacıyla Çerezler (Cookies) kullanmaktayız. Çerez kullanılmasını tercih etmezseniz tarayıcınızın ayarlarından çerezleri silebilir ya da engelleyebilirsiniz.
|
||||
|
||||
1. Çerez Nedir?
|
||||
Çerezler, bir web sitesini ziyaret ettiğinizde bilgisayarınıza veya mobil cihazınıza kaydedilen küçük metin dosyalarıdır. Bu dosyalar, web sitesinin daha verimli çalışmasını sağlamak ve ziyaretçilere kişiselleştirilmiş bir deneyim sunmak için kullanılır.
|
||||
|
||||
2. Hangi Çerezleri Kullanıyoruz?
|
||||
- **Zorunlu Çerezler:** Sitemizin temel işlevlerini yerine getirebilmesi için kesinlikle gerekli olan çerezlerdir. (Örn: Oturum yönetimi, dil tercihi)
|
||||
- **Performans ve Analitik Çerezleri:** Sitemizin ziyaretçiler tarafından nasıl kullanıldığını analiz etmek, en çok ziyaret edilen sayfaları belirlemek ve sitemizin performansını artırmak için kullanılır. (Örn: Google Analytics çerezleri)
|
||||
- **İşlevsellik Çerezleri:** Ziyaretleriniz sırasındaki tercihlerinizi (seçtiğiniz dil veya bölge vb.) hatırlamamızı sağlayan çerezlerdir.
|
||||
|
||||
3. Çerezlerin Yönetimi
|
||||
Tarayıcınızın ayarlarını değiştirerek çerezlere ilişkin tercihlerinizi kişiselleştirme imkanına sahipsiniz. Çoğu tarayıcı, çerezleri otomatik olarak kabul eder ancak çerezleri reddetmek veya çerez gönderildiğinde uyarı almak için ayarlarınızı değiştirebilirsiniz.
|
||||
|
||||
Çerez ayarlarınızı nasıl yöneteceğinizi öğrenmek için tarayıcınızın (Chrome, Safari, Firefox, Edge vb.) "Yardım" veya "Ayarlar" menüsünü kullanabilirsiniz.
|
||||
`,
|
||||
},
|
||||
en: {
|
||||
title: "Cookie Policy",
|
||||
subtitle: "Information about the use of cookies on our website.",
|
||||
text: `As Kite Beach Akyaka, we use Cookies in order for you to benefit from our website in the most efficient way and to improve your user experience. If you prefer not to use cookies, you can delete or block cookies from your browser settings.
|
||||
|
||||
1. What is a Cookie?
|
||||
Cookies are small text files that are saved on your computer or mobile device when you visit a website. These files are used to make the website work more efficiently and to offer a personalized experience to visitors.
|
||||
|
||||
2. Which Cookies Do We Use?
|
||||
- **Strictly Necessary Cookies:** These are cookies that are absolutely necessary for our site to fulfill its basic functions. (E.g. Session management, language preference)
|
||||
- **Performance and Analytical Cookies:** Used to analyze how our site is used by visitors, identify the most visited pages, and improve the performance of our site. (E.g. Google Analytics cookies)
|
||||
- **Functionality Cookies:** These are cookies that allow us to remember your preferences (language or region you have chosen, etc.) during your visits.
|
||||
|
||||
3. Management of Cookies
|
||||
You have the opportunity to personalize your preferences regarding cookies by changing your browser settings. Most browsers automatically accept cookies, but you can change your settings to reject cookies or to receive a warning when a cookie is sent.
|
||||
|
||||
You can use the "Help" or "Settings" menu of your browser (Chrome, Safari, Firefox, Edge, etc.) to learn how to manage your cookie settings.`
|
||||
}
|
||||
};
|
||||
|
||||
const t = content[lang as keyof typeof content] || content.tr;
|
||||
|
||||
return (
|
||||
<div className="pt-32 pb-20 bg-background min-h-screen">
|
||||
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<h1 className="font-serif text-4xl md:text-5xl font-bold text-dark mb-4">{t.title}</h1>
|
||||
<h2 className="text-xl text-primary font-medium mb-10">{t.subtitle}</h2>
|
||||
<div className="prose prose-lg text-gray-600">
|
||||
{t.text.split('\n\n').map((paragraph, index) => (
|
||||
<p key={index} className="mb-6 whitespace-pre-line leading-relaxed">
|
||||
{paragraph}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,16 @@
|
||||
import "server-only";
|
||||
|
||||
const dictionaries = {
|
||||
en: () => import("../../dictionaries/en.json").then((module) => module.default),
|
||||
tr: () => import("../../dictionaries/tr.json").then((module) => module.default),
|
||||
};
|
||||
|
||||
export type Locale = keyof typeof dictionaries;
|
||||
|
||||
export const hasLocale = (locale: string): locale is Locale =>
|
||||
locale in dictionaries;
|
||||
|
||||
export const getDictionary = async (locale: Locale) => {
|
||||
if (!hasLocale(locale)) return dictionaries.tr();
|
||||
return dictionaries[locale]();
|
||||
};
|
||||
@@ -0,0 +1,141 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { ArrowRight, Calendar, Clock, MapPin, Music } from "lucide-react";
|
||||
import ScrollReveal from "@/components/ScrollReveal";
|
||||
|
||||
import prisma from "@/lib/prisma";
|
||||
|
||||
export const metadata = {
|
||||
title: "Etkinlikler | Kite Beach Akyaka",
|
||||
description: "Mahmut Orhan konserinden Kitesurf festivallerine, Akyaka'daki en özel etkinlikler ve gün batımı partileri.",
|
||||
};
|
||||
|
||||
export default async function EventsPage({ params }: { params: Promise<{ lang: string }> }) {
|
||||
const { lang } = await params;
|
||||
const events = await prisma.event.findMany({ where: { lang }, orderBy: { date: "asc" } });
|
||||
|
||||
return (
|
||||
<div className="flex flex-col min-h-screen bg-background">
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
HERO
|
||||
────────────────────────────────────────── */}
|
||||
<section className="relative h-[60vh] min-h-[500px] w-full flex items-center justify-center overflow-hidden">
|
||||
<div className="absolute inset-0 z-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1514525253161-7a46d19cd819?q=80&w=2874&auto=format&fit=crop"
|
||||
alt="Kite Beach Akyaka Etkinlikler"
|
||||
fill
|
||||
className="object-cover"
|
||||
priority
|
||||
/>
|
||||
<div className="absolute inset-0 bg-dark/60" />
|
||||
</div>
|
||||
|
||||
<div className="relative z-10 text-center px-4 max-w-4xl mx-auto mt-16">
|
||||
<ScrollReveal>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.35em] uppercase mb-4 font-bold">
|
||||
Kite Beach Akyaka
|
||||
</span>
|
||||
<h1 className="font-serif text-5xl md:text-7xl font-bold text-white mb-6">
|
||||
Etkinlikler
|
||||
</h1>
|
||||
<p className="text-white/80 text-lg md:text-xl font-light max-w-2xl mx-auto leading-relaxed">
|
||||
Müzik, spor ve doğanın iç içe geçtiği unutulmaz deneyimler.
|
||||
</p>
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
EVENTS LIST
|
||||
────────────────────────────────────────── */}
|
||||
<section className="py-24">
|
||||
<div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
|
||||
<div className="space-y-16">
|
||||
{events.length > 0 ? events.map((event, index) => (
|
||||
<ScrollReveal key={event.id} delay={index * 100}>
|
||||
<div className={`flex flex-col ${index % 2 === 1 ? 'md:flex-row-reverse' : 'md:flex-row'} gap-8 lg:gap-12 bg-white rounded-3xl overflow-hidden shadow-sm border border-sand transition-all hover:shadow-xl`}>
|
||||
|
||||
{/* Image Container */}
|
||||
<div className="w-full md:w-1/2 lg:w-[55%] relative h-[300px] md:h-auto min-h-[400px]">
|
||||
<Image
|
||||
src={event.image}
|
||||
alt={event.title}
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
{event.badge && (
|
||||
<div className="absolute top-4 left-4 bg-accent text-white px-4 py-1.5 rounded-full text-xs font-bold tracking-widest uppercase flex items-center gap-2 shadow-lg backdrop-blur-md">
|
||||
<Music className="w-3.5 h-3.5" />
|
||||
{event.badge}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Content Container */}
|
||||
<div className="w-full md:w-1/2 lg:w-[45%] p-8 md:p-10 flex flex-col justify-center">
|
||||
<h2 className="font-serif text-3xl md:text-4xl font-bold text-dark mb-6 leading-tight mt-4">
|
||||
{event.title}
|
||||
</h2>
|
||||
|
||||
<div className="space-y-3 mb-6">
|
||||
<div className="flex items-center gap-3 text-sm text-gray-600">
|
||||
<Calendar className="w-4 h-4 text-accent" />
|
||||
<span>{event.date}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-sm text-gray-600">
|
||||
<Clock className="w-4 h-4 text-accent" />
|
||||
<span>{event.time}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-3 text-sm text-gray-600">
|
||||
<MapPin className="w-4 h-4 text-accent" />
|
||||
<span>{event.location}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p className="text-muted text-sm leading-relaxed mb-8">
|
||||
{event.description}
|
||||
</p>
|
||||
|
||||
<div className="flex items-center justify-between mt-auto pt-6 border-t border-sand">
|
||||
<Link
|
||||
href={`/${lang}/iletisim`}
|
||||
className="inline-flex items-center gap-2 text-xs font-bold tracking-widest uppercase transition-colors bg-accent text-white px-6 py-3 rounded-full hover:bg-accent/90"
|
||||
>
|
||||
Bize Ulaşın <ArrowRight className="w-4 h-4" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
)) : (
|
||||
<div className="text-center py-20 text-gray-500">Henüz etkinlik eklenmedi.</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* CTA BAND */}
|
||||
<section className="bg-dark text-white py-24 text-center px-4">
|
||||
<ScrollReveal>
|
||||
<span className="block text-accent text-xs font-bold tracking-[0.25em] uppercase mb-4">Organizasyon</span>
|
||||
<h2 className="font-serif text-4xl md:text-5xl font-bold mb-6">Kendi Etkinliğinizi Planlayın</h2>
|
||||
<p className="text-white/60 max-w-xl mx-auto mb-10 leading-relaxed text-sm">
|
||||
Özel partiler, düğünler veya kurumsal etkinlikler için Kite Beach Akyaka'nın eşsiz atmosferini kiralayabilirsiniz. Detaylar için bizimle iletişime geçin.
|
||||
</p>
|
||||
<Link
|
||||
href="/iletisim"
|
||||
className="inline-block border-2 border-white/20 hover:border-white px-10 py-4 rounded-full text-xs font-bold tracking-[0.15em] uppercase transition-all"
|
||||
>
|
||||
Bize Ulaşın
|
||||
</Link>
|
||||
</ScrollReveal>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,115 @@
|
||||
"use client";
|
||||
|
||||
import Image from "next/image";
|
||||
import { useState } from "react";
|
||||
|
||||
const filters = ["Tümü", "Odalar", "Aktiviteler", "Restoran", "Doğa"] as const;
|
||||
type Filter = (typeof filters)[number];
|
||||
|
||||
const gallery: { src: string; alt: string; category: Exclude<Filter, "Tümü"> }[] = [
|
||||
{ src: "https://images.unsplash.com/photo-1582719478250-c89404bb8a0e?q=80&w=2940&auto=format&fit=crop", alt: "Standart Oda", category: "Odalar" },
|
||||
{ src: "https://images.unsplash.com/photo-1526367790999-0150786686a2?q=80&w=2940&auto=format&fit=crop", alt: "Kitesurf", category: "Aktiviteler" },
|
||||
{ src: "https://images.unsplash.com/photo-1544551763-46a013bb70d5?q=80&w=2940&auto=format&fit=crop", alt: "Nehir Doğa", category: "Doğa" },
|
||||
{ src: "https://images.unsplash.com/photo-1566665797739-1674de7a421a?q=80&w=2874&auto=format&fit=crop", alt: "Nehir Manzaralı Oda",category: "Odalar" },
|
||||
{ src: "https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?q=80&w=2940&auto=format&fit=crop", alt: "Restoran", category: "Restoran" },
|
||||
{ src: "https://images.unsplash.com/photo-1544367567-0f2fcb009e0b?q=80&w=2940&auto=format&fit=crop", alt: "Yoga", category: "Aktiviteler" },
|
||||
{ src: "https://images.unsplash.com/photo-1499955085172-a104c9463ece?q=80&w=2940&auto=format&fit=crop", alt: "Bungalow", category: "Odalar" },
|
||||
{ src: "https://images.unsplash.com/photo-1522883392419-7d8cb2435728?q=80&w=2924&auto=format&fit=crop", alt: "SUP", category: "Aktiviteler" },
|
||||
{ src: "https://images.unsplash.com/photo-1551504734-5ee1c4a1479b?q=80&w=2940&auto=format&fit=crop", alt: "Kahvaltı", category: "Restoran" },
|
||||
{ src: "https://images.unsplash.com/photo-1511994298241-608e28f14fde?q=80&w=2940&auto=format&fit=crop", alt: "Bisiklet", category: "Aktiviteler" },
|
||||
{ src: "https://images.unsplash.com/photo-1544148103-0773bf10d330?q=80&w=2940&auto=format&fit=crop", alt: "Restoran Ambiyans", category: "Restoran" },
|
||||
{ src: "https://images.unsplash.com/photo-1498623116890-37e912163d5d?q=80&w=2940&auto=format&fit=crop", alt: "Gün Batımı", category: "Doğa" },
|
||||
];
|
||||
|
||||
export default function GaleriPage() {
|
||||
const [active, setActive] = useState<Filter>("Tümü");
|
||||
const [lightbox, setLightbox] = useState<string | null>(null);
|
||||
|
||||
const filtered =
|
||||
active === "Tümü" ? gallery : gallery.filter((g) => g.category === active);
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-background pt-28 pb-20">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
|
||||
{/* Heading */}
|
||||
<div className="text-center mb-12">
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
|
||||
Fotoğraflar
|
||||
</span>
|
||||
<h1 className="font-serif text-5xl font-bold text-dark mb-4">Galeri</h1>
|
||||
<p className="text-muted max-w-md mx-auto text-sm leading-relaxed">
|
||||
Kite Beach Akyaka'nın eşsiz doğasını, modern odalarını ve heyecan verici aktivitelerini keşfedin.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Filter tabs */}
|
||||
<div className="flex flex-wrap justify-center gap-2 mb-12">
|
||||
{filters.map((f) => (
|
||||
<button
|
||||
key={f}
|
||||
onClick={() => setActive(f)}
|
||||
className={`px-6 py-2.5 rounded-full text-[12px] font-bold tracking-wider uppercase transition-all duration-300 ${
|
||||
active === f
|
||||
? "bg-primary text-white shadow-md shadow-primary/20"
|
||||
: "bg-white text-dark border border-sand hover:border-primary/40 hover:text-primary"
|
||||
}`}
|
||||
>
|
||||
{f}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Grid */}
|
||||
<div className="columns-1 sm:columns-2 md:columns-3 gap-4 space-y-4">
|
||||
{filtered.map((img, idx) => (
|
||||
<div
|
||||
key={`${active}-${idx}`}
|
||||
className="break-inside-avoid relative rounded-2xl overflow-hidden group cursor-pointer"
|
||||
onClick={() => setLightbox(img.src)}
|
||||
style={{ animation: `scale-in 0.4s cubic-bezier(0.16,1,0.3,1) ${idx * 40}ms both` }}
|
||||
>
|
||||
<div className="relative w-full" style={{ paddingBottom: idx % 3 === 0 ? "133%" : "75%" }}>
|
||||
<Image
|
||||
src={img.src}
|
||||
alt={img.alt}
|
||||
fill
|
||||
className="object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-dark/40 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex items-center justify-center">
|
||||
<span className="text-white font-semibold text-[13px] tracking-wider bg-dark/60 backdrop-blur-sm px-4 py-2 rounded-full">
|
||||
{img.alt}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{/* Lightbox */}
|
||||
{lightbox && (
|
||||
<div
|
||||
className="fixed inset-0 z-50 bg-dark/95 flex items-center justify-center p-4 cursor-zoom-out"
|
||||
onClick={() => setLightbox(null)}
|
||||
>
|
||||
<div className="relative max-w-5xl w-full max-h-[90vh] aspect-video">
|
||||
<Image
|
||||
src={lightbox}
|
||||
alt="Galeri"
|
||||
fill
|
||||
className="object-contain rounded-xl"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
className="absolute top-6 right-6 text-white/60 hover:text-white transition-colors text-3xl font-light"
|
||||
onClick={() => setLightbox(null)}
|
||||
>
|
||||
×
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
export default async function PrivacyPage({ params }: { params: Promise<{ lang: string }> }) {
|
||||
const { lang } = await params;
|
||||
|
||||
const content = {
|
||||
tr: {
|
||||
title: "Gizlilik Politikası",
|
||||
subtitle: "Verilerinizin güvenliği bizim için önemlidir.",
|
||||
text: `Kite Beach Akyaka (“Biz”, “Şirketimiz” veya “Otel”) olarak, web sitemizi ziyaret eden ve hizmetlerimizden faydalanan misafirlerimizin ("Kullanıcı" veya "Misafir") gizliliğini korumayı taahhüt ediyoruz. Bu Gizlilik Politikası, web sitemiz (www.kitebeachakyaka.com.tr) üzerinden toplanan bilgilerin nasıl kullanıldığını ve korunduğunu açıklar.
|
||||
|
||||
1. Hangi Bilgileri Topluyoruz?
|
||||
Size daha iyi hizmet verebilmek amacıyla adınız, soyadınız, e-posta adresiniz, telefon numaranız ve rezervasyon detaylarınız gibi bilgileri doğrudan sizden talep etmekteyiz. Ayrıca web sitemizi ziyaret ettiğinizde otomatik olarak IP adresi, tarayıcı türü, ziyaret süresi gibi standart log bilgileri de toplanabilmektedir.
|
||||
|
||||
2. Bilgilerinizi Nasıl Kullanıyoruz?
|
||||
Topladığımız bilgiler aşağıdaki amaçlar için kullanılmaktadır:
|
||||
- Rezervasyon işlemlerinizi gerçekleştirmek ve onaylamak,
|
||||
- Sizinle iletişim kurmak ve taleplerinize yanıt vermek,
|
||||
- Otel ve kitesurf okulu hizmetlerimizi geliştirmek,
|
||||
- Pazarlama ve tanıtım bildirimleri göndermek (Yalnızca açık rızanız olması halinde),
|
||||
- Yasal yükümlülüklerimizi yerine getirmek.
|
||||
|
||||
3. Bilgi Güvenliği
|
||||
Kişisel bilgilerinizin yetkisiz erişime, değişime, ifşaya veya imhaya karşı korunması için gerekli teknik ve idari güvenlik önlemlerini almaktayız. Web sitemizdeki tüm veri akışları şifrelenmiş bağlantılar (SSL) üzerinden yapılmaktadır.
|
||||
|
||||
4. Üçüncü Taraflarla Paylaşım
|
||||
Bilgilerinizi izniniz olmadan üçüncü taraflarla satmıyor, kiralamıyor veya paylaşmıyoruz. Sadece hizmet sağlamak için işbirliği yaptığımız ödeme sağlayıcıları gibi güvenilir partnerlerle, gizlilik sözleşmeleri çerçevesinde veri paylaşımı yapılabilmektedir.
|
||||
|
||||
5. Değişiklikler
|
||||
Bu Gizlilik Politikası, zaman zaman güncellenebilir. Herhangi bir değişiklik durumunda yeni politika sitemizde yayınlanarak yürürlüğe girecektir.
|
||||
`,
|
||||
},
|
||||
en: {
|
||||
title: "Privacy Policy",
|
||||
subtitle: "The security of your data is important to us.",
|
||||
text: `As Kite Beach Akyaka ("We", "Our Company" or "Hotel"), we are committed to protecting the privacy of our guests ("User" or "Guest") who visit our website and benefit from our services. This Privacy Policy explains how the information collected through our website is used and protected.
|
||||
|
||||
1. What Information Do We Collect?
|
||||
In order to serve you better, we request information such as your name, surname, email address, phone number, and reservation details directly from you. In addition, standard log information such as IP address, browser type, and visit duration may be automatically collected when you visit our website.
|
||||
|
||||
2. How Do We Use Your Information?
|
||||
The information we collect is used for the following purposes:
|
||||
- Processing and confirming your reservations,
|
||||
- Communicating with you and responding to your requests,
|
||||
- Improving our hotel and kitesurf school services,
|
||||
- Sending marketing and promotional notifications (Only with your explicit consent),
|
||||
- Fulfilling our legal obligations.
|
||||
|
||||
3. Information Security
|
||||
We take the necessary technical and administrative security measures to protect your personal information against unauthorized access, alteration, disclosure, or destruction. All data flows on our website are carried out over encrypted connections (SSL).
|
||||
|
||||
4. Sharing with Third Parties
|
||||
We do not sell, rent, or share your information with third parties without your permission. Data sharing can only be done with reliable partners, such as payment providers with whom we cooperate to provide services, within the framework of confidentiality agreements.
|
||||
|
||||
5. Changes
|
||||
This Privacy Policy may be updated from time to time. In case of any changes, the new policy will come into effect by being published on our site.`
|
||||
}
|
||||
};
|
||||
|
||||
const t = content[lang as keyof typeof content] || content.tr;
|
||||
|
||||
return (
|
||||
<div className="pt-32 pb-20 bg-background min-h-screen">
|
||||
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<h1 className="font-serif text-4xl md:text-5xl font-bold text-dark mb-4">{t.title}</h1>
|
||||
<h2 className="text-xl text-primary font-medium mb-10">{t.subtitle}</h2>
|
||||
<div className="prose prose-lg text-gray-600">
|
||||
{t.text.split('\n\n').map((paragraph, index) => (
|
||||
<p key={index} className="mb-6 whitespace-pre-line leading-relaxed">
|
||||
{paragraph}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,155 @@
|
||||
import Image from "next/image";
|
||||
import { Leaf, ChefHat, Award } from "lucide-react";
|
||||
import ScrollReveal from "@/components/ScrollReveal";
|
||||
|
||||
const values = [
|
||||
{
|
||||
icon: Leaf,
|
||||
title: "Doğaya Saygı",
|
||||
desc: "Tesisimizdeki tüm süreçlerde sıfır atık ve sürdürülebilirlik ilkelerini benimsiyoruz. Geleceğe duyarlı bir konaklama deneyimi sunuyoruz.",
|
||||
},
|
||||
{
|
||||
icon: ChefHat,
|
||||
title: "Lokal Mutfak",
|
||||
desc: "Malzemelerimizin büyük bir bölümünü yerel üreticilerden ve Ege köylerinden temin ediyoruz. Taze, mevsimsel ve sürdürülebilir.",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Premium Deneyim",
|
||||
desc: "IKO sertifikalı kitesurf okulumuzdandan odalarımıza kadar her noktada en yüksek kalite standartlarını sunuyoruz.",
|
||||
},
|
||||
];
|
||||
|
||||
const stats = [
|
||||
{ value: "10+", label: "Yıllık Deneyim" },
|
||||
{ value: "500+", label: "Mutlu Misafir" },
|
||||
{ value: "3", label: "IKO Sertifikalı Eğitmen" },
|
||||
{ value: "4", label: "Benzersiz Aktivite" },
|
||||
];
|
||||
|
||||
export default function HakkimizdaPage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-background">
|
||||
|
||||
{/* Page Header */}
|
||||
<section className="relative h-[55vh] w-full flex items-end overflow-hidden">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1544551763-46a013bb70d5?q=80&w=2940&auto=format&fit=crop"
|
||||
alt="Hakkımızda"
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-dark/85 via-dark/30 to-black/20" />
|
||||
</div>
|
||||
<div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-14 w-full">
|
||||
<span className="block text-accent text-xs tracking-[0.3em] uppercase font-semibold mb-3 animate-fade-up">
|
||||
Biz Kimiz
|
||||
</span>
|
||||
<h1 className="font-serif text-5xl md:text-7xl text-white font-bold animate-fade-up delay-100">
|
||||
Hikayemiz
|
||||
</h1>
|
||||
<p className="text-white/60 text-lg mt-3 font-light animate-fade-up delay-200">
|
||||
Rüzgarın, denizin ve nehrin kesiştiği yerde.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Story */}
|
||||
<section className="py-24 bg-white">
|
||||
<div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
|
||||
<ScrollReveal>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-5">
|
||||
Akyaka'nın Kalbinde
|
||||
</span>
|
||||
<h2 className="font-serif text-4xl font-bold text-dark mb-6 leading-tight">
|
||||
Bir Tutku<br />Yolculuğu
|
||||
</h2>
|
||||
<div className="space-y-4 text-gray-500 leading-relaxed text-[15px]">
|
||||
<p>
|
||||
Kite Beach Akyaka, Gökova Körfezi'nin kristal sularına dökülen Azmak Nehri'nin
|
||||
hemen kıyısında doğdu. Amacımız, misafirlerimize sıradan bir konaklamadan çok
|
||||
daha fazlasını sunmak; rüzgar sörfü tutkusunu doğayla, konforla ve iyi yemekle
|
||||
bütünleştiren eşsiz bir yaşam alanı yaratmaktı.
|
||||
</p>
|
||||
<p>
|
||||
Doğaya saygılı mimarimiz, lokal üreticileri destekleyen mutfağımız ve IKO
|
||||
standartlarındaki eğitim merkezimizle, Akyaka'nın sürdürülebilir turizm yüzü
|
||||
olmayı hedefliyoruz.
|
||||
</p>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
|
||||
<ScrollReveal delay={150}>
|
||||
<div className="relative h-[460px] rounded-3xl overflow-hidden">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1526367790999-0150786686a2?q=80&w=2940&auto=format&fit=crop"
|
||||
alt="Kitesurf"
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Stats */}
|
||||
<section className="py-20 bg-primary">
|
||||
<div className="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<ScrollReveal stagger className="grid grid-cols-2 md:grid-cols-4 gap-0 divide-x divide-white/10">
|
||||
{stats.map((s, i) => (
|
||||
<div key={i} className="text-center py-8 px-6">
|
||||
<span className="block font-serif text-4xl font-bold text-white mb-2">{s.value}</span>
|
||||
<span className="block text-white/50 text-[12px] uppercase tracking-wider">{s.label}</span>
|
||||
</div>
|
||||
))}
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Values */}
|
||||
<section className="py-24 bg-background">
|
||||
<div className="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<ScrollReveal className="text-center mb-14">
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
|
||||
Ne İnanıyoruz
|
||||
</span>
|
||||
<h2 className="font-serif text-4xl font-bold text-dark">Değerlerimiz</h2>
|
||||
</ScrollReveal>
|
||||
|
||||
<ScrollReveal stagger className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
{values.map((v, i) => {
|
||||
const Icon = v.icon;
|
||||
return (
|
||||
<div key={i} className="bg-white rounded-2xl p-8 border border-sand card-lift">
|
||||
<div className="w-12 h-12 bg-primary/8 rounded-xl flex items-center justify-center mb-6">
|
||||
<Icon size={22} className="text-primary" />
|
||||
</div>
|
||||
<h3 className="font-serif text-xl font-bold text-dark mb-3">{v.title}</h3>
|
||||
<p className="text-gray-500 text-[14px] leading-relaxed">{v.desc}</p>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Vision */}
|
||||
<section className="py-24 bg-dark text-white">
|
||||
<div className="max-w-3xl mx-auto px-4 text-center">
|
||||
<ScrollReveal>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-5">
|
||||
Vizyonumuz
|
||||
</span>
|
||||
<blockquote className="font-serif text-3xl md:text-4xl font-bold leading-tight mb-8">
|
||||
"Akyaka'nın sürdürülebilir turizm yüzü olmak ve her misafirimize benzersiz bir kaçış sunmak."
|
||||
</blockquote>
|
||||
<div className="section-line mx-auto" />
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,178 @@
|
||||
import { MapPin, Phone, Mail, Clock } from "lucide-react";
|
||||
import ScrollReveal from "@/components/ScrollReveal";
|
||||
|
||||
export default function IletisimPage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-background pt-28 pb-20">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
|
||||
{/* Heading */}
|
||||
<div className="text-center mb-16">
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
|
||||
Bize Ulaşın
|
||||
</span>
|
||||
<h1 className="font-serif text-5xl font-bold text-dark mb-4">
|
||||
İletişim & Rezervasyon
|
||||
</h1>
|
||||
<p className="text-muted max-w-lg mx-auto text-sm leading-relaxed">
|
||||
Sorularınız veya rezervasyon talepleriniz için bizimle iletişime geçin.
|
||||
Ekibimiz en kısa sürede dönüş yapacaktır.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 lg:grid-cols-5 gap-10">
|
||||
|
||||
{/* Form — takes 3 cols */}
|
||||
<ScrollReveal className="lg:col-span-3">
|
||||
<div className="bg-white rounded-3xl p-10 md:p-12 border border-sand shadow-sm">
|
||||
<h2 className="font-serif text-2xl font-bold text-dark mb-8">Mesaj Gönderin</h2>
|
||||
<form className="space-y-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-5">
|
||||
<div>
|
||||
<label htmlFor="name" className="block text-[12px] font-semibold text-foreground/60 mb-2 tracking-wider uppercase">
|
||||
Ad Soyad
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
className="w-full px-4 py-3 rounded-xl border border-sand focus:ring-2 focus:ring-primary/20 focus:border-primary outline-none transition-all bg-background text-[14px]"
|
||||
placeholder="Adınız Soyadınız"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="phone" className="block text-[12px] font-semibold text-foreground/60 mb-2 tracking-wider uppercase">
|
||||
Telefon
|
||||
</label>
|
||||
<input
|
||||
type="tel"
|
||||
id="phone"
|
||||
className="w-full px-4 py-3 rounded-xl border border-sand focus:ring-2 focus:ring-primary/20 focus:border-primary outline-none transition-all bg-background text-[14px]"
|
||||
placeholder="+90 (5XX) XXX XX XX"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="email" className="block text-[12px] font-semibold text-foreground/60 mb-2 tracking-wider uppercase">
|
||||
E-posta
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
className="w-full px-4 py-3 rounded-xl border border-sand focus:ring-2 focus:ring-primary/20 focus:border-primary outline-none transition-all bg-background text-[14px]"
|
||||
placeholder="ornek@email.com"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="subject" className="block text-[12px] font-semibold text-foreground/60 mb-2 tracking-wider uppercase">
|
||||
Konu
|
||||
</label>
|
||||
<select
|
||||
id="subject"
|
||||
className="w-full px-4 py-3 rounded-xl border border-sand focus:ring-2 focus:ring-primary/20 focus:border-primary outline-none transition-all bg-background text-[14px] text-foreground"
|
||||
>
|
||||
<option>Oda Rezervasyonu</option>
|
||||
<option>Kitesurf Dersi / Kiralama</option>
|
||||
<option>Restoran Rezervasyonu</option>
|
||||
<option>Aktivite Bilgisi</option>
|
||||
<option>Diğer</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="message" className="block text-[12px] font-semibold text-foreground/60 mb-2 tracking-wider uppercase">
|
||||
Mesajınız
|
||||
</label>
|
||||
<textarea
|
||||
id="message"
|
||||
rows={5}
|
||||
className="w-full px-4 py-3 rounded-xl border border-sand focus:ring-2 focus:ring-primary/20 focus:border-primary outline-none transition-all bg-background text-[14px] resize-none"
|
||||
placeholder="Talebinizi buraya yazabilirsiniz..."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
className="btn-shimmer w-full bg-accent text-white py-4 rounded-xl text-[12px] font-bold tracking-[0.15em] uppercase hover:bg-accent/90 transition-colors shadow-lg"
|
||||
>
|
||||
Mesaj Gönder
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
|
||||
{/* Sidebar — takes 2 cols */}
|
||||
<ScrollReveal delay={200} className="lg:col-span-2 flex flex-col gap-6">
|
||||
|
||||
{/* Contact info card */}
|
||||
<div className="bg-primary rounded-3xl p-8 text-white">
|
||||
<h3 className="font-serif text-xl font-bold mb-7">İletişim Bilgileri</h3>
|
||||
<ul className="space-y-6">
|
||||
{[
|
||||
{
|
||||
icon: MapPin,
|
||||
label: "Adres",
|
||||
value: "Akyaka Mahallesi, Akçapınar Mevkii, Muğla",
|
||||
href: undefined,
|
||||
},
|
||||
{
|
||||
icon: Phone,
|
||||
label: "Telefon / WhatsApp",
|
||||
value: "+90 533 081 6181",
|
||||
href: "tel:+905330816181",
|
||||
},
|
||||
{
|
||||
icon: Mail,
|
||||
label: "E-posta",
|
||||
value: "info@kitebeachakyaka.com.tr",
|
||||
href: "mailto:info@kitebeachakyaka.com.tr",
|
||||
},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Resepsiyon",
|
||||
value: "Her gün 08:00 – 22:00",
|
||||
href: undefined,
|
||||
},
|
||||
].map(({ icon: Icon, label, value, href }) => (
|
||||
<li key={label} className="flex items-start gap-4">
|
||||
<div className="w-9 h-9 bg-white/10 rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">
|
||||
<Icon size={15} className="text-accent" />
|
||||
</div>
|
||||
<div>
|
||||
<span className="block text-[10px] font-bold tracking-[0.2em] uppercase text-white/40 mb-1">
|
||||
{label}
|
||||
</span>
|
||||
{href ? (
|
||||
<a href={href} className="text-white/80 hover:text-white transition-colors text-[13px]">
|
||||
{value}
|
||||
</a>
|
||||
) : (
|
||||
<span className="text-white/80 text-[13px]">{value}</span>
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Map */}
|
||||
<div className="rounded-3xl overflow-hidden border border-sand flex-grow min-h-[220px] relative">
|
||||
<iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d12759.395175968393!2d28.3245!3d37.0564!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x14bf76cd1f1f1d1f%3A0x1d1f1f1f1f1f1f1f!2sAkyaka%2C%20Ula%2FMuğla!5e0!3m2!1str!2str!4v1650000000000!5m2!1str!2str"
|
||||
width="100%"
|
||||
height="100%"
|
||||
style={{ border: 0 }}
|
||||
allowFullScreen
|
||||
loading="lazy"
|
||||
referrerPolicy="no-referrer-when-downgrade"
|
||||
className="absolute inset-0"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,80 @@
|
||||
export default async function KVKKPage({ params }: { params: Promise<{ lang: string }> }) {
|
||||
const { lang } = await params;
|
||||
|
||||
const content = {
|
||||
tr: {
|
||||
title: "Kişisel Verilerin Korunması",
|
||||
subtitle: "Kişisel Verilerin Korunması Kanunu (KVKK) Aydınlatma Metni",
|
||||
text: `Kite Beach Akyaka olarak, kişisel verilerinizin güvenliğine büyük önem veriyoruz. 6698 sayılı Kişisel Verilerin Korunması Kanunu (“Kanun”) uyarınca, elde edilen kişisel verileriniz veri sorumlusu sıfatıyla Kite Beach Akyaka tarafından aşağıda açıklanan kapsamda işlenebilecektir.
|
||||
|
||||
1. Kişisel Verilerin İşlenme Amacı
|
||||
Kişisel verileriniz;
|
||||
- Otelimizde konaklama ve kitesurf okulumuzdaki faaliyetlerin gerçekleştirilebilmesi,
|
||||
- Sizlere sunulan ürün ve hizmetlerin beğeni, kullanım alışkanlıkları ve ihtiyaçlarınıza göre özelleştirilerek önerilmesi,
|
||||
- Rezervasyon, iletişim ve müşteri memnuniyeti süreçlerinin yürütülmesi,
|
||||
- İlgili mevzuat gereği yasal yükümlülüklerin yerine getirilmesi amacıyla işlenmektedir.
|
||||
|
||||
2. İşlenen Kişisel Verilerin Kimlere ve Hangi Amaçla Aktarılabileceği
|
||||
Toplanan kişisel verileriniz; yasal yükümlülüklerimizin yerine getirilmesi, hizmetlerimizin sağlanabilmesi ve müşteri memnuniyeti süreçleri dahilinde; iş ortaklarımıza, tedarikçilerimize, kanunen yetkili kamu kurumlarına ve özel kişilere Kanun’un 8. ve 9. maddelerinde belirtilen şartlar dahilinde aktarılabilecektir.
|
||||
|
||||
3. Kişisel Veri Toplamanın Yöntemi ve Hukuki Sebebi
|
||||
Kişisel verileriniz, web sitemiz, rezervasyon formları, e-posta iletişimleri ve otel resepsiyonu gibi kanallar aracılığıyla fiziksel veya elektronik ortamda toplanmaktadır.
|
||||
|
||||
4. Veri Sahibinin Hakları
|
||||
KVKK’nın 11. maddesi uyarınca;
|
||||
- Kişisel veri işlenip işlenmediğini öğrenme,
|
||||
- Kişisel veriler işlenmişse buna ilişkin bilgi talep etme,
|
||||
- Amacına uygun kullanılıp kullanılmadığını öğrenme,
|
||||
- Yurt içinde veya yurt dışında aktarıldığı üçüncü kişileri bilme,
|
||||
- Eksik veya yanlış işlenmişse düzeltilmesini isteme haklarına sahipsiniz.
|
||||
|
||||
Detaylı bilgi ve talepleriniz için info@kitebeachakyaka.com.tr adresi üzerinden bizimle iletişime geçebilirsiniz.`,
|
||||
},
|
||||
en: {
|
||||
title: "Personal Data Protection",
|
||||
subtitle: "Information Text on the Protection of Personal Data",
|
||||
text: `As Kite Beach Akyaka, we attach great importance to the security of your personal data. In accordance with the Personal Data Protection Law No. 6698 ("Law"), your personal data may be processed by Kite Beach Akyaka as the data controller within the scope described below.
|
||||
|
||||
1. Purpose of Processing Personal Data
|
||||
Your personal data is processed to;
|
||||
- Carry out accommodation in our hotel and activities in our kitesurf school,
|
||||
- Customize and recommend the products and services offered to you according to your tastes, usage habits, and needs,
|
||||
- Manage reservation, communication, and customer satisfaction processes,
|
||||
- Fulfill legal obligations in accordance with the relevant legislation.
|
||||
|
||||
2. To Whom and for What Purpose the Processed Personal Data Can Be Transferred
|
||||
Your collected personal data may be transferred to our business partners, suppliers, legally authorized public institutions, and private persons within the conditions specified in Articles 8 and 9 of the Law in order to fulfill our legal obligations, provide our services, and within customer satisfaction processes.
|
||||
|
||||
3. Method and Legal Reason for Collecting Personal Data
|
||||
Your personal data is collected in physical or electronic environment through channels such as our website, reservation forms, email communications, and hotel reception.
|
||||
|
||||
4. Rights of the Data Subject
|
||||
In accordance with Article 11 of the KVKK, you have the right to;
|
||||
- Learn whether personal data is processed,
|
||||
- Request information if personal data has been processed,
|
||||
- Learn the purpose of processing personal data and whether they are used appropriately,
|
||||
- Know the third parties to whom personal data is transferred domestically or abroad,
|
||||
- Request the correction of personal data if it is incomplete or improperly processed.
|
||||
|
||||
For detailed information and requests, you can contact us at info@kitebeachakyaka.com.tr.`
|
||||
}
|
||||
};
|
||||
|
||||
const t = content[lang as keyof typeof content] || content.tr;
|
||||
|
||||
return (
|
||||
<div className="pt-32 pb-20 bg-background min-h-screen">
|
||||
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<h1 className="font-serif text-4xl md:text-5xl font-bold text-dark mb-4">{t.title}</h1>
|
||||
<h2 className="text-xl text-primary font-medium mb-10">{t.subtitle}</h2>
|
||||
<div className="prose prose-lg text-gray-600">
|
||||
{t.text.split('\n\n').map((paragraph, index) => (
|
||||
<p key={index} className="mb-6 whitespace-pre-line leading-relaxed">
|
||||
{paragraph}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Inter, Playfair_Display } from "next/font/google";
|
||||
import "../globals.css";
|
||||
import Navbar from "@/components/Navbar";
|
||||
import Footer from "@/components/Footer";
|
||||
import WhatsAppButton from "@/components/WhatsAppButton";
|
||||
|
||||
const inter = Inter({
|
||||
variable: "--font-inter",
|
||||
subsets: ["latin"],
|
||||
});
|
||||
|
||||
const playfair = Playfair_Display({
|
||||
variable: "--font-playfair",
|
||||
subsets: ["latin"],
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Kite Beach Akyaka | Kitesurf & Butik Otel",
|
||||
description: "Nehrin huzuru, denizin enerjisi — tek bir noktada. Kite Beach Akyaka butik otel ve kitesurf merkezine hoş geldiniz.",
|
||||
};
|
||||
|
||||
export async function generateStaticParams() {
|
||||
return [{ lang: 'tr' }, { lang: 'en' }]
|
||||
}
|
||||
|
||||
export default async function RootLayout({
|
||||
children,
|
||||
params,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
params: Promise<{ lang: string }>;
|
||||
}>) {
|
||||
const { lang } = await params;
|
||||
return (
|
||||
<html
|
||||
lang={lang}
|
||||
className={`${inter.variable} ${playfair.variable} h-full antialiased scroll-smooth`}
|
||||
suppressHydrationWarning
|
||||
>
|
||||
<body className="min-h-full flex flex-col bg-background text-foreground" suppressHydrationWarning>
|
||||
<Navbar />
|
||||
<main className="flex-grow">{children}</main>
|
||||
<Footer />
|
||||
<WhatsAppButton />
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,160 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { Check, Wifi, Wind, Coffee, Eye, Trees } from "lucide-react";
|
||||
import ScrollReveal from "@/components/ScrollReveal";
|
||||
|
||||
const rooms = [
|
||||
{
|
||||
img: "https://images.unsplash.com/photo-1582719478250-c89404bb8a0e?q=80&w=2940&auto=format&fit=crop",
|
||||
tag: "Standart",
|
||||
name: "Standart Oda",
|
||||
desc: "Konforlu ve modern tasarımlı standart odalarımızda rahatlığın tadını çıkarın. Çift kişilik yatak ve şık dekorasyon ile dinlendirici bir atmosfer.",
|
||||
sqm: "20 m²",
|
||||
price: "₺4.500",
|
||||
features: [
|
||||
{ icon: Wifi, label: "Ücretsiz Wi-Fi" },
|
||||
{ icon: Wind, label: "Klima" },
|
||||
{ icon: Coffee, label: "Minibar" },
|
||||
{ icon: Eye, label: "Bahçe Manzarası" },
|
||||
],
|
||||
reversed: false,
|
||||
},
|
||||
{
|
||||
img: "https://images.unsplash.com/photo-1566665797739-1674de7a421a?q=80&w=2874&auto=format&fit=crop",
|
||||
tag: "Popüler",
|
||||
name: "Nehir Manzaralı Oda",
|
||||
desc: "Güne Azmak nehrinin eşsiz manzarası eşliğinde uyanacağınız ferah odalar. Balkonunuzda sabah kahvenizi yudumlarken doğanın sesini dinleyin.",
|
||||
sqm: "25 m²",
|
||||
price: "₺5.500",
|
||||
features: [
|
||||
{ icon: Eye, label: "Nehir Manzarası" },
|
||||
{ icon: Trees, label: "Özel Balkon" },
|
||||
{ icon: Coffee, label: "Nespresso Makinesi" },
|
||||
{ icon: Wifi, label: "Ücretsiz Wi-Fi" },
|
||||
],
|
||||
reversed: true,
|
||||
},
|
||||
{
|
||||
img: "https://images.unsplash.com/photo-1499955085172-a104c9463ece?q=80&w=2940&auto=format&fit=crop",
|
||||
tag: "Premium",
|
||||
name: "Ahşap Bungalow",
|
||||
desc: "Doğayla tamamen iç içe, bağımsız girişli ve teraslı ahşap tasarımlı yaşam alanı. Gizlilik ve huzur arayan çiftler için ideal.",
|
||||
sqm: "35 m²",
|
||||
price: "₺7.000",
|
||||
features: [
|
||||
{ icon: Trees, label: "Özel Teras" },
|
||||
{ icon: Eye, label: "Doğa Manzarası" },
|
||||
{ icon: Coffee, label: "Premium İkramlar" },
|
||||
{ icon: Wind, label: "Klima" },
|
||||
],
|
||||
reversed: false,
|
||||
},
|
||||
];
|
||||
|
||||
export default function OdalarPage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-background">
|
||||
|
||||
{/* Page Header */}
|
||||
<section className="relative h-[55vh] w-full flex items-end overflow-hidden">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1582719478250-c89404bb8a0e?q=80&w=2940&auto=format&fit=crop"
|
||||
alt="Odalarımız"
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-dark/85 via-dark/30 to-black/20" />
|
||||
</div>
|
||||
<div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-14 w-full">
|
||||
<span className="block text-accent text-xs tracking-[0.3em] uppercase font-semibold mb-3 animate-fade-up">
|
||||
Konaklama
|
||||
</span>
|
||||
<h1 className="font-serif text-5xl md:text-7xl text-white font-bold animate-fade-up delay-100">
|
||||
Odalarımız
|
||||
</h1>
|
||||
<p className="text-white/60 text-lg mt-3 font-light animate-fade-up delay-200">
|
||||
Doğanın içinde, konforlu bir mola.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Room Listings */}
|
||||
<section className="py-20 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="space-y-16">
|
||||
{rooms.map((room, i) => (
|
||||
<ScrollReveal key={i}>
|
||||
<div
|
||||
className={`grid grid-cols-1 md:grid-cols-2 gap-0 bg-white rounded-3xl overflow-hidden shadow-sm border border-sand ${
|
||||
room.reversed ? "" : ""
|
||||
}`}
|
||||
>
|
||||
{/* Image */}
|
||||
<div className={`relative h-80 md:h-auto ${room.reversed ? "md:order-2" : ""}`}>
|
||||
<Image
|
||||
src={room.img}
|
||||
alt={room.name}
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
{/* Tag */}
|
||||
<span className="absolute top-5 left-5 bg-dark/80 backdrop-blur-sm text-white text-[10px] font-bold px-3 py-1.5 rounded-full tracking-widest uppercase">
|
||||
{room.tag}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<div className={`p-10 md:p-14 flex flex-col justify-center ${room.reversed ? "md:order-1" : ""}`}>
|
||||
<span className="text-muted text-xs tracking-[0.2em] uppercase mb-3 block">{room.sqm}</span>
|
||||
<h2 className="font-serif text-3xl font-bold text-dark mb-4">{room.name}</h2>
|
||||
<p className="text-gray-500 mb-8 leading-relaxed text-[15px]">{room.desc}</p>
|
||||
|
||||
<div className="grid grid-cols-2 gap-3 mb-10">
|
||||
{room.features.map(({ icon: Icon, label }, j) => (
|
||||
<div key={j} className="flex items-center gap-2.5">
|
||||
<div className="w-7 h-7 rounded-full bg-primary/8 flex items-center justify-center flex-shrink-0">
|
||||
<Icon size={13} className="text-primary" />
|
||||
</div>
|
||||
<span className="text-[13px] text-foreground/70">{label}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="flex justify-between items-center pt-8 border-t border-sand">
|
||||
<div>
|
||||
<span className="text-muted text-xs block mb-1 uppercase tracking-wider">Gecelik</span>
|
||||
<span className="font-serif text-3xl font-bold text-dark">{room.price}</span>
|
||||
</div>
|
||||
<Link
|
||||
href="/iletisim"
|
||||
className="btn-shimmer bg-accent text-white px-7 py-3.5 rounded-full text-[11px] font-bold tracking-[0.12em] uppercase hover:bg-accent/90 transition-colors shadow-lg"
|
||||
>
|
||||
Rezervasyon Yap
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Info strip */}
|
||||
<section className="py-16 bg-primary">
|
||||
<div className="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
||||
<h3 className="font-serif text-3xl text-white font-bold mb-4">
|
||||
Tüm odalarda dahil olanlar
|
||||
</h3>
|
||||
<div className="flex flex-wrap justify-center gap-4 mt-8">
|
||||
{["Organik Serpme Kahvaltı", "Ücretsiz Otopark", "Plaj & Nehir Erişimi", "Şezlong & Havlu", "Wi-Fi", "24/7 Resepsiyon"].map((item) => (
|
||||
<span key={item} className="inline-flex items-center gap-2 bg-white/10 text-white text-[13px] px-4 py-2 rounded-full border border-white/15">
|
||||
<Check size={13} className="text-accent" />
|
||||
{item}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,557 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import * as Icons from "lucide-react";
|
||||
import { ArrowRight, Star } from "lucide-react";
|
||||
import ScrollReveal from "@/components/ScrollReveal";
|
||||
|
||||
import HeroVideo from "@/components/HeroVideo";
|
||||
|
||||
const defaultFeatures = [
|
||||
{ icon: "Wind", label: "Kitesurf Okulu", sub: "IKO Sertifikalı" },
|
||||
{ icon: "Anchor", label: "Yoga Platformu", sub: "Nehir Kenarı" },
|
||||
{ icon: "Utensils", label: "Restoran & Bar", sub: "Ege Mutfağı" },
|
||||
{ icon: "BedDouble", label: "Butik Odalar", sub: "3 Tip Konaklama" },
|
||||
{ icon: "Sun", label: "Gün Batımı Terası", sub: "Gökova Manzarası" },
|
||||
];
|
||||
|
||||
const rooms = [
|
||||
{
|
||||
img: "https://images.unsplash.com/photo-1582719478250-c89404bb8a0e?q=80&w=2940&auto=format&fit=crop",
|
||||
badge: "Standart",
|
||||
badgeStyle: "bg-white/90 text-dark",
|
||||
name: "Standart Oda",
|
||||
desc: "Konforlu ve modern tasarımlı odamızda huzurlu bir konaklama.",
|
||||
price: "₺4.500",
|
||||
cta: "primary" as const,
|
||||
},
|
||||
{
|
||||
img: "https://images.unsplash.com/photo-1566665797739-1674de7a421a?q=80&w=2874&auto=format&fit=crop",
|
||||
badge: "Popüler",
|
||||
badgeStyle: "bg-accent text-white",
|
||||
name: "Nehir Manzaralı Oda",
|
||||
desc: "Azmak nehrinin eşsiz manzarası eşliğinde güne uyanın.",
|
||||
price: "₺5.500",
|
||||
cta: "accent" as const,
|
||||
},
|
||||
{
|
||||
img: "https://images.unsplash.com/photo-1499955085172-a104c9463ece?q=80&w=2940&auto=format&fit=crop",
|
||||
badge: "Premium",
|
||||
badgeStyle: "bg-white/90 text-dark",
|
||||
name: "Ahşap Bungalow",
|
||||
desc: "Doğayla tamamen iç içe, teraslı ve bağımsız girişli.",
|
||||
price: "₺7.000",
|
||||
cta: "primary" as const,
|
||||
},
|
||||
];
|
||||
|
||||
const testimonials = [
|
||||
{
|
||||
text: "Akyaka'da pek çok yerde kaldım ama Kite Beach bambaşka bir deneyimdi. Nehrin sesi, kitesurf dersleri ve muhteşem kahvaltı — her şey mükemmeldi.",
|
||||
name: "Ayşe K.",
|
||||
from: "İstanbul",
|
||||
},
|
||||
{
|
||||
text: "Yoga seansları ahşap platformda, sabah erken saatte, nehir manzarası eşliğinde. Kelimelerle anlatmak zor — mutlaka yaşanmalı.",
|
||||
name: "Marco B.",
|
||||
from: "İtalya",
|
||||
},
|
||||
{
|
||||
text: "Eğitmenler son derece ilgili. Kitesurf derslerimden sonra bağımlısı oldum. Önümüzdeki yaz mutlaka döneceğim.",
|
||||
name: "Mehmet Ö.",
|
||||
from: "Ankara",
|
||||
},
|
||||
];
|
||||
|
||||
import { getDictionary, Locale } from "./dictionaries";
|
||||
import prisma from "@/lib/prisma";
|
||||
|
||||
export default async function Home({ params }: { params: Promise<{ lang: string }> }) {
|
||||
const { lang } = await params;
|
||||
const dict = await getDictionary(lang as Locale);
|
||||
|
||||
const heroDb = await prisma.heroSection.findUnique({ where: { lang } });
|
||||
const heroData = heroDb || {
|
||||
location: dict.home.location,
|
||||
welcome: dict.home.welcome,
|
||||
title: dict.home.title,
|
||||
subtitle: dict.home.subtitle,
|
||||
bookNow: dict.home.bookNow,
|
||||
exploreActivities: dict.home.exploreActivities,
|
||||
scroll: dict.home.scroll,
|
||||
};
|
||||
|
||||
const activities = await prisma.activity.findMany({ where: { lang }, orderBy: { order: "asc" } });
|
||||
const events = await prisma.event.findMany({ where: { lang }, orderBy: { date: "asc" } });
|
||||
const dbFeatures = await prisma.feature.findMany({ where: { lang }, orderBy: { order: "asc" } });
|
||||
|
||||
const aboutDb = await prisma.aboutSection.findUnique({ where: { lang } });
|
||||
const aboutData = aboutDb || {
|
||||
badge: lang === "en" ? "Our Story" : "Hikayemiz",
|
||||
titleLine1: lang === "en" ? "In the" : "Doğanın",
|
||||
titleLine2: lang === "en" ? "Heart of Nature" : "Kalbinde",
|
||||
titleHighlight: lang === "en" ? "A Special Escape" : "Özel Bir Kaçış",
|
||||
description1: lang === "en"
|
||||
? "Located right on the banks of the Azmak River flowing into the crystal waters of the Gulf of Gokova, we are in a unique location where the wind never ceases."
|
||||
: "Gökova Körfezi'nin kristal sularına dökülen Azmak Nehri'nin hemen kıyısında, rüzgarın hiç eksik olmadığı eşsiz bir konumda yer alıyoruz.",
|
||||
description2: lang === "en"
|
||||
? "Kite Beach Akyaka offers a unique living space that integrates the passion for kitesurfing with nature, comfort, and local flavors."
|
||||
: "Kite Beach Akyaka; kitesurf tutkusunu doğayla, konforla ve yerel lezzetlerle bütünleştiren benzersiz bir yaşam alanı sunar.",
|
||||
image: "https://images.unsplash.com/photo-1544551763-46a013bb70d5?q=80&w=2940&auto=format&fit=crop",
|
||||
statsGuestCount: "500+",
|
||||
statsGuestLabel: lang === "en" ? "Happy Guests" : "Mutlu Misafir",
|
||||
statsYearCount: "10+",
|
||||
statsYearLabel: lang === "en" ? "Years Experience" : "Yıl Deneyim",
|
||||
badgeIkoTitle: "IKO",
|
||||
badgeIkoLabel: lang === "en" ? "Certified" : "Sertifikalı"
|
||||
};
|
||||
|
||||
const displayFeatures = dbFeatures.length > 0 ? dbFeatures : defaultFeatures;
|
||||
|
||||
return (
|
||||
<div className="flex flex-col min-h-screen">
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
HERO
|
||||
────────────────────────────────────────── */}
|
||||
<section className="relative h-screen w-full flex items-center justify-center overflow-hidden">
|
||||
<HeroVideo />
|
||||
|
||||
{/* Floating season badge
|
||||
<div className="absolute top-32 right-6 md:right-16 z-20 animate-float hidden sm:block">
|
||||
<div className="bg-white/10 backdrop-blur-md border border-white/20 rounded-2xl px-5 py-4 text-white">
|
||||
<span className="block text-accent font-bold text-[10px] tracking-[0.25em] uppercase mb-1">Sezon</span>
|
||||
<span className="font-serif text-xl font-medium">Nisan — Ekim</span>
|
||||
</div>
|
||||
</div>
|
||||
*/}
|
||||
<div className="relative z-10 text-center px-4 max-w-5xl mx-auto">
|
||||
<div className="animate-fade-up delay-100">
|
||||
<span className="inline-block text-white/60 text-xs tracking-[0.35em] uppercase mb-8 font-light">
|
||||
{heroData.location}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center gap-4 md:gap-6 mb-6 animate-fade-up delay-200">
|
||||
<span
|
||||
className="text-xs md:text-sm tracking-[0.4em] font-bold uppercase whitespace-nowrap text-white/90"
|
||||
style={{ writingMode: 'vertical-rl', transform: 'rotate(180deg)' }}
|
||||
>
|
||||
{heroData.welcome}
|
||||
</span>
|
||||
<h1 className="font-sans font-black text-white leading-none tracking-tighter text-[clamp(4rem,10vw,10rem)] uppercase">
|
||||
{heroData.title}
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<p className="animate-fade-up delay-500 text-white/75 text-base md:text-xl mb-10 font-light italic tracking-wide">
|
||||
{heroData.subtitle}
|
||||
</p>
|
||||
|
||||
<div className="animate-fade-up delay-600 flex flex-col sm:flex-row items-center justify-center gap-4">
|
||||
<Link
|
||||
href={`/${lang}/iletisim`}
|
||||
className="btn-shimmer bg-accent text-white px-10 py-4 rounded-full text-xs font-bold tracking-[0.15em] uppercase shadow-2xl hover:bg-accent/90 transition-colors w-full sm:w-auto text-center"
|
||||
>
|
||||
{heroData.bookNow}
|
||||
</Link>
|
||||
<Link
|
||||
href={`/${lang}/aktiviteler`}
|
||||
className="bg-white/10 backdrop-blur-sm border border-white/30 text-white px-10 py-4 rounded-full text-xs font-bold tracking-[0.15em] uppercase hover:bg-white/20 transition-colors w-full sm:w-auto text-center"
|
||||
>
|
||||
{heroData.exploreActivities}
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Scroll indicator */}
|
||||
<div className="absolute bottom-10 left-1/2 -translate-x-1/2 z-20 flex flex-col items-center gap-3">
|
||||
<span className="text-white/40 text-[10px] tracking-[0.3em] uppercase">{heroData.scroll}</span>
|
||||
<div className="w-px h-12 bg-gradient-to-b from-white/40 to-transparent animate-scroll-bounce" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
FEATURES STRIP
|
||||
────────────────────────────────────────── */}
|
||||
<section className="bg-dark text-white py-8">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="grid grid-cols-2 md:grid-cols-5 divide-x divide-white/8">
|
||||
{displayFeatures.map(({ icon, label, sub }, i) => {
|
||||
const IconComponent = (Icons as any)[icon as string] || Icons.Star;
|
||||
return (
|
||||
<div
|
||||
key={i}
|
||||
className={`flex flex-col items-center justify-center gap-2 py-6 px-4 group ${i >= 2 ? "hidden md:flex" : ""}`}
|
||||
>
|
||||
<IconComponent className="w-5 h-5 text-accent group-hover:scale-110 transition-transform duration-300" />
|
||||
<span className="text-[13px] font-semibold text-center">{label}</span>
|
||||
<span className="text-[11px] text-white/40 text-center">{sub}</span>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
ABOUT
|
||||
────────────────────────────────────────── */}
|
||||
<section className="py-28 bg-background overflow-hidden">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-16 lg:gap-24 items-center">
|
||||
|
||||
<ScrollReveal className="relative">
|
||||
<div className="relative h-[540px] lg:h-[660px] rounded-3xl overflow-hidden shadow-2xl">
|
||||
<Image
|
||||
src={aboutData.image}
|
||||
alt={aboutData.badge}
|
||||
fill
|
||||
sizes="(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw"
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
{/* Stats card */}
|
||||
<div className="absolute -bottom-5 -right-4 md:-right-8 bg-white rounded-2xl p-6 shadow-xl border border-sand">
|
||||
<div className="grid grid-cols-2 gap-6 divide-x divide-sand">
|
||||
<div className="text-center">
|
||||
<span className="block font-serif text-3xl font-bold text-primary">{aboutData.statsGuestCount}</span>
|
||||
<span className="block text-[10px] text-muted uppercase tracking-wider mt-1">{aboutData.statsGuestLabel}</span>
|
||||
</div>
|
||||
<div className="text-center pl-6">
|
||||
<span className="block font-serif text-3xl font-bold text-primary">{aboutData.statsYearCount}</span>
|
||||
<span className="block text-[10px] text-muted uppercase tracking-wider mt-1">{aboutData.statsYearLabel}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* IKO badge */}
|
||||
<div className="absolute -top-4 -left-4 bg-accent text-white rounded-2xl p-4 shadow-lg">
|
||||
<Star className="w-4 h-4 mb-1" fill="white" />
|
||||
<span className="block text-xs font-bold leading-none">{aboutData.badgeIkoTitle}</span>
|
||||
<span className="block text-[10px] opacity-80 mt-0.5">{aboutData.badgeIkoLabel}</span>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
|
||||
<ScrollReveal delay={200}>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-5">
|
||||
{aboutData.badge}
|
||||
</span>
|
||||
<h2 className="font-serif text-4xl md:text-5xl lg:text-6xl font-bold text-dark leading-[1.05] mb-8">
|
||||
{aboutData.titleLine1}<br />{aboutData.titleLine2}<br />
|
||||
<span className="text-primary italic">{aboutData.titleHighlight}</span>
|
||||
</h2>
|
||||
<p className="text-gray-600 leading-relaxed mb-5">
|
||||
{aboutData.description1}
|
||||
</p>
|
||||
<p className="text-gray-600 leading-relaxed mb-10">
|
||||
{aboutData.description2}
|
||||
</p>
|
||||
<div className="section-line mb-8" />
|
||||
<Link
|
||||
href="/hakkimizda"
|
||||
className="inline-flex items-center gap-2 text-dark font-bold text-sm tracking-wide group"
|
||||
>
|
||||
<span className="border-b-2 border-accent pb-0.5">Hikayemizi Okuyun</span>
|
||||
<ArrowRight className="w-4 h-4 group-hover:translate-x-1.5 transition-transform" />
|
||||
</Link>
|
||||
</ScrollReveal>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
ROOMS
|
||||
────────────────────────────────────────── */}
|
||||
{/*
|
||||
<section className="py-28 bg-white">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<ScrollReveal className="text-center mb-16">
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
|
||||
Konaklama
|
||||
</span>
|
||||
<h2 className="font-serif text-4xl md:text-5xl font-bold text-dark mb-6">Kite Beach Akyaka Otel</h2>
|
||||
<p className="text-muted max-w-3xl mx-auto text-sm leading-relaxed">
|
||||
Akyaka’nın en güzel köşesinde, nehrin dinginliği ile denizin sonsuz maviliğinin kucaklaştığı o özel noktadayız. Kapınızı açtığınız anda sizi karşılayan nehir kıyısının sessizliği, güne başlamak için en huzurlu davetiniz olacak. Doğanın kalbinde, nehir manzarasına karşı yaptığınız bir yoga seansıyla ruhunuzu dengelerken; hemen ardından Akyaka’nın meşhur rüzgarlarında Kite Surf ile adrenalini zirveye taşıyabilirsiniz. Günün yorgunluğunu ise, restoranımızın mutfağından çıkan lezzetlerle, Ege’nin kendine has o büyüleyici gün batımını izleyerek geride bırakın. Burada zaman, sadece sizin istediğiniz hızda akıyor.
|
||||
</p>
|
||||
</ScrollReveal>
|
||||
|
||||
<ScrollReveal stagger className="grid grid-cols-1 md:grid-cols-3 gap-6 md:gap-8">
|
||||
{rooms.map((room, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className={`card-lift group rounded-2xl overflow-hidden bg-sand border border-sand ${i === 1 ? "md:-mt-4 md:shadow-xl" : ""
|
||||
}`}
|
||||
>
|
||||
<div className="relative h-64 overflow-hidden">
|
||||
<Image
|
||||
src={room.img}
|
||||
alt={room.name}
|
||||
fill
|
||||
className="object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
/>
|
||||
<span className={`absolute top-4 left-4 text-[10px] font-bold px-3 py-1.5 rounded-full tracking-wider uppercase ${room.badgeStyle} backdrop-blur-sm`}>
|
||||
{room.badge}
|
||||
</span>
|
||||
</div>
|
||||
<div className="p-7">
|
||||
<h3 className="font-serif text-xl font-bold text-dark mb-2">{room.name}</h3>
|
||||
<p className="text-muted mb-6 text-[13px] leading-relaxed">{room.desc}</p>
|
||||
<div className="flex justify-between items-center pt-5 border-t border-sand">
|
||||
<div>
|
||||
<span className="text-2xl font-bold text-dark">{room.price}</span>
|
||||
<span className="text-muted text-xs ml-1">/gece</span>
|
||||
</div>
|
||||
<Link
|
||||
href="/odalar"
|
||||
className={`text-[11px] px-5 py-2.5 rounded-full font-bold tracking-wider uppercase transition-colors ${room.cta === "accent"
|
||||
? "bg-accent text-white hover:bg-accent/90"
|
||||
: "bg-primary text-white hover:bg-primary/90"
|
||||
}`}
|
||||
>
|
||||
İncele
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</ScrollReveal>
|
||||
|
||||
<div className="text-center mt-12">
|
||||
<Link
|
||||
href="/odalar"
|
||||
className="inline-flex items-center gap-2 border-2 border-dark text-dark text-xs px-8 py-3.5 rounded-full font-bold uppercase tracking-widest hover:bg-dark hover:text-white transition-colors"
|
||||
>
|
||||
Tüm Odaları Gör
|
||||
<ArrowRight className="w-3.5 h-3.5" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
*/}
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
ACTIVITIES — BENTO GRID
|
||||
────────────────────────────────────────── */}
|
||||
<section className="py-28 bg-background">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<ScrollReveal className="flex flex-col md:flex-row md:items-end md:justify-between gap-6 mb-10">
|
||||
<div>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
|
||||
Ne Yapacaksınız?
|
||||
</span>
|
||||
<h2 className="font-serif text-5xl font-bold text-dark">Aktiviteler</h2>
|
||||
</div>
|
||||
<Link
|
||||
href="/aktiviteler"
|
||||
className="inline-flex items-center gap-2 text-sm font-semibold text-primary hover:text-accent transition-colors"
|
||||
>
|
||||
Tümünü Gör <ArrowRight className="w-4 h-4" />
|
||||
</Link>
|
||||
</ScrollReveal>
|
||||
|
||||
{/* Bento rows */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
{activities.length > 0 ? (
|
||||
activities.map((act, i) => (
|
||||
<ScrollReveal
|
||||
key={act.id}
|
||||
className={i === 0 || i === 3 ? "md:col-span-2" : ""}
|
||||
delay={i * 50}
|
||||
>
|
||||
<Link href="/aktiviteler" className={`group relative block rounded-3xl overflow-hidden ${i < 2 ? "h-[400px]" : "h-[280px]"}`}>
|
||||
<Image
|
||||
src={act.image}
|
||||
alt={act.title}
|
||||
fill
|
||||
className="object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
/>
|
||||
<div className={`absolute inset-0 bg-gradient-to-t ${i === 0 ? "from-dark/90 via-dark/20" : "from-dark/80"} to-transparent`} />
|
||||
<div className={`absolute bottom-0 ${i === 0 || i === 3 ? "p-8" : "p-7"}`}>
|
||||
{act.badge && (
|
||||
<span className="block text-accent text-[10px] tracking-[0.25em] uppercase font-bold mb-2">{act.badge}</span>
|
||||
)}
|
||||
<h3 className={`font-serif text-white font-bold mb-1 ${i === 0 ? "text-4xl mb-2" : i === 1 || i === 3 ? "text-3xl" : "text-2xl"}`}>{act.title}</h3>
|
||||
{i === 0 && (
|
||||
<p className="text-white/60 text-sm mb-4 max-w-xs opacity-0 translate-y-2 group-hover:opacity-100 group-hover:translate-y-0 transition-all duration-400">
|
||||
{act.description}
|
||||
</p>
|
||||
)}
|
||||
{i !== 0 && (
|
||||
<span className="text-white/60 text-xs">{act.price}</span>
|
||||
)}
|
||||
{i === 0 && (
|
||||
<span className="inline-flex items-center gap-2 text-white text-sm font-semibold">
|
||||
{act.price} <ArrowRight className="w-3.5 h-3.5" />
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
</Link>
|
||||
</ScrollReveal>
|
||||
))
|
||||
) : (
|
||||
<div className="md:col-span-3 py-10 text-center text-gray-500">Henüz aktivite eklenmedi.</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
EVENTS (PREVIEW)
|
||||
────────────────────────────────────────── */}
|
||||
<section className="py-28 bg-dark text-white relative overflow-hidden">
|
||||
{/* Background glow */}
|
||||
<div className="absolute top-0 right-0 w-96 h-96 bg-accent/20 rounded-full blur-[120px] pointer-events-none" />
|
||||
<div className="absolute bottom-0 left-0 w-[500px] h-[500px] bg-primary/20 rounded-full blur-[150px] pointer-events-none" />
|
||||
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
|
||||
<ScrollReveal className="flex flex-col md:flex-row md:items-end md:justify-between gap-6 mb-16">
|
||||
<div>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
|
||||
Takvim
|
||||
</span>
|
||||
<h2 className="font-serif text-5xl font-bold">Etkinlikler</h2>
|
||||
</div>
|
||||
<Link
|
||||
href="/etkinlikler"
|
||||
className="inline-flex items-center gap-2 text-sm font-semibold text-white/70 hover:text-white transition-colors border border-white/20 hover:border-white px-6 py-2.5 rounded-full"
|
||||
>
|
||||
Tüm Etkinlikler <ArrowRight className="w-4 h-4" />
|
||||
</Link>
|
||||
</ScrollReveal>
|
||||
|
||||
<ScrollReveal delay={100}>
|
||||
{events.length > 0 ? (
|
||||
events.map((ev) => (
|
||||
<div key={ev.id} className="group relative flex flex-col md:flex-row gap-8 bg-white/5 border border-white/10 rounded-3xl p-6 md:p-10 hover:bg-white/10 transition-colors backdrop-blur-sm mb-6">
|
||||
<div className="relative w-full md:w-1/3 h-[250px] md:h-auto rounded-2xl overflow-hidden shrink-0">
|
||||
<Image
|
||||
src={ev.image}
|
||||
alt={ev.title}
|
||||
fill
|
||||
className="object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col justify-center w-full md:w-2/3">
|
||||
{ev.badge && (
|
||||
<div className="inline-block bg-accent/20 text-accent text-[10px] font-bold px-3 py-1.5 rounded-full tracking-widest uppercase mb-4 w-max">
|
||||
{ev.badge}
|
||||
</div>
|
||||
)}
|
||||
<h3 className="font-serif text-3xl md:text-4xl font-bold mb-4">{ev.title}</h3>
|
||||
<p className="text-white/60 leading-relaxed mb-6 max-w-xl">
|
||||
{ev.description}
|
||||
</p>
|
||||
<div className="flex flex-wrap items-center gap-6 mb-8 text-sm text-white/80">
|
||||
<span className="flex items-center gap-2">
|
||||
<span className="w-2 h-2 rounded-full bg-accent" /> {ev.date}
|
||||
</span>
|
||||
<span className="flex items-center gap-2">
|
||||
<span className="w-2 h-2 rounded-full bg-accent" /> {ev.time}
|
||||
</span>
|
||||
<span className="flex items-center gap-2">
|
||||
<span className="w-2 h-2 rounded-full bg-accent" /> {ev.location}
|
||||
</span>
|
||||
</div>
|
||||
<Link
|
||||
href="/etkinlikler"
|
||||
className="inline-flex items-center gap-2 text-xs font-bold tracking-widest uppercase text-accent hover:text-white transition-colors w-max"
|
||||
>
|
||||
Detayları İncele <ArrowRight className="w-4 h-4" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="py-10 text-center text-white/50">Henüz etkinlik eklenmedi.</div>
|
||||
)}
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
TESTIMONIALS
|
||||
────────────────────────────────────────── */}
|
||||
<section className="py-28 bg-white">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<ScrollReveal className="text-center mb-16">
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-4">
|
||||
Misafir Yorumları
|
||||
</span>
|
||||
<h2 className="font-serif text-5xl font-bold text-dark">Deneyimler</h2>
|
||||
</ScrollReveal>
|
||||
|
||||
<ScrollReveal stagger className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
{testimonials.map((t, i) => (
|
||||
<div key={i} className="relative bg-sand rounded-2xl p-8 border border-sand overflow-hidden">
|
||||
{/* Large decorative quote */}
|
||||
<span className="absolute top-3 right-5 font-serif text-[8rem] leading-none text-primary/8 select-none">
|
||||
"
|
||||
</span>
|
||||
{/* Stars */}
|
||||
<div className="flex gap-1 mb-5 relative z-10">
|
||||
{Array.from({ length: 5 }).map((_, j) => (
|
||||
<Star key={j} className="w-3.5 h-3.5 text-accent" fill="#E87040" />
|
||||
))}
|
||||
</div>
|
||||
<p className="text-foreground/75 text-[13px] leading-relaxed mb-6 relative z-10 italic">
|
||||
"{t.text}"
|
||||
</p>
|
||||
<div className="flex items-center gap-3 relative z-10">
|
||||
<div className="w-9 h-9 bg-primary/10 rounded-full flex items-center justify-center flex-shrink-0">
|
||||
<span className="text-primary font-bold text-sm">{t.name[0]}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className="block font-semibold text-dark text-sm">{t.name}</span>
|
||||
<span className="text-muted text-xs">{t.from}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* ──────────────────────────────────────────
|
||||
CTA BAND
|
||||
────────────────────────────────────────── */}
|
||||
<section className="relative py-28 overflow-hidden">
|
||||
<div
|
||||
className="absolute inset-0 animate-gradient-pan"
|
||||
style={{
|
||||
background:
|
||||
"linear-gradient(135deg, #0D3D50 0%, #1A6B8A 35%, #0E1A24 60%, #1A4A60 100%)",
|
||||
}}
|
||||
/>
|
||||
<div className="absolute inset-0 opacity-[0.04]">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1498623116890-37e912163d5d?q=80&w=2940&auto=format&fit=crop"
|
||||
alt=""
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="relative z-10 max-w-3xl mx-auto px-4 text-center">
|
||||
<ScrollReveal>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.3em] uppercase font-semibold mb-6">
|
||||
Hemen Başlayın
|
||||
</span>
|
||||
<h2 className="font-serif text-5xl md:text-6xl font-bold text-white leading-tight mb-6">
|
||||
Hayalindeki tatili<br />planlamaya hazır mısın?
|
||||
</h2>
|
||||
<p className="text-white/50 mb-10 text-base leading-relaxed">
|
||||
Rüzgar seni çağırıyor. Hemen yerini ayırt ve bu eşsiz deneyimin bir parçası ol.
|
||||
</p>
|
||||
<Link
|
||||
href="/iletisim"
|
||||
className="btn-shimmer inline-block bg-accent text-white px-12 py-4 rounded-full text-xs font-bold tracking-[0.2em] uppercase shadow-2xl hover:bg-white hover:text-dark transition-colors"
|
||||
>
|
||||
Hemen Rezervasyon Yap
|
||||
</Link>
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,161 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { Coffee, Wine, UtensilsCrossed, Clock } from "lucide-react";
|
||||
import ScrollReveal from "@/components/ScrollReveal";
|
||||
|
||||
const menuCategories = [
|
||||
{
|
||||
icon: Coffee,
|
||||
name: "Serpme Kahvaltı",
|
||||
desc: "Yöresel peynirler, ev yapımı reçeller, organik zeytinyağı ve taze pişmiş köy ekmeği ile güne enerjik başlayın.",
|
||||
hours: "08:30 – 11:30",
|
||||
highlight: "Yöresel Ürünler",
|
||||
},
|
||||
{
|
||||
icon: UtensilsCrossed,
|
||||
name: "Öğle & Akşam",
|
||||
desc: "Günlük taze deniz ürünleri, zeytinyağlı Ege mezeleri ve İtalyan mutfağından seçkin makarnalar ile akşam yemeği.",
|
||||
hours: "12:00 – 23:00",
|
||||
highlight: "Taze Ege Mutfağı",
|
||||
},
|
||||
{
|
||||
icon: Wine,
|
||||
name: "Lounge & Bar",
|
||||
desc: "Gün batımına karşı mixologist'lerimizin hazırladığı imza kokteyller, yerel şaraplar ve Türk rakısı ile keyifli anlar.",
|
||||
hours: "16:00 – 01:00",
|
||||
highlight: "Gün Batımı Manzarası",
|
||||
},
|
||||
];
|
||||
|
||||
export default function RestoranPage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-background">
|
||||
|
||||
{/* Page Header */}
|
||||
<section className="relative h-[55vh] w-full flex items-end overflow-hidden">
|
||||
<div className="absolute inset-0">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?q=80&w=2940&auto=format&fit=crop"
|
||||
alt="Restoran & Bar"
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-dark/85 via-dark/30 to-black/20" />
|
||||
</div>
|
||||
<div className="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-14 w-full">
|
||||
<span className="block text-accent text-xs tracking-[0.3em] uppercase font-semibold mb-3 animate-fade-up">
|
||||
Lezzetler
|
||||
</span>
|
||||
<h1 className="font-serif text-5xl md:text-7xl text-white font-bold animate-fade-up delay-100">
|
||||
Restoran & Bar
|
||||
</h1>
|
||||
<p className="text-white/60 text-lg mt-3 font-light animate-fade-up delay-200">
|
||||
Ege lezzetleri ve nehir manzarası.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Intro */}
|
||||
<section className="py-20 bg-white">
|
||||
<div className="max-w-3xl mx-auto px-4 sm:px-6 text-center">
|
||||
<ScrollReveal>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-5">
|
||||
Mutfağımız
|
||||
</span>
|
||||
<h2 className="font-serif text-4xl font-bold text-dark mb-6">
|
||||
Tazeden, Yerelden, Sevgiyle
|
||||
</h2>
|
||||
<p className="text-gray-500 leading-relaxed text-[15px]">
|
||||
Şeflerimizin özenle hazırladığı taze Ege mutfağı lezzetleri, organik kahvaltılıklar ve
|
||||
imza kokteyllerimizle Kite Beach Restoran'da günün her saati kendinizi şımartın.
|
||||
Azmak nehrinin hemen kenarında, ahşap terasımızda yemeğinizin tadını çıkarın.
|
||||
</p>
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Menu Categories */}
|
||||
<section className="pb-20 bg-white">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<ScrollReveal stagger className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
||||
{menuCategories.map((cat, i) => {
|
||||
const Icon = cat.icon;
|
||||
return (
|
||||
<div
|
||||
key={i}
|
||||
className="card-lift bg-background rounded-2xl p-8 border border-sand flex flex-col"
|
||||
>
|
||||
<div className="w-12 h-12 bg-primary/8 rounded-xl flex items-center justify-center mb-6">
|
||||
<Icon className="text-primary" size={22} />
|
||||
</div>
|
||||
<span className="text-accent text-[10px] font-bold tracking-[0.2em] uppercase mb-2">
|
||||
{cat.highlight}
|
||||
</span>
|
||||
<h3 className="font-serif text-xl font-bold text-dark mb-3">{cat.name}</h3>
|
||||
<p className="text-gray-500 text-[13px] leading-relaxed flex-grow mb-6">{cat.desc}</p>
|
||||
<div className="flex items-center gap-2 text-primary text-[12px] font-semibold">
|
||||
<Clock size={12} />
|
||||
{cat.hours}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Atmosphere Photos */}
|
||||
<section className="py-20 bg-background">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<ScrollReveal className="text-center mb-12">
|
||||
<h2 className="font-serif text-4xl font-bold text-dark">Atmosfer</h2>
|
||||
</ScrollReveal>
|
||||
<ScrollReveal>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<div className="relative h-80 rounded-2xl overflow-hidden md:col-span-2 group">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1544148103-0773bf10d330?q=80&w=2940&auto=format&fit=crop"
|
||||
alt="Restoran atmosferi"
|
||||
fill
|
||||
className="object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
/>
|
||||
</div>
|
||||
<div className="relative h-80 rounded-2xl overflow-hidden group">
|
||||
<Image
|
||||
src="https://images.unsplash.com/photo-1551504734-5ee1c4a1479b?q=80&w=2940&auto=format&fit=crop"
|
||||
alt="Kahvaltı"
|
||||
fill
|
||||
className="object-cover group-hover:scale-105 transition-transform duration-700"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Special Events */}
|
||||
<section className="py-20 bg-dark text-white">
|
||||
<div className="max-w-3xl mx-auto px-4 text-center">
|
||||
<ScrollReveal>
|
||||
<span className="inline-block text-accent text-xs tracking-[0.25em] uppercase font-semibold mb-5">
|
||||
Özel Günler
|
||||
</span>
|
||||
<h3 className="font-serif text-4xl font-bold mb-5">
|
||||
Özel Etkinlikler & Rezervasyonlar
|
||||
</h3>
|
||||
<p className="text-white/50 mb-8 leading-relaxed">
|
||||
Doğum günü, yıl dönümü veya özel grup yemekleriniz için nehir manzaralı
|
||||
terasımızı rezerve edebilirsiniz. Ekibimiz organizasyonunuzu özel kılmak için burada.
|
||||
</p>
|
||||
<Link
|
||||
href="/iletisim"
|
||||
className="btn-shimmer inline-block bg-accent text-white px-10 py-4 rounded-full text-xs font-bold tracking-[0.15em] uppercase"
|
||||
>
|
||||
Masa Rezervasyonu Yap
|
||||
</Link>
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user