Merge version_1 into main #1
352
src/app/page.tsx
352
src/app/page.tsx
@@ -13,257 +13,123 @@ import TestimonialCardTwelve from '@/components/sections/testimonial/Testimonial
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
defaultButtonVariant="icon-arrow"
|
||||
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">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Book Now",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Olakira"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Why Us", id: "why-us" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Olakira"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Luxury Hair & Spa Experience"
|
||||
description="Flawless results. Exceptional care. A space where beauty meets perfection."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/two-women-taking-selfie-together-after-session-shopping_23-2148673258.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-beautiful-woman-with-cup-coffee-cafe_624325-55.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/side-view-man-before-after-rhinoplasty_23-2149947584.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/charming-smiling-lady-with-long-wavy-dark-hair-is-touching-hair-looking-camera-home_291650-2384.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/middle-age-hispanic-man-standing-blue-background-showing-middle-finger-doing-fuck-you-bad-expression-provocation-rude-attitude-screaming-excited_839833-30187.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Appointment",
|
||||
href: "https://wa.me/254000000000",
|
||||
},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Premium Salon Services",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Expert Stylists",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "100% Client Satisfaction",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Hygienic Environment",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Custom Beauty Solutions",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Luxury Hair & Spa Experience"
|
||||
description="Flawless results. Exceptional care. A space where beauty meets perfection."
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/two-women-taking-selfie-together-after-session-shopping_23-2148673258.jpg", alt: "Client 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/young-beautiful-woman-with-cup-coffee-cafe_624325-55.jpg", alt: "Client 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/side-view-man-before-after-rhinoplasty_23-2149947584.jpg", alt: "Client 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/charming-smiling-lady-with-long-wavy-dark-hair-is-touching-hair-looking-camera-home_291650-2384.jpg", alt: "Client 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/middle-age-hispanic-man-standing-blue-background-showing-middle-finger-doing-fuck-you-bad-expression-provocation-rude-attitude-screaming-excited_839833-30187.jpg", alt: "Client 5" }
|
||||
]}
|
||||
buttons={[{ text: "Book Your Appointment", href: "https://wa.me/254000000000" }]}
|
||||
marqueeItems={[
|
||||
{ type: "text", text: "Premium Salon Services" },
|
||||
{ type: "text", text: "Expert Stylists" },
|
||||
{ type: "text", text: "100% Client Satisfaction" },
|
||||
{ type: "text", text: "Hygienic Environment" },
|
||||
{ type: "text", text: "Custom Beauty Solutions" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Hair Styling",
|
||||
description: "Precision cuts, braids, extensions & flawless finishes.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-africa-woman-making-eyebrows-girls-beauty-salon_1157-48328.jpg",
|
||||
imageAlt: "Hair Styling",
|
||||
},
|
||||
{
|
||||
title: "Nails & Beauty",
|
||||
description: "Manicure, pedicure, acrylics & eyebrow shaping.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/master-manicure-brushing-customer-s-nails-after-manicure-process-beauty-salon_613910-20430.jpg",
|
||||
imageAlt: "Nails & Beauty",
|
||||
},
|
||||
{
|
||||
title: "Spa Treatments",
|
||||
description: "Relaxing treatments designed to refresh and renew.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/serene-spa-interior_23-2151945692.jpg",
|
||||
imageAlt: "Spa Treatments",
|
||||
},
|
||||
{
|
||||
title: "Microblading",
|
||||
description: "Perfect brows crafted with precision and artistry.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/unrecognizable-barber-using-scissors-haircut_651396-130.jpg",
|
||||
imageAlt: "Microblading",
|
||||
},
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Expert treatments designed to refresh and renew your look."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ title: "Hair Styling", description: "Precision cuts, braids, extensions & flawless finishes.", imageSrc: "http://img.b2bpic.net/free-photo/girl-africa-woman-making-eyebrows-girls-beauty-salon_1157-48328.jpg", imageAlt: "Hair Styling" },
|
||||
{ title: "Nails & Beauty", description: "Manicure, pedicure, acrylics & eyebrow shaping.", imageSrc: "http://img.b2bpic.net/free-photo/master-manicure-brushing-customer-s-nails-after-manicure-process-beauty-salon_613910-20430.jpg", imageAlt: "Nails & Beauty" },
|
||||
{ title: "Spa Treatments", description: "Relaxing treatments designed to refresh and renew.", imageSrc: "http://img.b2bpic.net/free-photo/serene-spa-interior_23-2151945692.jpg", imageAlt: "Spa Treatments" },
|
||||
{ title: "Microblading", description: "Perfect brows crafted with precision and artistry.", imageSrc: "http://img.b2bpic.net/free-photo/unrecognizable-barber-using-scissors-haircut_651396-130.jpg", imageAlt: "Microblading" }
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Expert treatments designed to refresh and renew your look."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="why-us" data-section="why-us">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Why Clients Love Olakira"
|
||||
description="We pride ourselves on our spotless environment, expert stylists, and results that keep clients coming back again and again. Excellence is our standard."
|
||||
metrics={[
|
||||
{
|
||||
value: "100%",
|
||||
title: "Client Satisfaction",
|
||||
},
|
||||
{
|
||||
value: "24/7",
|
||||
title: "Exceptional Care",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/girl-receiving-facial-treatment-beauty-salon_23-2148194166.jpg"
|
||||
imageAlt="Olakira Salon Interior"
|
||||
mediaAnimation="blur-reveal"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="why-us" data-section="why-us">
|
||||
<MetricSplitMediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Why Clients Love Olakira"
|
||||
description="We pride ourselves on our spotless environment, expert stylists, and results that keep clients coming back again and again. Excellence is our standard."
|
||||
metrics={[
|
||||
{ value: "100%", title: "Client Satisfaction" },
|
||||
{ value: "24/7", title: "Exceptional Care" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/girl-receiving-facial-treatment-beauty-salon_23-2148194166.jpg"
|
||||
imageAlt="Olakira Salon Interior"
|
||||
mediaAnimation="blur-reveal"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/two-women-taking-selfie-together-after-session-shopping_23-2148673258.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael C.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-with-cup-coffee-cafe_624325-55.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily R.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-before-after-rhinoplasty_23-2149947584.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David K.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/charming-smiling-lady-with-long-wavy-dark-hair-is-touching-hair-looking-camera-home_291650-2384.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Jane D.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/middle-age-hispanic-man-standing-blue-background-showing-middle-finger-doing-fuck-you-bad-expression-provocation-rude-attitude-screaming-excited_839833-30187.jpg",
|
||||
},
|
||||
]}
|
||||
cardTitle="Client Love"
|
||||
cardTag="Testimonials"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah J.", imageSrc: "http://img.b2bpic.net/free-photo/two-women-taking-selfie-together-after-session-shopping_23-2148673258.jpg" },
|
||||
{ id: "2", name: "Michael C.", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-with-cup-coffee-cafe_624325-55.jpg" },
|
||||
{ id: "3", name: "Emily R.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-before-after-rhinoplasty_23-2149947584.jpg" },
|
||||
{ id: "4", name: "David K.", imageSrc: "http://img.b2bpic.net/free-photo/charming-smiling-lady-with-long-wavy-dark-hair-is-touching-hair-looking-camera-home_291650-2384.jpg" },
|
||||
{ id: "5", name: "Jane D.", imageSrc: "http://img.b2bpic.net/free-photo/middle-age-hispanic-man-standing-blue-background-showing-middle-finger-doing-fuck-you-bad-expression-provocation-rude-attitude-screaming-excited_839833-30187.jpg" }
|
||||
]}
|
||||
cardTitle="Client Love"
|
||||
cardTag="Testimonials"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
text="Ready to experience the luxury you deserve?"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Now",
|
||||
href: "https://wa.me/254000000000",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
text="Ready to experience the luxury you deserve?"
|
||||
buttons={[{ text: "Book Now", href: "https://wa.me/254000000000" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Olakira"
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Hair Styling",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Nails & Beauty",
|
||||
href: "#services",
|
||||
},
|
||||
{
|
||||
label: "Spa Treatments",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Book Now",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2026 Olakira Hair Studio & Spa. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Olakira"
|
||||
columns={[
|
||||
{ title: "Services", items: [{ label: "Hair Styling", href: "#services" }, { label: "Nails & Beauty", href: "#services" }, { label: "Spa Treatments", href: "#services" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#why-us" }, { label: "Book Now", href: "#contact" }] },
|
||||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||||
]}
|
||||
copyrightText="© 2026 Olakira Hair Studio & Spa. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user