Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 2489aef028 | |||
| 7056cec064 | |||
| 32b24ca552 |
267
src/app/page.tsx
267
src/app/page.tsx
@@ -1,183 +1,192 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||||
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
|
import HeroSplit from "@/components/sections/hero/HeroSplit";
|
||||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
import AboutMetric from "@/components/sections/about/AboutMetric";
|
||||||
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
|
||||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
|
||||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
|
||||||
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
import ContactSplit from "@/components/sections/contact/ContactSplit";
|
||||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
|
||||||
import { Sparkles, Users, Star, Heart, Shield, MapPin } from 'lucide-react';
|
import { Sparkles, Award, Heart, MapPin, Users, Zap } from "lucide-react";
|
||||||
|
|
||||||
export default function LandingPage() {
|
const navItems = [
|
||||||
|
{ name: "Home", id: "/" },
|
||||||
|
{ name: "About", id: "about" },
|
||||||
|
{ name: "Services", id: "services" },
|
||||||
|
{ name: "Gallery", id: "gallery" },
|
||||||
|
{ name: "Contact", id: "contact" },
|
||||||
|
];
|
||||||
|
|
||||||
|
export default function Home() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="text-stagger"
|
defaultButtonVariant="hover-magnetic"
|
||||||
defaultTextAnimation="entrance-slide"
|
defaultTextAnimation="entrance-slide"
|
||||||
borderRadius="soft"
|
borderRadius="rounded"
|
||||||
contentWidth="compact"
|
contentWidth="mediumLarge"
|
||||||
sizing="mediumLarge"
|
sizing="large"
|
||||||
background="noise"
|
background="none"
|
||||||
cardStyle="outline"
|
cardStyle="glass-elevated"
|
||||||
primaryButtonStyle="double-inset"
|
primaryButtonStyle="gradient"
|
||||||
secondaryButtonStyle="glass"
|
secondaryButtonStyle="glass"
|
||||||
headingFontWeight="semibold"
|
headingFontWeight="bold"
|
||||||
>
|
>
|
||||||
<div id="nav" data-section="nav">
|
<NavbarStyleFullscreen
|
||||||
<NavbarLayoutFloatingInline
|
navItems={navItems}
|
||||||
brandName="Gallantry"
|
brandName="Gallantry"
|
||||||
navItems={[
|
bottomLeftText="Raj Nagar Extension"
|
||||||
{ name: "About", id: "about" },
|
bottomRightText="hello@gallantry.salon"
|
||||||
{ name: "Services", id: "services" },
|
/>
|
||||||
{ name: "Location", id: "location" },
|
|
||||||
{ name: "Contact", id: "contact" }
|
|
||||||
]}
|
|
||||||
button={{ text: "Book on WhatsApp", href: "https://wa.me/919876543210" }}
|
|
||||||
animateOnLoad={true}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroSplitDoubleCarousel
|
<HeroSplit
|
||||||
title="Gallantry Unisex Salon"
|
background={{ variant: "plain" }}
|
||||||
description="Premium Hair, Skin & Grooming Services in Raj Nagar Extension. Experience luxury styling with professional experts and premium products."
|
title="Experience Luxury Hair & Grooming"
|
||||||
|
description="Premium salon services with expert stylists using the finest products. Transform your look with our elite grooming experience."
|
||||||
tag="Premium Salon"
|
tag="Premium Salon"
|
||||||
tagIcon={Sparkles}
|
tagIcon={Sparkles}
|
||||||
background={{ variant: "plain" }}
|
tagAnimation="slide-up"
|
||||||
leftCarouselItems={[
|
buttons={[
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205870.jpg?_wi=1", imageAlt: "Luxury salon interior" },
|
{ text: "Book Appointment", href: "contact" },
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/boy-is-resting-salon_1157-16187.jpg", imageAlt: "Professional styling station" },
|
{ text: "View Services", href: "services" },
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/high-end-professional-cabinet-used-psychotherapy-meetings_482257-117710.jpg", imageAlt: "Premium salon ambiance" },
|
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-womwn-wearing-trendy-hairstyle_23-2149478888.jpg?_wi=1", imageAlt: "Hairstyle showcase" }
|
|
||||||
]}
|
]}
|
||||||
rightCarouselItems={[
|
buttonAnimation="slide-up"
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-bearded-brutal-tattooed-happy-man-holds-pomeranian-spitz-playing-with-lovely-pet_343596-1561.jpg?_wi=1", imageAlt: "Professional styling service" },
|
imageSrc="/luxury-salon.jpg"
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/bearded-stylish-man-sitting-cafe_273609-4476.jpg?_wi=1", imageAlt: "Men's haircut styling" },
|
imageAlt="Premium salon interior with elegant styling chairs"
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/atmospheric-glamour-perfect-nice-blurred_1304-833.jpg?_wi=1", imageAlt: "Women's hair styling" },
|
mediaAnimation="slide-up"
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-model-woman-beauty-salon-is-making-evening-make-up_231208-3585.jpg?_wi=1", imageAlt: "Beauty treatment service" }
|
imagePosition="right"
|
||||||
]}
|
fixedMediaHeight={true}
|
||||||
buttons={[{ text: "Book Appointment on WhatsApp", href: "https://wa.me/919876543210" }]}
|
|
||||||
carouselPosition="right"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="about" data-section="about">
|
<div id="about" data-section="about">
|
||||||
<AboutMetric
|
<AboutMetric
|
||||||
title="Gallantry Unisex Salon offers modern hair styling, grooming and beauty services with experienced stylists and premium products. We focus on hygiene, customer satisfaction and trendy styles for men and women."
|
title="Gallantry Unisex Salon - Where Excellence Meets Elegance"
|
||||||
|
useInvertedBackground={false}
|
||||||
metrics={[
|
metrics={[
|
||||||
{ icon: Users, label: "Happy Clients", value: "500+" },
|
{ icon: Award, label: "Expert Stylists", value: "15+" },
|
||||||
{ icon: Star, label: "Professional Stylists", value: "8+" },
|
{ icon: Users, label: "Happy Clients", value: "5,000+" },
|
||||||
{ icon: Heart, label: "Premium Products", value: "100%" },
|
{ icon: Heart, label: "Years of Excellence", value: "12+" },
|
||||||
{ icon: Shield, label: "Years Experience", value: "15+" }
|
{ icon: Sparkles, label: "Premium Products", value: "100%" },
|
||||||
]}
|
]}
|
||||||
metricsAnimation="slide-up"
|
metricsAnimation="slide-up"
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="services" data-section="services">
|
<div id="services" data-section="services">
|
||||||
<FeatureCardTwentyThree
|
<PricingCardTwo
|
||||||
title="Our Premium Services"
|
plans={[
|
||||||
description="Comprehensive grooming and beauty solutions designed for modern men and women"
|
{
|
||||||
features={[
|
id: "1", badge: "Hair Styling", badgeIcon: Sparkles,
|
||||||
{ id: "1", title: "Haircut & Hair Styling", tags: ["Men", "Women", "Trending"], imageSrc: "http://img.b2bpic.net/free-photo/bearded-stylish-man-sitting-cafe_273609-4476.jpg?_wi=2", imageAlt: "Haircut styling" },
|
price: "From $40", subtitle: "Professional cuts, coloring & treatments", buttons: [
|
||||||
{ id: "2", title: "Hair Spa & Hair Treatment", tags: ["Treatments", "Premium", "Wellness"], imageSrc: "http://img.b2bpic.net/free-photo/atmospheric-glamour-perfect-nice-blurred_1304-833.jpg?_wi=2", imageAlt: "Hair treatment" },
|
{ text: "Book Now", href: "contact" },
|
||||||
{ id: "3", title: "Hair Coloring & Highlights", tags: ["Color", "Styling", "Professional"], imageSrc: "http://img.b2bpic.net/free-photo/young-womwn-wearing-trendy-hairstyle_23-2149478888.jpg?_wi=2", imageAlt: "Hair coloring" },
|
{ text: "Learn More", href: "#" },
|
||||||
{ id: "4", title: "Beard Grooming", tags: ["Men", "Grooming", "Expert"], imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-bearded-brutal-tattooed-happy-man-holds-pomeranian-spitz-playing-with-lovely-pet_343596-1561.jpg?_wi=2", imageAlt: "Beard grooming" },
|
],
|
||||||
{ id: "5", title: "Facial & Skin Care", tags: ["Skincare", "Wellness", "Professional"], imageSrc: "http://img.b2bpic.net/free-photo/young-model-woman-beauty-salon-is-making-evening-make-up_231208-3585.jpg?_wi=2", imageAlt: "Facial care" },
|
features: [
|
||||||
{ id: "6", title: "Bridal Makeup", tags: ["Special", "Makeup", "Events"], imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205870.jpg?_wi=2", imageAlt: "Bridal makeup" }
|
"Expert stylists with 10+ years experience", "Premium international products", "Personalized consultation", "Color correction specialist"],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2", badge: "Men's Grooming", badgeIcon: Award,
|
||||||
|
price: "From $25", subtitle: "Premium beard & haircut services", buttons: [
|
||||||
|
{ text: "Book Now", href: "contact" },
|
||||||
|
{ text: "Learn More", href: "#" },
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Classic & modern cuts", "Precision beard grooming", "Hot towel treatment", "Premium grooming products"],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", badge: "Spa & Wellness", badgeIcon: Heart,
|
||||||
|
price: "From $35", subtitle: "Relaxation & rejuvenation treatments", buttons: [
|
||||||
|
{ text: "Book Now", href: "contact" },
|
||||||
|
{ text: "Learn More", href: "#" },
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Facial treatments", "Head & shoulder massage", "Aromatherapy sessions", "Luxury skincare products"],
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
animationType="slide-up"
|
title="Our Services"
|
||||||
|
description="Discover our comprehensive range of premium salon services designed for your complete satisfaction"
|
||||||
|
tag="Premium Services"
|
||||||
|
tagIcon={Zap}
|
||||||
|
tagAnimation="slide-up"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
|
animationType="slide-up"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
|
carouselMode="buttons"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="why-choose" data-section="why-choose">
|
<div id="gallery" data-section="gallery">
|
||||||
<MetricCardTwo
|
<MetricCardSeven
|
||||||
title="Why Choose Gallantry"
|
|
||||||
description="Excellence in every aspect of our service"
|
|
||||||
metrics={[
|
metrics={[
|
||||||
{ id: "1", value: "500+", description: "Happy Clients" },
|
{
|
||||||
{ id: "2", value: "8+", description: "Professional Stylists" },
|
id: "1", value: "500+", title: "Transformations Completed", items: ["Professional styling", "Color expertise", "Client satisfaction"],
|
||||||
{ id: "3", value: "100%", description: "Premium Products" },
|
},
|
||||||
{ id: "4", value: "15+", description: "Years of Experience" }
|
{
|
||||||
|
id: "2", value: "98%", title: "Client Satisfaction Rate", items: ["Repeat customers", "Premium service", "Expert care"],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", value: "24/7", title: "Customer Support", items: ["Online booking", "Quick response", "Expert advice"],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4", value: "10+", title: "Years of Excellence", items: ["Industry awards", "Trusted brand", "Premium quality"],
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
gridVariant="uniform-all-items-equal"
|
title="Why Choose Gallantry"
|
||||||
animationType="slide-up"
|
description="Our commitment to excellence in every detail"
|
||||||
|
tag="Why Us"
|
||||||
|
tagIcon={Award}
|
||||||
|
tagAnimation="slide-up"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
|
animationType="slide-up"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
|
carouselMode="buttons"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
<div id="testimonials" data-section="testimonials">
|
||||||
<TestimonialCardOne
|
<TestimonialCardTwelve
|
||||||
title="What Our Clients Say"
|
|
||||||
description="Real testimonials from satisfied customers who trust Gallantry for their grooming needs"
|
|
||||||
testimonials={[
|
testimonials={[
|
||||||
{ id: "1", name: "Priya Sharma", role: "Marketing Executive", company: "Tech Startup", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-woman-smiling-looking-mirror-beauty-salon_176420-4473.jpg?_wi=1", imageAlt: "Priya Sharma" },
|
{ id: "1", name: "Priya Singh", imageSrc: "/testimonial-1.jpg" },
|
||||||
{ id: "2", name: "Rajesh Kumar", role: "Business Owner", company: "Fashion Retail", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-face-massaging-with-gua-sha-medium-shot_23-2149349087.jpg?_wi=1", imageAlt: "Rajesh Kumar" },
|
{ id: "2", name: "Rahul Verma", imageSrc: "/testimonial-2.jpg" },
|
||||||
{ id: "3", name: "Neha Gupta", role: "Event Planner", company: "Event Management", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-charming-smile_329181-7290.jpg", imageAlt: "Neha Gupta" },
|
{ id: "3", name: "Anjali Sharma", imageSrc: "/testimonial-3.jpg" },
|
||||||
{ id: "4", name: "Amit Verma", role: "Entrepreneur", company: "Digital Agency", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/beauty-vlogger-adjusting-camera_23-2148916349.jpg", imageAlt: "Amit Verma" },
|
{ id: "4", name: "Vikram Kumar", imageSrc: "/testimonial-4.jpg" },
|
||||||
{ id: "5", name: "Sneha Patel", role: "HR Manager", company: "Corporate Office", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/female-hairdresser-woman-smiling-looking-mirror-beauty-salon_176420-4473.jpg?_wi=2", imageAlt: "Sneha Patel" },
|
|
||||||
{ id: "6", name: "Vikram Singh", role: "Fitness Trainer", company: "Gym Owner", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-face-massaging-with-gua-sha-medium-shot_23-2149349087.jpg?_wi=2", imageAlt: "Vikram Singh" }
|
|
||||||
]}
|
]}
|
||||||
gridVariant="uniform-all-items-equal"
|
cardTitle="Join 5,000+ satisfied clients who trust Gallantry for their styling needs"
|
||||||
animationType="slide-up"
|
cardTag="Client Reviews"
|
||||||
textboxLayout="default"
|
cardTagIcon={Heart}
|
||||||
|
cardAnimation="slide-up"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="location" data-section="location">
|
<div id="contact" data-section="contact">
|
||||||
<ContactFaq
|
<ContactSplit
|
||||||
ctaTitle="Visit Gallantry Unisex Salon"
|
tag="Get In Touch"
|
||||||
ctaDescription="Located in VVIP Style Mall, Raj Nagar Extension, Ghaziabad. Open: Monday – Sunday | 10:00 AM – 9:00 PM"
|
title="Book Your Appointment"
|
||||||
ctaButton={{ text: "Book Appointment on WhatsApp", href: "https://wa.me/919876543210" }}
|
description="Visit us at Raj Nagar Extension, Ghaziabad for a personalized consultation and premium grooming experience. Our expert team is ready to serve you."
|
||||||
ctaIcon={MapPin}
|
tagIcon={MapPin}
|
||||||
faqs={[
|
tagAnimation="slide-up"
|
||||||
{ id: "1", title: "What are your salon timings?", content: "We are open Monday to Sunday from 10:00 AM to 9:00 PM. Walk-ins are always welcome, but we recommend booking appointments in advance for better service." },
|
background={{ variant: "plain" }}
|
||||||
{ id: "2", title: "Where is the salon located?", content: "Gallantry Unisex Salon is located in VVIP Style Mall, Raj Nagar Extension, Ghaziabad. Easily accessible with ample parking and convenient public transportation." },
|
|
||||||
{ id: "3", title: "Do you provide services for men and women?", content: "Yes, we are a unisex salon offering premium services for both men and women including haircuts, styling, coloring, grooming, facials, and bridal makeup." },
|
|
||||||
{ id: "4", title: "How can I book an appointment?", content: "You can book an appointment by contacting us on WhatsApp, calling directly, or visiting our salon in person. We ensure minimal waiting time with our appointment booking system." },
|
|
||||||
{ id: "5", title: "What products do you use?", content: "We use only premium, professional-grade beauty and grooming products that are safe, effective, and suitable for all hair and skin types." }
|
|
||||||
]}
|
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
animationType="slide-up"
|
imageSrc="/contact-salon.jpg"
|
||||||
|
imageAlt="Gallantry salon contact location"
|
||||||
|
mediaAnimation="slide-up"
|
||||||
|
mediaPosition="right"
|
||||||
|
inputPlaceholder="Enter your email"
|
||||||
|
buttonText="Book Now"
|
||||||
|
termsText="We'll get back to you within 24 hours. Your privacy is important to us."
|
||||||
|
onSubmit={(email) => console.log("Email submitted:", email)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterBaseReveal
|
<FooterLogoReveal
|
||||||
columns={[
|
logoText="Gallantry"
|
||||||
{
|
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||||
title: "Services", items: [
|
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||||
{ label: "Hair Styling", href: "#services" },
|
|
||||||
{ label: "Hair Treatment", href: "#services" },
|
|
||||||
{ label: "Beard Grooming", href: "#services" },
|
|
||||||
{ label: "Facial Care", href: "#services" }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Quick Links", items: [
|
|
||||||
{ label: "About Us", href: "#about" },
|
|
||||||
{ label: "Our Team", href: "#services" },
|
|
||||||
{ label: "Book Appointment", href: "https://wa.me/919876543210" },
|
|
||||||
{ label: "Contact", href: "#location" }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Contact Info", items: [
|
|
||||||
{ label: "VVIP Style Mall, Raj Nagar Extension", href: "#" },
|
|
||||||
{ label: "Ghaziabad", href: "#" },
|
|
||||||
{ label: "Mon-Sun: 10 AM - 9 PM", href: "#" },
|
|
||||||
{ label: "WhatsApp: Book Now", href: "https://wa.me/919876543210" }
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]}
|
|
||||||
copyrightText="© 2025 Gallantry Unisex Salon. All rights reserved."
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
|
|||||||
Reference in New Issue
Block a user