Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
472
src/app/page.tsx
472
src/app/page.tsx
@@ -17,357 +17,151 @@ export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Team",
|
||||
id: "team",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Silver Hair Studio"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Hero", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Team", id: "team" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Silver Hair Studio"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="The Art of Beautiful Hair"
|
||||
description="Where precision meets artistry. Silver Hair Studio is Kadıköy's premier destination for elevated hair experiences."
|
||||
tag="Kadıköy, İstanbul"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Our Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skiing-snowboarding-equipment_482257-76571.jpg?_wi=1",
|
||||
imageAlt: "Studio aesthetic",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4440.jpg?_wi=1",
|
||||
imageAlt: "Working on hair",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-arrangement-barber-shop-desk_23-2148256952.jpg?_wi=1",
|
||||
imageAlt: "Studio detail",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/instruments-hairdresser-black-towel_23-2148181901.jpg",
|
||||
imageAlt: "Salon interior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lovely-stylist-applying-makeup-unrecognizable-model_23-2147783895.jpg",
|
||||
imageAlt: "Creative process",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairdresser-shop-instruments_23-2149319797.jpg",
|
||||
imageAlt: "Workspace detail",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "plain" }}
|
||||
title="The Art of Beautiful Hair"
|
||||
description="Where precision meets artistry. Silver Hair Studio is Kadıköy's premier destination for elevated hair experiences."
|
||||
tag="Kadıköy, İstanbul"
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }, { text: "Our Services", href: "#services" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/skiing-snowboarding-equipment_482257-76571.jpg", imageAlt: "Studio aesthetic" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4440.jpg", imageAlt: "Working on hair" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-arrangement-barber-shop-desk_23-2148256952.jpg", imageAlt: "Studio detail" }
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Crafting Elegance"
|
||||
description="At Silver Hair Studio, we combine refined technical skill with an artistic eye. Located in the heart of Kadıköy, we provide a serene environment where your individual vision is our primary focus."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/confident-young-beautiful-female-barber-uniform-doing-haircut-boy-isolated-pink-wall_141793-105668.jpg?_wi=1"
|
||||
imageAlt="Master Stylist at work"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Crafting Elegance"
|
||||
description="At Silver Hair Studio, we combine refined technical skill with an artistic eye. Located in the heart of Kadıköy, we provide a serene environment where your individual vision is our primary focus."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/confident-young-beautiful-female-barber-uniform-doing-haircut-boy-isolated-pink-wall_141793-105668.jpg"
|
||||
imageAlt="Master Stylist at work"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardNineteen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
tag: "Essential",
|
||||
title: "Cut & Style",
|
||||
subtitle: "From ₺350",
|
||||
description: "Precision cuts tailored to your face shape, lifestyle, and vision.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-modern-futuristic-work-space-with-furniture_23-2151797714.jpg",
|
||||
imageAlt: "View of modern and futuristic work space with furniture",
|
||||
},
|
||||
{
|
||||
tag: "Color",
|
||||
title: "Color & Highlights",
|
||||
subtitle: "From ₺650",
|
||||
description: "Full color, balayage, and highlights using premium professional products.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skiing-snowboarding-equipment_482257-76571.jpg?_wi=2",
|
||||
imageAlt: "View of modern and futuristic work space with furniture",
|
||||
},
|
||||
{
|
||||
tag: "Luxury",
|
||||
title: "Keratin Treatment",
|
||||
subtitle: "From ₺1,200",
|
||||
description: "Restore shine, eliminate frizz, and smooth hair for up to 4 months.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4440.jpg?_wi=2",
|
||||
imageAlt: "View of modern and futuristic work space with furniture",
|
||||
},
|
||||
{
|
||||
tag: "Special",
|
||||
title: "Bridal & Special",
|
||||
subtitle: "From ₺800",
|
||||
description: "Elegant updos, braids, and bridal styling for your most important moments.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-arrangement-barber-shop-desk_23-2148256952.jpg?_wi=2",
|
||||
imageAlt: "View of modern and futuristic work space with furniture",
|
||||
},
|
||||
{
|
||||
tag: "Care",
|
||||
title: "Hair Care & Masks",
|
||||
subtitle: "From ₺300",
|
||||
description: "Deep conditioning treatments and scalp care rituals.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-young-beautiful-female-barber-uniform-doing-haircut-boy-isolated-pink-wall_141793-105668.jpg?_wi=2",
|
||||
imageAlt: "View of modern and futuristic work space with furniture",
|
||||
},
|
||||
{
|
||||
tag: "Finishing",
|
||||
title: "Blowout & Finish",
|
||||
subtitle: "From ₺250",
|
||||
description: "A transformative blowout that lasts. Smooth, volume, or textured.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/drag-queen-holding-wig-medium-shot_23-2149247328.jpg?_wi=1",
|
||||
imageAlt: "View of modern and futuristic work space with furniture",
|
||||
},
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Explore our curated menu of hair care and styling services designed to enhance your natural beauty."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardNineteen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ tag: "Essential", title: "Cut & Style", subtitle: "From ₺350", description: "Precision cuts tailored to your face shape, lifestyle, and vision.", imageSrc: "http://img.b2bpic.net/free-photo/view-modern-futuristic-work-space-with-furniture_23-2151797714.jpg" },
|
||||
{ tag: "Color", title: "Color & Highlights", subtitle: "From ₺650", description: "Full color, balayage, and highlights using premium professional products.", imageSrc: "http://img.b2bpic.net/free-photo/skiing-snowboarding-equipment_482257-76571.jpg" },
|
||||
{ tag: "Luxury", title: "Keratin Treatment", subtitle: "From ₺1,200", description: "Restore shine, eliminate frizz, and smooth hair for up to 4 months.", imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4440.jpg" }
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Explore our curated menu of hair care and styling services designed to enhance your natural beauty."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Ayşe Y.",
|
||||
role: "Master Stylist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94680.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mehmet K.",
|
||||
role: "Colorist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-female-with-mascara_23-2148553439.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Selin D.",
|
||||
role: "Stylist",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/child-getting-haircut-salon_23-2150462519.jpg",
|
||||
},
|
||||
]}
|
||||
title="Meet Our Stylists"
|
||||
description="Our team of professionals is dedicated to mastering the art of modern hair care."
|
||||
/>
|
||||
</div>
|
||||
<div id="team" data-section="team">
|
||||
<TeamCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{ id: "1", name: "Ayşe Y.", role: "Master Stylist", imageSrc: "http://img.b2bpic.net/free-photo/beautician-styling-clients-hair_107420-94680.jpg" },
|
||||
{ id: "2", name: "Mehmet K.", role: "Colorist", imageSrc: "http://img.b2bpic.net/free-photo/close-up-female-with-mascara_23-2148553439.jpg" },
|
||||
{ id: "3", name: "Selin D.", role: "Stylist", imageSrc: "http://img.b2bpic.net/free-photo/child-getting-haircut-salon_23-2150462519.jpg" }
|
||||
]}
|
||||
title="Meet Our Stylists"
|
||||
description="Our team of professionals is dedicated to mastering the art of modern hair care."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "essential",
|
||||
title: "Essential Care",
|
||||
price: "₺350",
|
||||
period: "session",
|
||||
features: [
|
||||
"Consultation",
|
||||
"Precision Cut",
|
||||
"Style",
|
||||
],
|
||||
button: {
|
||||
text: "Book",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blonde-girl-posing-bathroom-with-bath-robe_23-2148147502.jpg",
|
||||
imageAlt: "Blonde girl posing in the bathroom with bath robe",
|
||||
},
|
||||
{
|
||||
id: "premium",
|
||||
title: "Color & Care",
|
||||
price: "₺950",
|
||||
period: "session",
|
||||
features: [
|
||||
"Color Treatment",
|
||||
"Deep Condition",
|
||||
"Finish",
|
||||
],
|
||||
button: {
|
||||
text: "Book",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skiing-snowboarding-equipment_482257-76571.jpg?_wi=3",
|
||||
imageAlt: "Blonde girl posing in the bathroom with bath robe",
|
||||
},
|
||||
{
|
||||
id: "luxury",
|
||||
title: "Full Transformation",
|
||||
price: "₺1,500",
|
||||
period: "session",
|
||||
features: [
|
||||
"Keratin Ritual",
|
||||
"Full Color",
|
||||
"Style",
|
||||
],
|
||||
button: {
|
||||
text: "Book",
|
||||
href: "#contact",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4440.jpg?_wi=3",
|
||||
imageAlt: "Blonde girl posing in the bathroom with bath robe",
|
||||
},
|
||||
]}
|
||||
title="Appointment Packages"
|
||||
description="Select the perfect package for your hair goals."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{ id: "1", title: "Essential Care", price: "₺350", period: "session", features: ["Consultation", "Precision Cut"], button: { text: "Book", href: "#contact" } },
|
||||
{ id: "2", title: "Color & Care", price: "₺950", period: "session", features: ["Color", "Condition"], button: { text: "Book", href: "#contact" } },
|
||||
{ id: "3", title: "Luxury", price: "₺1,500", period: "session", features: ["Keratin", "Style"], button: { text: "Book", href: "#contact" } }
|
||||
]}
|
||||
title="Appointment Packages"
|
||||
description="Select the perfect package for your hair goals."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Excellent Service",
|
||||
quote: "Absolutely love the results every single time.",
|
||||
name: "Zeynep A.",
|
||||
role: "Regular Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/drag-queen-holding-wig-medium-shot_23-2149247328.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Top Tier",
|
||||
quote: "The best salon on Bağdat Caddesi. Professional.",
|
||||
name: "Merve K.",
|
||||
role: "Loyal Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-holding-brush-staring-ahead_114579-22641.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Color Correction",
|
||||
quote: "I came in for a color correction and left completely blown away.",
|
||||
name: "Selin D.",
|
||||
role: "Happy Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-styling-clients-hair_107420-94690.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "Skilled",
|
||||
quote: "The attention to detail and skill level is impressive.",
|
||||
name: "David K.",
|
||||
role: "Visitor",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-making-her-sister-s-braid-against-white-background_23-2147890574.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "Recommended",
|
||||
quote: "Will not go anywhere else. Simply amazing.",
|
||||
name: "Ayşe K.",
|
||||
role: "Regular Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-bride-indoors_23-2149721973.jpg",
|
||||
},
|
||||
]}
|
||||
title="What Clients Say"
|
||||
description="Join our community of happy clients."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", title: "Great", quote: "Love it!", name: "Zeynep A.", role: "Client" },
|
||||
{ id: "2", title: "Amazing", quote: "Best salon.", name: "Merve K.", role: "Client" },
|
||||
{ id: "3", title: "Skilled", quote: "Very impressed.", name: "David K.", role: "Client" }
|
||||
]}
|
||||
title="What Clients Say"
|
||||
description="Join our community."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need to book an appointment?",
|
||||
content: "Yes, we prioritize appointments to ensure personalized service.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Where are you located?",
|
||||
content: "We are located at Bağdat Caddesi No:157 in Kadıköy.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "What are your operating hours?",
|
||||
content: "We are open Monday to Friday 09:00–19:00 and Saturday 09:00–18:00.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-child-hair-salon_23-2150462476.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
title="Common Questions"
|
||||
description="Everything you need to know about your studio visit."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Appointment?", content: "Yes, required." },
|
||||
{ id: "f2", title: "Location?", content: "Kadıköy." },
|
||||
{ id: "f3", title: "Hours?", content: "Mon-Sat." }
|
||||
]}
|
||||
faqsAnimation="blur-reveal"
|
||||
title="Common Questions"
|
||||
description="Everything you need to know."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Reserve Your Seat"
|
||||
title="Book an Appointment"
|
||||
description="Ready to transform your style? Reach out to us today to schedule your visit."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call (0216) 449 22 71",
|
||||
href: "tel:+902164492271",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
tag="Reserve Your Seat"
|
||||
title="Book an Appointment"
|
||||
description="Ready to transform your style? Reach out to us today."
|
||||
buttons={[{ text: "Call (0216) 449 22 71", href: "tel:+902164492271" }]}
|
||||
background={{ variant: "plain" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Silver Hair Studio"
|
||||
leftLink={{
|
||||
text: "© 2025 Silver Hair Studio",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Kadıköy, İstanbul",
|
||||
href: "https://maps.google.com",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Silver Hair Studio"
|
||||
leftLink={{ text: "© 2025", href: "#" }}
|
||||
rightLink={{ text: "Kadıköy", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user