Merge version_1 into main #2

Merged
bender merged 1 commits from version_1 into main 2026-04-15 15:23:40 +00:00

View File

@@ -29,399 +29,164 @@ export default function LandingPage() {
headingFontWeight="bold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Hakkımızda",
id: "#hakkimizda",
},
{
name: "Hizmetler",
id: "#hizmetler",
},
{
name: "Yorumlar",
id: "#yorumlar",
},
{
name: "Fiyatlar",
id: "#fiyatlar",
},
]}
brandName="Moonlight Tunalı"
button={{
text: "Randevu Al",
href: "#iletisim",
}}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Hakkımızda", id: "#hakkimizda" },
{ name: "Hizmetler", id: "#hizmetler" },
{ name: "Yorumlar", id: "#yorumlar" },
{ name: "Fiyatlar", id: "#fiyatlar" },
]}
brandName="Moonlight Tunalı"
button={{ text: "Randevu Al", href: "#iletisim" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{
variant: "gradient-bars",
}}
title="Sanatın ve Uzmanlığın Buluşma Noktası"
description="Ankara'nın kalbinde, size özel tasarlanmış profesyonel saç ve güzellik deneyimi. 20 yılı aşkın tecrübeyle ışıltınızı keşfedin."
kpis={[
{
value: "20+",
label: "Yıllık Tecrübe",
},
{
value: "4.9/5",
label: "Google Puanı",
},
{
value: "100%",
label: "Steril Hijyen",
},
]}
enableKpiAnimation={true}
buttons={[
{
text: "Hemen Randevu Al",
href: "#iletisim",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/view-beautifully-decorated-round-table-with-natural-fir-branch-candle-two-flutes-plates-against-classic-sofa-modern-apartment_132075-11394.jpg?_wi=1"
imageAlt="Moonlight Tunalı Salon İç Mekan"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/short-haired-woman-looking-into-camera-isolated-background-active-emotional-lady-black-jacket-makes-funny-face-white-backdrop_197531-18512.jpg",
alt: "Müşteri 1",
},
{
src: "http://img.b2bpic.net/free-photo/beautiful-young-woman-looking-camera-home_1301-5218.jpg",
alt: "Müşteri 2",
},
{
src: "http://img.b2bpic.net/free-photo/blond-business-woman-blue-shirt_23-2148095792.jpg",
alt: "Müşteri 3",
},
{
src: "http://img.b2bpic.net/free-photo/charming-woman-looks-into-camera-smiles-caucasian-short-haired-lady-black-jacket-laughing-posing-isolated_197531-18517.jpg",
alt: "Müşteri 4",
},
{
src: "http://img.b2bpic.net/free-photo/business-lady-looking-copyspace-with-interest_1262-2957.jpg",
alt: "Müşteri 5",
},
]}
marqueeItems={[
{
type: "text",
text: "Profesyonel Hizmet",
},
{
type: "text",
text: "Hijyenik Ortam",
},
{
type: "text",
text: "Uzman Kadro",
},
{
type: "text",
text: "Lüks Deneyim",
},
{
type: "text",
text: "Kişisel Bakım",
},
]}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitKpi
background={{ variant: "gradient-bars" }}
title="Sanatın ve Uzmanlığın Buluşma Noktası"
description="Ankara'nın kalbinde, size özel tasarlanmış profesyonel saç ve güzellik deneyimi. 20 yılı aşkın tecrübeyle ışıltınızı keşfedin."
kpis={[
{ value: "20+", label: "Yıllık Tecrübe" },
{ value: "4.9/5", label: "Google Puanı" },
{ value: "100%", label: "Steril Hijyen" },
]}
enableKpiAnimation={true}
buttons={[{ text: "Hemen Randevu Al", href: "#iletisim" }]}
imageSrc="http://img.b2bpic.net/free-photo/view-beautifully-decorated-round-table-with-natural-fir-branch-candle-two-flutes-plates-against-classic-sofa-modern-apartment_132075-11394.jpg"
imageAlt="Moonlight Tunalı Salon İç Mekan"
mediaAnimation="slide-up"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/short-haired-woman-looking-into-camera-isolated-background-active-emotional-lady-black-jacket-makes-funny-face-white-backdrop_197531-18512.jpg", alt: "Müşteri 1" },
{ src: "http://img.b2bpic.net/free-photo/beautiful-young-woman-looking-camera-home_1301-5218.jpg", alt: "Müşteri 2" },
{ src: "http://img.b2bpic.net/free-photo/blond-business-woman-blue-shirt_23-2148095792.jpg", alt: "Müşteri 3" },
{ src: "http://img.b2bpic.net/free-photo/charming-woman-looks-into-camera-smiles-caucasian-short-haired-lady-black-jacket-laughing-posing-isolated_197531-18517.jpg", alt: "Müşteri 4" },
{ src: "http://img.b2bpic.net/free-photo/business-lady-looking-copyspace-with-interest_1262-2957.jpg", alt: "Müşteri 5" },
]}
marqueeItems={[
{ type: "text", text: "Profesyonel Hizmet" },
{ type: "text", text: "Hijyenik Ortam" },
{ type: "text", text: "Uzman Kadro" },
{ type: "text", text: "Lüks Deneyim" },
{ type: "text", text: "Kişisel Bakım" },
]}
/>
</div>
<div id="hizmetler" data-section="hizmetler">
<FeatureCardEight
textboxLayout="split"
useInvertedBackground={false}
features={[
{
title: "Kusursuz Kesim & Renk",
description: "Ömer ve Mehmet Beyin tecrübesiyle hayalinizdeki form.",
imageSrc: "http://img.b2bpic.net/free-photo/professional-stylist-working-with-client_23-2147769765.jpg?_wi=1",
imageAlt: "Saç kesim ve boya",
},
{
title: "Medikal Bakım",
description: "Nevruz ve Şeyda Hanım ile hijyen odaklı profesyonel çözümler.",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-client-worker-wearing-masks-nail-salon_23-2148694577.jpg?_wi=1",
imageAlt: "Manikür ve ayak bakımı",
},
{
title: "Güzellik & Estetik",
description: "Kalıcı makyaj ve cilt bakımı ile her sabah hazır uyanın.",
imageSrc: "http://img.b2bpic.net/free-photo/woman-beauty-clinic-face-treatment_23-2148878913.jpg?_wi=1",
imageAlt: "Cilt bakımı ve estetik",
},
]}
title="Uzmanlıklarımız"
description="İhtiyacınıza uygun, kişiselleştirilmiş profesyonel dokunuşlar."
/>
</div>
<div id="hizmetler" data-section="hizmetler">
<FeatureCardEight
textboxLayout="split"
useInvertedBackground={false}
features={[
{ title: "Kusursuz Kesim & Renk", description: "Ömer ve Mehmet Beyin tecrübesiyle hayalinizdeki form.", imageSrc: "http://img.b2bpic.net/free-photo/professional-stylist-working-with-client_23-2147769765.jpg", imageAlt: "Saç kesim ve boya" },
{ title: "Medikal Bakım", description: "Nevruz ve Şeyda Hanım ile hijyen odaklı profesyonel çözümler.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-client-worker-wearing-masks-nail-salon_23-2148694577.jpg", imageAlt: "Manikür ve ayak bakımı" },
{ title: "Güzellik & Estetik", description: "Kalıcı makyaj ve cilt bakımı ile her sabah hazır uyanın.", imageSrc: "http://img.b2bpic.net/free-photo/woman-beauty-clinic-face-treatment_23-2148878913.jpg", imageAlt: "Cilt bakımı ve estetik" },
]}
title="Uzmanlıklarımız"
description="İhtiyacınıza uygun, kişiselleştirilmiş profesyonel dokunuşlar."
/>
</div>
<div id="guven" data-section="guven">
<AboutMetric
useInvertedBackground={false}
title="Neden Moonlight?"
metrics={[
{
label: "Kişiselleştirilmiş İlgi",
value: "Stil Danışmanlığı",
icon: Sparkles,
},
{
label: "Yüksek Hijyen",
value: "Bembeyaz Havlular",
icon: ShieldCheck,
},
{
label: "Profesyonel Kurtarma",
value: "Gerçek Sonuçlar",
icon: Award,
},
]}
metricsAnimation="slide-up"
/>
</div>
<div id="guven" data-section="guven">
<AboutMetric
useInvertedBackground={false}
title="Neden Moonlight?"
metrics={[
{ label: "Kişiselleştirilmiş İlgi", value: "Stil Danışmanlığı", icon: Sparkles },
{ label: "Yüksek Hijyen", value: "Bembeyaz Havlular", icon: ShieldCheck },
{ label: "Profesyonel Kurtarma", value: "Gerçek Sonuçlar", icon: Award },
]}
metricsAnimation="slide-up"
/>
</div>
<div id="fiyatlar" data-section="fiyatlar">
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "1",
badge: "Popüler",
price: "Başlayan",
subtitle: "Saç Kesim & Bakım",
features: [
"Profesyonel Kesim",
"Boya",
"Bakım Seansı",
],
buttons: [
{
text: "Detaylı Bilgi",
href: "#",
},
],
},
{
id: "2",
badge: "Bakım",
price: "Başlayan",
subtitle: "Manikür & Pedikür",
features: [
"Medikal Bakım",
"Nasır Tedavisi",
"Tırnak Bakımı",
],
buttons: [
{
text: "Detaylı Bilgi",
href: "#",
},
],
},
{
id: "3",
badge: "Estetik",
price: "Başlayan",
subtitle: "Cilt & Makyaj",
features: [
"Microblading",
"Cilt Bakımı",
"Kalıcı Makyaj",
],
buttons: [
{
text: "Detaylı Bilgi",
href: "#",
},
],
},
]}
title="Hizmetlerimiz"
description="Şeffaf ve kaliteli lüks hizmet listemiz."
/>
</div>
<div id="fiyatlar" data-section="fiyatlar">
<PricingCardEight
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{ id: "1", badge: "Popüler", price: "Başlayan", subtitle: "Saç Kesim & Bakım", features: ["Profesyonel Kesim", "Boya", "Bakım Seansı"], buttons: [{ text: "Detaylı Bilgi", href: "#" }] },
{ id: "2", badge: "Bakım", price: "Başlayan", subtitle: "Manikür & Pedikür", features: ["Medikal Bakım", "Nasır Tedavisi", "Tırnak Bakımı"], buttons: [{ text: "Detaylı Bilgi", href: "#" }] },
{ id: "3", badge: "Estetik", price: "Başlayan", subtitle: "Cilt & Makyaj", features: ["Microblading", "Cilt Bakımı", "Kalıcı Makyaj"], buttons: [{ text: "Detaylı Bilgi", href: "#" }] },
]}
title="Hizmetlerimiz"
description="Şeffaf ve kaliteli lüks hizmet listemiz."
/>
</div>
<div id="galeri" data-section="galeri">
<ProductCardThree
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "g1",
name: "Şarap Kızılı Renklendirme",
price: "Öncesi/Sonrası",
imageSrc: "http://img.b2bpic.net/free-photo/lounge-lobby-area-library-sales-center_105762-1780.jpg",
},
{
id: "g2",
name: "Kıvırcık Saç Formu",
price: "Öncesi/Sonrası",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-work_52683-130989.jpg",
},
{
id: "g3",
name: "Microblading Uygulama",
price: "Öncesi/Sonrası",
imageSrc: "http://img.b2bpic.net/free-photo/person-getting-micro-needling-beauty-treatment_23-2149334235.jpg",
},
{
id: "g4",
name: "Sarı Tonlu Renklendirme",
price: "Öncesi/Sonrası",
imageSrc: "http://img.b2bpic.net/free-photo/beauty-salon-with-cosmetology-equipment-anime-style_23-2151501044.jpg",
},
{
id: "g5",
name: "Medikal Manikür",
price: "Öncesi/Sonrası",
imageSrc: "http://img.b2bpic.net/free-photo/manicure-procedure-progress-beautician-master-applying-color-nail-polish-closeup-hands_613910-20404.jpg",
},
{
id: "g6",
name: "Kalıcı Makyaj",
price: "Öncesi/Sonrası",
imageSrc: "http://img.b2bpic.net/free-photo/woman-going-through-microblading-treatment_23-2149103139.jpg",
},
]}
title="Önce / Sonra"
description="Dönüştüren dokunuşlarımızdan seçmeler."
/>
</div>
<div id="galeri" data-section="galeri">
<ProductCardThree
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{ id: "g1", name: "Şarap Kızılı Renklendirme", price: "Öncesi/Sonrası", imageSrc: "http://img.b2bpic.net/free-photo/lounge-lobby-area-library-sales-center_105762-1780.jpg" },
{ id: "g2", name: "Kıvırcık Saç Formu", price: "Öncesi/Sonrası", imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-work_52683-130989.jpg" },
{ id: "g3", name: "Microblading Uygulama", price: "Öncesi/Sonrası", imageSrc: "http://img.b2bpic.net/free-photo/person-getting-micro-needling-beauty-treatment_23-2149334235.jpg" },
{ id: "g4", name: "Sarı Tonlu Renklendirme", price: "Öncesi/Sonrası", imageSrc: "http://img.b2bpic.net/free-photo/beauty-salon-with-cosmetology-equipment-anime-style_23-2151501044.jpg" },
{ id: "g5", name: "Medikal Manikür", price: "Öncesi/Sonrası", imageSrc: "http://img.b2bpic.net/free-photo/manicure-procedure-progress-beautician-master-applying-color-nail-polish-closeup-hands_613910-20404.jpg" },
{ id: "g6", name: "Kalıcı Makyaj", price: "Öncesi/Sonrası", imageSrc: "http://img.b2bpic.net/free-photo/woman-going-through-microblading-treatment_23-2149103139.jpg" },
]}
title="Önce / Sonra"
description="Dönüştüren dokunuşlarımızdan seçmeler."
/>
</div>
<div id="yorumlar" data-section="yorumlar">
<TestimonialCardFive
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Ayşe Yılmaz",
date: "12.05.2024",
title: "Harika Bir Deneyim",
quote: "Saçla ilgilenmek bir sanat, bu kuaförde de sanatçılar var.",
tag: "Müşteri",
avatarSrc: "http://img.b2bpic.net/free-photo/studio-portrait-brunette-female-blue-shirt-grey-background_613910-7970.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/view-beautifully-decorated-round-table-with-natural-fir-branch-candle-two-flutes-plates-against-classic-sofa-modern-apartment_132075-11394.jpg?_wi=2",
imageAlt: "elegant woman headshot professional",
},
{
id: "2",
name: "Mehmet Demir",
date: "10.05.2024",
title: "Profesyonel",
quote: "Tertemiz bir ortamda kaliteli ürünlerle hizmet veriyorlar.",
tag: "Müşteri",
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-5391.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/professional-stylist-working-with-client_23-2147769765.jpg?_wi=2",
imageAlt: "elegant woman headshot professional",
},
{
id: "3",
name: "Canan Er",
date: "05.05.2024",
title: "Çok Başarılı",
quote: "Saçlarım yanmıştı, burada profesyonel bir kurtarma seansı aldım.",
tag: "Müşteri",
avatarSrc: "http://img.b2bpic.net/free-photo/professional-stylist-doing-haircut-salon_23-2147769831.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-client-worker-wearing-masks-nail-salon_23-2148694577.jpg?_wi=2",
imageAlt: "elegant woman headshot professional",
},
{
id: "4",
name: "Seda Nur",
date: "01.05.2024",
title: "Hijyenik",
quote: "Bembeyaz havlular ve tertemiz bir ortam, çok memnun kaldım.",
tag: "Müşteri",
avatarSrc: "http://img.b2bpic.net/free-photo/women-taking-selfies-with-new-dress_23-2147688754.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/woman-beauty-clinic-face-treatment_23-2148878913.jpg?_wi=2",
imageAlt: "elegant woman headshot professional",
},
{
id: "5",
name: "Deniz G.",
date: "20.04.2024",
title: "Kesinlikle Tavsiye",
quote: "Kıvırcık saç kesiminde Ankara'nın en iyisi bence.",
tag: "Müşteri",
avatarSrc: "http://img.b2bpic.net/free-photo/stylist-working-with-model-studio_23-2147783934.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-stylish-white-office-successful-doctor_8353-9587.jpg?_wi=1",
imageAlt: "elegant woman headshot professional",
},
]}
title="Danışanlarımız Ne Diyor?"
description="Moonlight Tunalı'yı tercih edenlerden gerçek deneyimler."
/>
</div>
<div id="yorumlar" data-section="yorumlar">
<TestimonialCardFive
textboxLayout="default"
useInvertedBackground={false}
testimonials={[
{ id: "1", name: "Ayşe Yılmaz", date: "12.05.2024", title: "Harika Bir Deneyim", quote: "Saçla ilgilenmek bir sanat, bu kuaförde de sanatçılar var.", tag: "Müşteri", avatarSrc: "http://img.b2bpic.net/free-photo/studio-portrait-brunette-female-blue-shirt-grey-background_613910-7970.jpg" },
{ id: "2", name: "Mehmet Demir", date: "10.05.2024", title: "Profesyonel", quote: "Tertemiz bir ortamda kaliteli ürünlerle hizmet veriyorlar.", tag: "Müşteri", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-5391.jpg" },
{ id: "3", name: "Canan Er", date: "05.05.2024", title: "Çok Başarılı", quote: "Saçlarım yanmıştı, burada profesyonel bir kurtarma seansı aldım.", tag: "Müşteri", avatarSrc: "http://img.b2bpic.net/free-photo/professional-stylist-doing-haircut-salon_23-2147769831.jpg" },
{ id: "4", name: "Seda Nur", date: "01.05.2024", title: "Hijyenik", quote: "Bembeyaz havlular ve tertemiz bir ortam, çok memnun kaldım.", tag: "Müşteri", avatarSrc: "http://img.b2bpic.net/free-photo/women-taking-selfies-with-new-dress_23-2147688754.jpg" },
{ id: "5", name: "Deniz G.", date: "20.04.2024", title: "Kesinlikle Tavsiye", quote: "Kıvırcık saç kesiminde Ankara'nın en iyisi bence.", tag: "Müşteri", avatarSrc: "http://img.b2bpic.net/free-photo/stylist-working-with-model-studio_23-2147783934.jpg" },
]}
title="Danışanlarımız Ne Diyor?"
description="Moonlight Tunalı'yı tercih edenlerden gerçek deneyimler."
/>
</div>
<div id="sss" data-section="sss">
<FaqDouble
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "Randevu almak zorunlu mu?",
content: "Evet, uzmanlarımızla en iyi deneyimi yaşamanız için önceden randevu almanızı rica ederiz.",
},
{
id: "f2",
title: "Hangi ürünleri kullanıyorsunuz?",
content: "Sağlıklı ve kaliteli, profesyonel saç bakım ürünlerini tercih ediyoruz.",
},
{
id: "f3",
title: "Hijyen prosedürleriniz nasıl?",
content: "Ekipmanlarımız sterilize edilmekte ve her müşteri için taze havlular kullanılmaktadır.",
},
]}
title="Sıkça Sorulanlar"
description="Merak ettiğiniz her şey burada."
faqsAnimation="slide-up"
/>
</div>
<div id="sss" data-section="sss">
<FaqDouble
faqsAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
faqs={[
{ id: "f1", title: "Randevu almak zorunlu mu?", content: "Evet, uzmanlarımızla en iyi deneyimi yaşamanız için önceden randevu almanızı rica ederiz." },
{ id: "f2", title: "Hangi ürünleri kullanıyorsunuz?", content: "Sağlıklı ve kaliteli, profesyonel saç bakım ürünlerini tercih ediyoruz." },
{ id: "f3", title: "Hijyen prosedürleriniz nasıl?", content: "Ekipmanlarımız sterilize edilmekte ve her müşteri için taze havlular kullanılmaktadır." },
]}
title="Sıkça Sorulanlar"
description="Merak ettiğiniz her şey burada."
/>
</div>
<div id="iletisim" data-section="iletisim">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain",
}}
title="Hemen Randevu Alın"
description="Tunalı'daki yerimize gelin, ışıltınızı birlikte keşfedelim."
imageSrc="http://img.b2bpic.net/free-photo/beautiful-stylish-white-office-successful-doctor_8353-9587.jpg?_wi=2"
mediaAnimation="slide-up"
inputPlaceholder="Telefon numaranız"
buttonText="İletişime Geç"
tag="İletişim"
/>
</div>
<div id="iletisim" data-section="iletisim">
<ContactSplit
useInvertedBackground={false}
background={{ variant: "plain" }}
title="Hemen Randevu Alın"
description="Tunalı'daki yerimize gelin, ışıltınızı birlikte keşfedelim."
imageSrc="http://img.b2bpic.net/free-photo/beautiful-stylish-white-office-successful-doctor_8353-9587.jpg"
mediaAnimation="slide-up"
inputPlaceholder="Telefon numaranız"
buttonText="İletişime Geç"
tag="İletişim"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Moonlight Tunalı"
leftLink={{
text: "Gizlilik Politikası",
href: "#",
}}
rightLink={{
text: "Ankara, Tunalı Hilmi Cad.",
href: "https://maps.google.com",
}}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Moonlight Tunalı"
leftLink={{ text: "Gizlilik Politikası", href: "#" }}
rightLink={{ text: "Ankara, Tunalı Hilmi Cad.", href: "https://maps.google.com" }}
/>
</div>
</ReactLenis>
</ThemeProvider>
);