Merge version_2 into main
Merge version_2 into main
This commit was merged in pull request #2.
This commit is contained in:
254
src/app/page.tsx
254
src/app/page.tsx
@@ -2,17 +2,17 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroPersonalLinks from '@/components/sections/hero/HeroPersonalLinks';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import { Sparkles } from "lucide-react";
|
||||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
import { Sparkles, Star } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,148 +29,116 @@ export default function LandingPage() {
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="& Plus"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="& Plus"
|
||||
button={{ text: "Book Now", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "rotated-rays-animated" }}
|
||||
title="Elevate Your Beauty at & Plus Salon"
|
||||
description="Discover premium salon services designed to bring out your best self. From expert styling to rejuvenating spa treatments, experience true relaxation."
|
||||
buttons={[{ text: "Book Now", href: "#contact" }]}
|
||||
carouselItems={[
|
||||
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-with-orchid-flower-her-head-sleeping-deck-chair-spa_23-2147867935.jpg", imageAlt: "Luxurious salon interior" },
|
||||
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-bride-getting-hair-done_23-2149860770.jpg", imageAlt: "Professional salon tools" },
|
||||
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/luxury-retro-wall-lamp-cafe_1150-10890.jpg", imageAlt: "Glowing salon portrait" },
|
||||
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/lit-candles-bathroom_23-2148848651.jpg", imageAlt: "Relaxing spa ambiance" },
|
||||
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-sing-brush-his-face_23-2148784333.jpg", imageAlt: "Spa beauty treatment" },
|
||||
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/woma-shaving-man-s-beard-barbershop_1157-27177.jpg", imageAlt: "Modern beauty studio" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroPersonalLinks
|
||||
background={{ variant: "rotated-rays-animated" }}
|
||||
title="Elevate Your Beauty at & Plus Salon"
|
||||
linkCards={[
|
||||
{ title: "Professional Styling", description: "Expert haircuts and color services.", button: { text: "Learn More" }, imageSrc: "http://img.b2bpic.net/free-photo/instruments-used-latino-hair-salon_23-2150555177.jpg" },
|
||||
{ title: "Spa Wellness", description: "Rejuvenating treatments for ultimate relaxation.", button: { text: "View Menu" }, imageSrc: "http://img.b2bpic.net/free-photo/manual-therapy_1098-15117.jpg" },
|
||||
{ title: "Nail Excellence", description: "Manicures and pedicures that define elegance.", button: { text: "See Prices" }, imageSrc: "http://img.b2bpic.net/free-photo/side-view-female-teacher-showing-students-lesson-online-class_23-2148680491.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="About Us"
|
||||
title="A Sanctuary for Your Style"
|
||||
description="At & Plus Salon, we believe beauty is an art form. Our expert team combines modern techniques with personalized care to ensure every visit is exceptional."
|
||||
subdescription="With years of experience and a passion for excellence, we provide a relaxing haven where your hair and skin receive the attention they deserve."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/woman-drinking-coffee-cafe_1303-25729.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
icon={Sparkles}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
title="A Sanctuary for Your Style"
|
||||
description={["At & Plus Salon, we believe beauty is an art form. Our expert team combines modern techniques with personalized care to ensure every visit is exceptional.", "With years of experience and a passion for excellence, we provide a relaxing haven where your hair and skin receive the attention they deserve."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Expert Styling", description: "Precision haircuts, coloring, and styling tailored to your features.", imageSrc: "http://img.b2bpic.net/free-photo/instruments-used-latino-hair-salon_23-2150555177.jpg" },
|
||||
{ title: "Spa Wellness", description: "Rejuvenating facials and treatments that promote healthy skin.", imageSrc: "http://img.b2bpic.net/free-photo/manual-therapy_1098-15117.jpg" },
|
||||
{ title: "Nail Care", description: "Manicures and pedicures that highlight elegance and detail.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-female-teacher-showing-students-lesson-online-class_23-2148680491.jpg" }
|
||||
]}
|
||||
title="Our Signature Services"
|
||||
description="Professional treatments curated for your lifestyle."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
title="Our Signature Services"
|
||||
description="Professional treatments curated for your lifestyle."
|
||||
features={[
|
||||
{ title: "Expert Styling", description: "Precision haircuts and coloring.", imageSrc: "http://img.b2bpic.net/free-photo/instruments-used-latino-hair-salon_23-2150555177.jpg" },
|
||||
{ title: "Spa Wellness", description: "Facials and skin treatments.", imageSrc: "http://img.b2bpic.net/free-photo/manual-therapy_1098-15117.jpg" },
|
||||
{ title: "Nail Care", description: "Luxury manicures and pedicures.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-female-teacher-showing-students-lesson-online-class_23-2148680491.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{ id: "1", badge: "Popular", price: "$75", subtitle: "Precision Haircut", features: ["Consultation", "Wash", "Styling"] },
|
||||
{ id: "2", badge: "Value", price: "$120", subtitle: "Complete Spa Facial", features: ["Cleanse", "Exfoliation", "Mask"] },
|
||||
{ id: "3", badge: "Care", price: "$50", subtitle: "Luxury Manicure", features: ["Nail Grooming", "Massage", "Polish"] }
|
||||
]}
|
||||
title="Service Packages"
|
||||
description="Transparent pricing for high-quality beauty care."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardEight
|
||||
animationType="slide-up"
|
||||
title="Service Packages"
|
||||
description="Transparent pricing for high-quality beauty care."
|
||||
plans={[
|
||||
{ id: "1", badge: "Essential", price: "$75", subtitle: "Precision Haircut", buttons: [{ text: "Select" }], features: ["Consultation", "Wash", "Styling"] },
|
||||
{ id: "2", badge: "Popular", price: "$120", subtitle: "Complete Spa Facial", buttons: [{ text: "Select" }], features: ["Cleanse", "Exfoliation", "Mask"] },
|
||||
{ id: "3", badge: "Luxury", price: "$50", subtitle: "Nail Care", buttons: [{ text: "Select" }], features: ["Grooming", "Massage", "Polish"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alice M.", handle: "@alicem", testimonial: "Best salon experience ever. My hair looks stunning!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/pretty-teenager-talking-phone_23-2148804651.jpg" },
|
||||
{ id: "2", name: "Sophia R.", handle: "@sophr", testimonial: "So relaxing! The spa treatment was exactly what I needed.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/mom-combing-daughter-hair_23-2148482909.jpg" },
|
||||
{ id: "3", name: "Jenny L.", handle: "@jennyl", testimonial: "Professional, clean, and friendly. I highly recommend.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/view-beautiful-black-woman-watching-laptop_197531-33099.jpg" },
|
||||
{ id: "4", name: "Mark D.", handle: "@markd", testimonial: "Excellent service and great results. Very satisfied.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/woman-scaring-her-friend-leaning-chair_23-2147894249.jpg" },
|
||||
{ id: "5", name: "Sarah K.", handle: "@sarahk", testimonial: "My go-to place for style and beauty treatments.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-smiling-kitchen_107420-12357.jpg" }
|
||||
]}
|
||||
showRating={true}
|
||||
title="What Our Clients Say"
|
||||
description="Join our community of happy beauty enthusiasts."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
cardTitle="Client Highlights"
|
||||
cardTag="Reviews"
|
||||
cardAnimation="slide-up"
|
||||
testimonials={[
|
||||
{ id: "1", name: "Alice M.", imageSrc: "http://img.b2bpic.net/free-photo/pretty-teenager-talking-phone_23-2148804651.jpg" },
|
||||
{ id: "2", name: "Sophia R.", imageSrc: "http://img.b2bpic.net/free-photo/mom-combing-daughter-hair_23-2148482909.jpg" },
|
||||
{ id: "3", name: "Jenny L.", imageSrc: "http://img.b2bpic.net/free-photo/view-beautiful-black-woman-watching-laptop_197531-33099.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={["Beauty Weekly", "Style Today", "Salon Elite", "Wellness Daily", "Pure Beauty Mag", "Hair Guru", "Spa Industry"]}
|
||||
title="Trusted by Industry Leaders"
|
||||
description="Celebrating partnerships with top beauty publications."
|
||||
/>
|
||||
</div>
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
names={["Beauty Weekly", "Style Today", "Salon Elite", "Wellness Daily"]}
|
||||
title="Trusted by Industry Leaders"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "1", title: "Do I need to book an appointment?", content: "Yes, appointments are recommended to ensure availability." },
|
||||
{ id: "2", title: "What products do you use?", content: "We use professional-grade, eco-friendly beauty products." },
|
||||
{ id: "3", title: "Do you offer group bookings?", content: "Absolutely! Contact us for group rates and services." },
|
||||
{ id: "4", title: "Are there parking options?", content: "We have dedicated guest parking located at the rear of the salon." },
|
||||
{ id: "5", title: "What is your cancellation policy?", content: "Please notify us 24 hours in advance to cancel or reschedule your appointment." }
|
||||
]}
|
||||
title="Common Questions"
|
||||
faqsAnimation="slide-up"
|
||||
description="Find answers to help you prepare for your visit."
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Common queries about our salon services."
|
||||
faqsAnimation="slide-up"
|
||||
faqs={[
|
||||
{ id: "1", title: "Do I need to book?", content: "Yes, appointments are recommended." },
|
||||
{ id: "2", title: "What products?", content: "Eco-friendly, professional products." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "rotated-rays-animated" }}
|
||||
title="Book Your Visit Today"
|
||||
description="Ready to look and feel your absolute best? Contact us to schedule an appointment."
|
||||
tag="Get In Touch"
|
||||
inputPlaceholder="Enter your email address"
|
||||
buttonText="Schedule Appointment"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
title="Book Your Visit"
|
||||
description="Ready for a transformation? Reach out now."
|
||||
inputs={[{ name: "name", type: "text", placeholder: "Full Name" }, { name: "email", type: "email", placeholder: "Email Address" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-young-woman-with-orchid-flower-her-head-sleeping-deck-chair-spa_23-2147867935.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="& Plus Salon"
|
||||
columns={[
|
||||
{ title: "Location", items: [{ label: "123 Beauty Lane, City, ST", href: "#" }] },
|
||||
{ title: "Services", items: [{ label: "Styling", href: "#features" }, { label: "Spa", href: "#features" }] },
|
||||
{ title: "Company", items: [{ label: "About", href: "#" }, { label: "Reviews", href: "#testimonials" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
logoText="& Plus Salon"
|
||||
columns={[
|
||||
{ items: [{ label: "Services" }, { label: "Pricing" }] },
|
||||
{ items: [{ label: "Contact" }, { label: "About" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user