Merge version_1 into main #3
@@ -1,53 +1,22 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
||||
import HeroSplit from "@/components/sections/hero/HeroSplit";
|
||||
import BlogCardThree from "@/components/sections/blog/BlogCardThree";
|
||||
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
|
||||
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
||||
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
|
||||
import Link from "next/link";
|
||||
import { Sparkles, Heart } from "lucide-react";
|
||||
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About Us", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Pricing", id: "/pricing" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
export default function GalleryPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About Us", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Bridal Studio", id: "/bridal" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Pricing", id: "/pricing" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Services", href: "/services" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Pricing", href: "/pricing" },
|
||||
{ label: "Book Appointment", href: "/contact" },
|
||||
{ label: "Contact Us", href: "/contact" },
|
||||
{ label: "Instagram", href: "https://instagram.com" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Refund Policy", href: "#" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="bounce-effect"
|
||||
@@ -61,47 +30,21 @@ export default function GalleryPage() {
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
{/* Navbar */}
|
||||
<div id="nav" data-section="nav" className="fixed top-0 left-0 right-0 z-50">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Luxe Beauty Studio"
|
||||
navItems={navItems.map((item) => ({
|
||||
name: item.name,
|
||||
id: item.id,
|
||||
}))}
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Book Appointment",
|
||||
href: "/contact",
|
||||
text: "Book Appointment", href: "/contact"
|
||||
}}
|
||||
className="bg-gradient-to-r from-rose-100 to-orange-50 backdrop-blur-lg border border-white/20"
|
||||
buttonClassName="bg-gradient-to-r from-amber-600 to-orange-500 hover:shadow-lg hover:shadow-orange-300/50 text-white font-semibold transition-all duration-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero" className="relative min-h-screen bg-gradient-to-br from-white via-amber-50 to-orange-50">
|
||||
<HeroSplit
|
||||
title="Bridal Portfolio & Transformations"
|
||||
description="Explore our stunning gallery of before-and-after transformations showcasing the artistry and expertise of our award-winning beauty professionals. Each image tells a story of confidence and radiance."
|
||||
tag="Gallery Showcase"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
background={{ variant: "glowing-orb" }}
|
||||
buttons={[
|
||||
{ text: "View All", href: "#gallery" },
|
||||
{ text: "Book Consultation", href: "/contact" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-bride-is-looking-happily-mysteriously-camera_8353-9143.jpg"
|
||||
imageAlt="Bridal Gallery Showcase"
|
||||
mediaAnimation="slide-up"
|
||||
imagePosition="right"
|
||||
className="relative overflow-hidden"
|
||||
textBoxClassName="space-y-6"
|
||||
titleClassName="text-5xl md:text-6xl font-bold bg-gradient-to-r from-amber-800 via-orange-600 to-amber-700 bg-clip-text text-transparent"
|
||||
descriptionClassName="text-lg text-gray-700 leading-relaxed"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery" data-section="gallery" className="relative bg-gradient-to-br from-white to-amber-50">
|
||||
{/* Gallery Section */}
|
||||
<div id="gallery" data-section="gallery" className="relative bg-gradient-to-br from-white to-amber-50 py-16 md:py-24 pt-24">
|
||||
<BlogCardThree
|
||||
title="Bridal Portfolio Gallery"
|
||||
description="Explore stunning before-and-after transformations and professional bridal photography showcasing our exceptional work"
|
||||
@@ -111,146 +54,52 @@ export default function GalleryPage() {
|
||||
useInvertedBackground={false}
|
||||
blogs={[
|
||||
{
|
||||
id: "1",
|
||||
category: "Bridal Makeup",
|
||||
title: "Radiant Bride Transformation",
|
||||
excerpt: "Stunning bridal makeup with elegant contouring and timeless elegance for the perfect wedding day look",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg?_wi=4",
|
||||
imageAlt: "Bridal Makeup Transformation",
|
||||
authorName: "Priya Sharma",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg",
|
||||
date: "Jan 2025",
|
||||
id: "1", category: "Bridal Makeup", title: "Radiant Bride Transformation", excerpt: "Stunning bridal makeup with elegant contouring and timeless elegance for the perfect wedding day look", imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg", imageAlt: "Bridal Makeup Transformation", authorName: "Priya Sharma", authorAvatar: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", date: "Jan 2025"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
category: "Hair Styling",
|
||||
title: "Golden Hair Elegance",
|
||||
excerpt: "Professional bridal hairstyle with intricate braids and premium styling for unforgettable wedding moments",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-blonde-twins-standing-face-face_329181-10735.jpg?_wi=2",
|
||||
imageAlt: "Professional Hair Transformation",
|
||||
authorName: "Anjali Verma",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/smiley-bride-getting-ready-front-view_23-2149721977.jpg",
|
||||
date: "Dec 2024",
|
||||
id: "2", category: "Hair Styling", title: "Golden Hair Elegance", excerpt: "Professional bridal hairstyle with intricate braids and premium styling for unforgettable wedding moments", imageSrc: "http://img.b2bpic.net/free-photo/smiling-blonde-twins-standing-face-face_329181-10735.jpg", imageAlt: "Professional Hair Transformation", authorName: "Anjali Verma", authorAvatar: "http://img.b2bpic.net/free-photo/smiley-bride-getting-ready-front-view_23-2149721977.jpg", date: "Dec 2024"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
category: "Groom Styling",
|
||||
title: "Groom Grooming Excellence",
|
||||
excerpt: "Professional groom styling and makeup for the perfect wedding day appearance and confidence",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-actress-make-up-movie_23-2149066319.jpg?_wi=2",
|
||||
imageAlt: "Groom Styling Service",
|
||||
authorName: "Ritika Singh",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/medium-shot-smiley-girl-getting-make-up-from-friend_23-2148299455.jpg",
|
||||
date: "Nov 2024",
|
||||
id: "3", category: "Groom Styling", title: "Groom Grooming Excellence", excerpt: "Professional groom styling and makeup for the perfect wedding day appearance and confidence", imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-actress-make-up-movie_23-2149066319.jpg", imageAlt: "Groom Styling Service", authorName: "Ritika Singh", authorAvatar: "http://img.b2bpic.net/free-photo/medium-shot-smiley-girl-getting-make-up-from-friend_23-2148299455.jpg", date: "Nov 2024"
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
category: "Salon Interior",
|
||||
title: "Luxury Studio Ambiance",
|
||||
excerpt: "Premium salon environment designed for comfort and relaxation during your beauty transformations",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-child-having-fun-posing-studio_1328-2354.jpg?_wi=2",
|
||||
imageAlt: "Luxury Beauty Studio",
|
||||
authorName: "Divya Patel",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/front-view-bride-posing-indoors_23-2150264551.jpg",
|
||||
date: "Oct 2024",
|
||||
id: "4", category: "Salon Interior", title: "Luxury Studio Ambiance", excerpt: "Premium salon environment designed for comfort and relaxation during your beauty transformations", imageSrc: "http://img.b2bpic.net/free-photo/girl-child-having-fun-posing-studio_1328-2354.jpg", imageAlt: "Luxury Beauty Studio", authorName: "Divya Patel", authorAvatar: "http://img.b2bpic.net/free-photo/front-view-bride-posing-indoors_23-2150264551.jpg", date: "Oct 2024"
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
uniformGridCustomHeightClasses="min-h-[500px]"
|
||||
titleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
descriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
cardTitleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
cardDescriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
carouselMode="buttons"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials" className="relative bg-gradient-to-r from-amber-50 to-orange-50">
|
||||
<TestimonialCardTwelve
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Priya Sharma",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg?_wi=5",
|
||||
imageAlt: "Priya Sharma",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Anjali Verma",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-bride-getting-ready-front-view_23-2149721977.jpg?_wi=3",
|
||||
imageAlt: "Anjali Verma",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Divya Patel",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-girl-getting-make-up-from-friend_23-2148299455.jpg?_wi=2",
|
||||
imageAlt: "Divya Patel",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Ritika Singh",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-bride-posing-indoors_23-2150264551.jpg?_wi=2",
|
||||
imageAlt: "Ritika Singh",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Neha Gupta",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-bride-enveloped-veil_8353-8131.jpg?_wi=2",
|
||||
imageAlt: "Neha Gupta",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Shreya Reddy",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-woman-standing-isolated-white-background_231208-9481.jpg?_wi=2",
|
||||
imageAlt: "Shreya Reddy",
|
||||
},
|
||||
]}
|
||||
cardTitle="Over 5,000+ Brides Trust Us for Their Perfect Beauty Transformation"
|
||||
cardTag="Trusted by Thousands"
|
||||
cardTagIcon={Heart}
|
||||
cardAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
cardClassName="bg-gradient-to-br from-amber-50 to-orange-50 border border-amber-200/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact" className="relative bg-gradient-to-r from-amber-50 to-orange-50">
|
||||
{/* Contact Section */}
|
||||
<div id="contact" data-section="contact" className="relative bg-gradient-to-r from-amber-50 to-orange-50 py-16 md:py-24">
|
||||
<ContactSplitForm
|
||||
title="Book Your Beauty Appointment"
|
||||
description="Schedule your transformation today. Contact us to reserve your preferred date and time with our expert beauty professionals."
|
||||
useInvertedBackground={false}
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Full Name",
|
||||
required: true,
|
||||
name: "name", type: "text", placeholder: "Your Full Name", required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email Address",
|
||||
required: true,
|
||||
name: "email", type: "email", placeholder: "Your Email Address", required: true,
|
||||
},
|
||||
{
|
||||
name: "phone",
|
||||
type: "tel",
|
||||
placeholder: "Contact Number",
|
||||
required: true,
|
||||
name: "phone", type: "tel", placeholder: "Contact Number", required: true,
|
||||
},
|
||||
{
|
||||
name: "service",
|
||||
type: "text",
|
||||
placeholder: "Service Interested In",
|
||||
required: true,
|
||||
name: "service", type: "text", placeholder: "Service Interested In", required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Tell us about your beauty needs and preferred date...",
|
||||
rows: 5,
|
||||
name: "message", placeholder: "Tell us about your beauty needs and preferred date...", rows: 5,
|
||||
required: true,
|
||||
}}
|
||||
buttonText="Confirm Booking"
|
||||
imageSrc="http://img.b2bpic.net/free-vector/beauty-invoice-poster-design_23-2149651367.jpg?_wi=4"
|
||||
imageSrc="http://img.b2bpic.net/free-vector/beauty-invoice-poster-design_23-2149651367.jpg"
|
||||
imageAlt="Book Appointment"
|
||||
mediaAnimation="slide-up"
|
||||
mediaPosition="right"
|
||||
@@ -260,10 +109,60 @@ export default function GalleryPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div id="footer" data-section="footer" className="relative">
|
||||
<FooterLogoEmphasis
|
||||
logoText="Luxe Beauty Studio"
|
||||
columns={footerColumns}
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home", href: "/"
|
||||
},
|
||||
{
|
||||
label: "About Us", href: "/about"
|
||||
},
|
||||
{
|
||||
label: "Services", href: "/services"
|
||||
},
|
||||
{
|
||||
label: "Gallery", href: "/gallery"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Pricing", href: "/pricing"
|
||||
},
|
||||
{
|
||||
label: "Book Appointment", href: "/contact"
|
||||
},
|
||||
{
|
||||
label: "Contact Us", href: "/contact"
|
||||
},
|
||||
{
|
||||
label: "Instagram", href: "https://instagram.com"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Terms of Service", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Refund Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Contact", href: "/contact"
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
containerClassName="bg-gradient-to-r from-amber-50 to-orange-50 border-t border-amber-200/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
122
src/app/page.tsx
122
src/app/page.tsx
@@ -17,11 +17,10 @@ import { Sparkles, Award, ShieldCheck, Users, Home, Star, Crown, Zap, Heart } fr
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About Us", id: "/about" },
|
||||
{ name: "Services", id: "/" },
|
||||
{ name: "Bridal Studio", id: "/" },
|
||||
{ name: "Gallery", id: "/" },
|
||||
{ name: "Pricing", id: "/" },
|
||||
{ name: "Contact", id: "/" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Pricing", id: "/pricing" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
export default function HomePage() {
|
||||
@@ -44,7 +43,8 @@ export default function HomePage() {
|
||||
brandName="Luxe Beauty Studio"
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Book Appointment", href: "/"}}
|
||||
text: "Book Appointment", href: "/contact"
|
||||
}}
|
||||
className="bg-gradient-to-r from-rose-100 to-orange-50 backdrop-blur-lg border border-white/20"
|
||||
buttonClassName="bg-gradient-to-r from-amber-600 to-orange-500 hover:shadow-lg hover:shadow-orange-300/50 text-white font-semibold transition-all duration-300"
|
||||
/>
|
||||
@@ -61,9 +61,11 @@ export default function HomePage() {
|
||||
background={{ variant: "glowing-orb" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment", href: "/"},
|
||||
text: "Book Appointment", href: "/contact"
|
||||
},
|
||||
{
|
||||
text: "Explore Services", href: "/"},
|
||||
text: "Explore Services", href: "/services"
|
||||
},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fashion-beautiful-brunette-girl-with-bright-make-up_176420-711.jpg"
|
||||
@@ -103,7 +105,8 @@ export default function HomePage() {
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More", href: "/"},
|
||||
text: "Learn More", href: "#"
|
||||
},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/professional-women-stylish-suit-office-with-tablet-device_23-2150167800.jpg"
|
||||
@@ -126,16 +129,20 @@ export default function HomePage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1", title: "Beauty Services", description: "Professional facials, cleansing, bleaching, threading, and waxing treatments designed to enhance your skin naturally", tag: "Beauty", imageSrc: "http://img.b2bpic.net/free-photo/client-lies-salon-cosmetology-table-with-white-mask-her-face_343596-4298.jpg", imageAlt: "Beauty Facial Treatment"},
|
||||
id: "1", title: "Beauty Services", description: "Professional facials, cleansing, bleaching, threading, and waxing treatments designed to enhance your skin naturally", tag: "Beauty", imageSrc: "http://img.b2bpic.net/free-photo/client-lies-salon-cosmetology-table-with-white-mask-her-face_343596-4298.jpg", imageAlt: "Beauty Facial Treatment"
|
||||
},
|
||||
{
|
||||
id: "2", title: "Hair Services", description: "Expert haircuts, treatments, coloring, and keratin services to transform your locks with premium products", tag: "Hair", imageSrc: "http://img.b2bpic.net/free-photo/beautiufl-caucasian-lady-went-home-sits-armchair-th-living-room_132075-9638.jpg", imageAlt: "Professional Hairstyling"},
|
||||
id: "2", title: "Hair Services", description: "Expert haircuts, treatments, coloring, and keratin services to transform your locks with premium products", tag: "Hair", imageSrc: "http://img.b2bpic.net/free-photo/beautiufl-caucasian-lady-went-home-sits-armchair-th-living-room_132075-9638.jpg", imageAlt: "Professional Hairstyling"
|
||||
},
|
||||
{
|
||||
id: "3", title: "Bridal Services", description: "Complete bridal makeup, pre-bridal packages, and groom styling for your perfect wedding day", tag: "Bridal", imageSrc: "http://img.b2bpic.net/free-photo/cosmetologist-applying-product-client_23-2148398573.jpg", imageAlt: "Bridal Makeup Services"},
|
||||
id: "3", title: "Bridal Services", description: "Complete bridal makeup, pre-bridal packages, and groom styling for your perfect wedding day", tag: "Bridal", imageSrc: "http://img.b2bpic.net/free-photo/cosmetologist-applying-product-client_23-2148398573.jpg", imageAlt: "Bridal Makeup Services"
|
||||
},
|
||||
{
|
||||
id: "4", title: "Boutique Collection", description: "Designer lehengas, bridal dresses, and custom stitching services curated for your special occasions", tag: "Boutique", imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-with-long-brown-curly-hair-sitting-dressing-room-wardrobe-shocked-disappointed-doesn-t-know-what-wear-hard-make-choice-model-with-elegant-look-black-fancy-dress_197531-1677.jpg", imageAlt: "Designer Bridal Wear"},
|
||||
id: "4", title: "Boutique Collection", description: "Designer lehengas, bridal dresses, and custom stitching services curated for your special occasions", tag: "Boutique", imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-with-long-brown-curly-hair-sitting-dressing-room-wardrobe-shocked-disappointed-doesn-t-know-what-wear-hard-make-choice-model-with-elegant-look-black-fancy-dress_197531-1677.jpg", imageAlt: "Designer Bridal Wear"
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
itemClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
titleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
cardDescriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
carouselMode="buttons"
|
||||
/>
|
||||
@@ -152,13 +159,17 @@ export default function HomePage() {
|
||||
useInvertedBackground={false}
|
||||
blogs={[
|
||||
{
|
||||
id: "1", category: "Bridal Makeup", title: "Radiant Bride Transformation", excerpt: "Stunning bridal makeup with elegant contouring and timeless elegance for the perfect wedding day look", imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg", imageAlt: "Bridal Makeup Transformation", authorName: "Priya Sharma", authorAvatar: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", date: "Jan 2025"},
|
||||
id: "1", category: "Bridal Makeup", title: "Radiant Bride Transformation", excerpt: "Stunning bridal makeup with elegant contouring and timeless elegance for the perfect wedding day look", imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg", imageAlt: "Bridal Makeup Transformation", authorName: "Priya Sharma", authorAvatar: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", date: "Jan 2025"
|
||||
},
|
||||
{
|
||||
id: "2", category: "Hair Styling", title: "Golden Hair Elegance", excerpt: "Professional bridal hairstyle with intricate braids and premium styling for unforgettable wedding moments", imageSrc: "http://img.b2bpic.net/free-photo/smiling-blonde-twins-standing-face-face_329181-10735.jpg", imageAlt: "Professional Hair Transformation", authorName: "Anjali Verma", authorAvatar: "http://img.b2bpic.net/free-photo/smiley-bride-getting-ready-front-view_23-2149721977.jpg", date: "Dec 2024"},
|
||||
id: "2", category: "Hair Styling", title: "Golden Hair Elegance", excerpt: "Professional bridal hairstyle with intricate braids and premium styling for unforgettable wedding moments", imageSrc: "http://img.b2bpic.net/free-photo/smiling-blonde-twins-standing-face-face_329181-10735.jpg", imageAlt: "Professional Hair Transformation", authorName: "Anjali Verma", authorAvatar: "http://img.b2bpic.net/free-photo/smiley-bride-getting-ready-front-view_23-2149721977.jpg", date: "Dec 2024"
|
||||
},
|
||||
{
|
||||
id: "3", category: "Groom Styling", title: "Groom Grooming Excellence", excerpt: "Professional groom styling and makeup for the perfect wedding day appearance and confidence", imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-actress-make-up-movie_23-2149066319.jpg", imageAlt: "Groom Styling Service", authorName: "Ritika Singh", authorAvatar: "http://img.b2bpic.net/free-photo/medium-shot-smiley-girl-getting-make-up-from-friend_23-2148299455.jpg", date: "Nov 2024"},
|
||||
id: "3", category: "Groom Styling", title: "Groom Grooming Excellence", excerpt: "Professional groom styling and makeup for the perfect wedding day appearance and confidence", imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-actress-make-up-movie_23-2149066319.jpg", imageAlt: "Groom Styling Service", authorName: "Ritika Singh", authorAvatar: "http://img.b2bpic.net/free-photo/medium-shot-smiley-girl-getting-make-up-from-friend_23-2148299455.jpg", date: "Nov 2024"
|
||||
},
|
||||
{
|
||||
id: "4", category: "Salon Interior", title: "Luxury Studio Ambiance", excerpt: "Premium salon environment designed for comfort and relaxation during your beauty transformations", imageSrc: "http://img.b2bpic.net/free-photo/girl-child-having-fun-posing-studio_1328-2354.jpg", imageAlt: "Luxury Beauty Studio", authorName: "Divya Patel", authorAvatar: "http://img.b2bpic.net/free-photo/front-view-bride-posing-indoors_23-2150264551.jpg", date: "Oct 2024"},
|
||||
id: "4", category: "Salon Interior", title: "Luxury Studio Ambiance", excerpt: "Premium salon environment designed for comfort and relaxation during your beauty transformations", imageSrc: "http://img.b2bpic.net/free-photo/girl-child-having-fun-posing-studio_1328-2354.jpg", imageAlt: "Luxury Beauty Studio", authorName: "Divya Patel", authorAvatar: "http://img.b2bpic.net/free-photo/front-view-bride-posing-indoors_23-2150264551.jpg", date: "Oct 2024"
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
uniformGridCustomHeightClasses="min-h-[500px]"
|
||||
@@ -173,17 +184,23 @@ export default function HomePage() {
|
||||
<TestimonialCardTwelve
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Priya Sharma", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", imageAlt: "Priya Sharma"},
|
||||
id: "1", name: "Priya Sharma", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", imageAlt: "Priya Sharma"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Anjali Verma", imageSrc: "http://img.b2bpic.net/free-photo/smiley-bride-getting-ready-front-view_23-2149721977.jpg", imageAlt: "Anjali Verma"},
|
||||
id: "2", name: "Anjali Verma", imageSrc: "http://img.b2bpic.net/free-photo/smiley-bride-getting-ready-front-view_23-2149721977.jpg", imageAlt: "Anjali Verma"
|
||||
},
|
||||
{
|
||||
id: "3", name: "Divya Patel", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-girl-getting-make-up-from-friend_23-2148299455.jpg", imageAlt: "Divya Patel"},
|
||||
id: "3", name: "Divya Patel", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-girl-getting-make-up-from-friend_23-2148299455.jpg", imageAlt: "Divya Patel"
|
||||
},
|
||||
{
|
||||
id: "4", name: "Ritika Singh", imageSrc: "http://img.b2bpic.net/free-photo/front-view-bride-posing-indoors_23-2150264551.jpg", imageAlt: "Ritika Singh"},
|
||||
id: "4", name: "Ritika Singh", imageSrc: "http://img.b2bpic.net/free-photo/front-view-bride-posing-indoors_23-2150264551.jpg", imageAlt: "Ritika Singh"
|
||||
},
|
||||
{
|
||||
id: "5", name: "Neha Gupta", imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-bride-enveloped-veil_8353-8131.jpg", imageAlt: "Neha Gupta"},
|
||||
id: "5", name: "Neha Gupta", imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-bride-enveloped-veil_8353-8131.jpg", imageAlt: "Neha Gupta"
|
||||
},
|
||||
{
|
||||
id: "6", name: "Shreya Reddy", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-woman-standing-isolated-white-background_231208-9481.jpg", imageAlt: "Shreya Reddy"},
|
||||
id: "6", name: "Shreya Reddy", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-woman-standing-isolated-white-background_231208-9481.jpg", imageAlt: "Shreya Reddy"
|
||||
},
|
||||
]}
|
||||
cardTitle="Over 5,000+ Brides Trust Us for Their Perfect Beauty Transformation"
|
||||
cardTag="Trusted by Thousands"
|
||||
@@ -207,22 +224,26 @@ export default function HomePage() {
|
||||
{
|
||||
id: "1", badge: "Popular Choice", badgeIcon: Sparkles,
|
||||
price: "₹5,999", subtitle: "Bridal Makeup Package", features: [
|
||||
"Full bridal makeup application", "Hair styling included", "Trial session available", "Touch-up kit provided", "Professional photography ready"],
|
||||
"Full bridal makeup application", "Hair styling included", "Trial session available", "Touch-up kit provided", "Professional photography ready"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2", badge: "Bestseller", badgeIcon: Star,
|
||||
price: "₹8,999", subtitle: "Complete Bridal Transformation", features: [
|
||||
"Premium bridal makeup", "Expert hair styling & treatment", "Pre-bridal facial included", "Groom styling consultation", "Day-before preparation", "Emergency touch-up service"],
|
||||
"Premium bridal makeup", "Expert hair styling & treatment", "Pre-bridal facial included", "Groom styling consultation", "Day-before preparation", "Emergency touch-up service"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3", badge: "Luxury", badgeIcon: Crown,
|
||||
price: "₹12,999", subtitle: "Ultimate Bridal Experience", features: [
|
||||
"Personal beauty consultant", "Complete bridal transformation", "Hair and makeup team", "Premium product selection", "3-month beauty package", "VIP treatment & priority booking"],
|
||||
"Personal beauty consultant", "Complete bridal transformation", "Hair and makeup team", "Premium product selection", "3-month beauty package", "VIP treatment & priority booking"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "4", badge: "Quick Service", badgeIcon: Zap,
|
||||
price: "₹2,999", subtitle: "Express Beauty Service", features: [
|
||||
"Quick makeup application", "Basic hair styling", "Perfect for events", "30-minute service", "Professional finish"],
|
||||
"Quick makeup application", "Basic hair styling", "Perfect for events", "30-minute service", "Professional finish"
|
||||
],
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
@@ -243,11 +264,14 @@ export default function HomePage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "1", value: "5000+", title: "Happy Brides", description: "Transformed with our premium bridal services", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", imageAlt: "Happy Bride"},
|
||||
id: "1", value: "5000+", title: "Happy Brides", description: "Transformed with our premium bridal services", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", imageAlt: "Happy Bride"
|
||||
},
|
||||
{
|
||||
id: "2", value: "98%", title: "Satisfaction Rate", description: "Clients consistently rate us excellent", imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg", imageAlt: "Satisfaction"},
|
||||
id: "2", value: "98%", title: "Satisfaction Rate", description: "Clients consistently rate us excellent", imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg", imageAlt: "Satisfaction"
|
||||
},
|
||||
{
|
||||
id: "3", value: "500+", title: "Monthly Clients", description: "Trust our studio for beauty services", imageSrc: "http://img.b2bpic.net/free-photo/professional-women-stylish-suit-office-with-tablet-device_23-2150167800.jpg", imageAlt: "Clients"},
|
||||
id: "3", value: "500+", title: "Monthly Clients", description: "Trust our studio for beauty services", imageSrc: "http://img.b2bpic.net/free-photo/professional-women-stylish-suit-office-with-tablet-device_23-2150167800.jpg", imageAlt: "Clients"
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textBoxTitleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
@@ -298,37 +322,49 @@ export default function HomePage() {
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home", href: "/"},
|
||||
label: "Home", href: "/"
|
||||
},
|
||||
{
|
||||
label: "About Us", href: "/about"},
|
||||
label: "About Us", href: "/about"
|
||||
},
|
||||
{
|
||||
label: "Services", href: "/"},
|
||||
label: "Services", href: "/services"
|
||||
},
|
||||
{
|
||||
label: "Gallery", href: "/"},
|
||||
label: "Gallery", href: "/gallery"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Pricing", href: "/"},
|
||||
label: "Pricing", href: "/pricing"
|
||||
},
|
||||
{
|
||||
label: "Book Appointment", href: "/"},
|
||||
label: "Book Appointment", href: "/contact"
|
||||
},
|
||||
{
|
||||
label: "Contact Us", href: "/"},
|
||||
label: "Contact Us", href: "/contact"
|
||||
},
|
||||
{
|
||||
label: "Instagram", href: "https://instagram.com"},
|
||||
label: "Instagram", href: "https://instagram.com"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy", href: "#"},
|
||||
label: "Privacy Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Terms of Service", href: "#"},
|
||||
label: "Terms of Service", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Refund Policy", href: "#"},
|
||||
label: "Refund Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Contact", href: "/"},
|
||||
label: "Contact", href: "/contact"
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
@@ -5,47 +5,20 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
||||
import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
|
||||
import MetricCardEleven from "@/components/sections/metrics/MetricCardEleven";
|
||||
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
||||
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
|
||||
import { Sparkles, Star, Crown, Zap } from "lucide-react";
|
||||
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About Us", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Pricing", id: "/pricing" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
export default function PricingPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "About Us", id: "/about" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Bridal Studio", id: "/bridal" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Pricing", id: "/pricing" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Services", href: "/services" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Pricing", href: "/pricing" },
|
||||
{ label: "Book Appointment", href: "/contact" },
|
||||
{ label: "Contact Us", href: "/contact" },
|
||||
{ label: "Instagram", href: "https://instagram.com" },
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Refund Policy", href: "#" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="bounce-effect"
|
||||
@@ -59,141 +32,178 @@ export default function PricingPage() {
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
{/* Navbar */}
|
||||
<div id="nav" data-section="nav" className="fixed top-0 left-0 right-0 z-50">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Luxe Beauty Studio"
|
||||
navItems={navItems.map((item) => ({
|
||||
name: item.name,
|
||||
id: item.id,
|
||||
}))}
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Book Appointment",
|
||||
href: "/contact",
|
||||
text: "Book Appointment", href: "/contact"
|
||||
}}
|
||||
className="bg-gradient-to-r from-rose-100 to-orange-50 backdrop-blur-lg border border-white/20"
|
||||
buttonClassName="bg-gradient-to-r from-amber-600 to-orange-500 hover:shadow-lg hover:shadow-orange-300/50 text-white font-semibold transition-all duration-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing" className="relative bg-white">
|
||||
{/* Pricing Section */}
|
||||
<div id="pricing" data-section="pricing" className="relative bg-white py-16 md:py-24 pt-24">
|
||||
<PricingCardOne
|
||||
plans={[
|
||||
{
|
||||
id: "1",
|
||||
badge: "Popular Choice",
|
||||
badgeIcon: Sparkles,
|
||||
price: "₹5,999",
|
||||
subtitle: "Bridal Makeup Package",
|
||||
features: [
|
||||
"Full bridal makeup application",
|
||||
"Hair styling included",
|
||||
"Trial session available",
|
||||
"Touch-up kit provided",
|
||||
"Professional photography ready",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
badge: "Bestseller",
|
||||
badgeIcon: Star,
|
||||
price: "₹8,999",
|
||||
subtitle: "Complete Bridal Transformation",
|
||||
features: [
|
||||
"Premium bridal makeup",
|
||||
"Expert hair styling & treatment",
|
||||
"Pre-bridal facial included",
|
||||
"Groom styling consultation",
|
||||
"Day-before preparation",
|
||||
"Emergency touch-up service",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
badge: "Luxury",
|
||||
badgeIcon: Crown,
|
||||
price: "₹12,999",
|
||||
subtitle: "Ultimate Bridal Experience",
|
||||
features: [
|
||||
"Personal beauty consultant",
|
||||
"Complete bridal transformation",
|
||||
"Hair and makeup team",
|
||||
"Premium product selection",
|
||||
"3-month beauty package",
|
||||
"VIP treatment & priority booking",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
badge: "Quick Service",
|
||||
badgeIcon: Zap,
|
||||
price: "₹2,999",
|
||||
subtitle: "Express Beauty Service",
|
||||
features: [
|
||||
"Quick makeup application",
|
||||
"Basic hair styling",
|
||||
"Perfect for events",
|
||||
"30-minute service",
|
||||
"Professional finish",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Luxury Beauty Packages"
|
||||
description="Choose from our curated collection of premium beauty and bridal packages designed for every occasion"
|
||||
tag="Premium Pricing"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "1", badge: "Popular Choice", badgeIcon: Sparkles,
|
||||
price: "₹5,999", subtitle: "Bridal Makeup Package", features: [
|
||||
"Full bridal makeup application", "Hair styling included", "Trial session available", "Touch-up kit provided", "Professional photography ready"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2", badge: "Bestseller", badgeIcon: Star,
|
||||
price: "₹8,999", subtitle: "Complete Bridal Transformation", features: [
|
||||
"Premium bridal makeup", "Expert hair styling & treatment", "Pre-bridal facial included", "Groom styling consultation", "Day-before preparation", "Emergency touch-up service"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3", badge: "Luxury", badgeIcon: Crown,
|
||||
price: "₹12,999", subtitle: "Ultimate Bridal Experience", features: [
|
||||
"Personal beauty consultant", "Complete bridal transformation", "Hair and makeup team", "Premium product selection", "3-month beauty package", "VIP treatment & priority booking"
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "4", badge: "Quick Service", badgeIcon: Zap,
|
||||
price: "₹2,999", subtitle: "Express Beauty Service", features: [
|
||||
"Quick makeup application", "Basic hair styling", "Perfect for events", "30-minute service", "Professional finish"
|
||||
],
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textBoxTitleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
textBoxDescriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
carouselMode="buttons"
|
||||
titleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
descriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics" className="relative bg-gradient-to-br from-white via-amber-50 to-white">
|
||||
{/* Metrics Section */}
|
||||
<div id="metrics" data-section="metrics" className="relative bg-gradient-to-br from-white via-amber-50 to-white py-16 md:py-24">
|
||||
<MetricCardEleven
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "5000+",
|
||||
title: "Happy Brides",
|
||||
description: "Transformed with our premium bridal services",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg?_wi=6",
|
||||
imageAlt: "Happy Bride",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
value: "98%",
|
||||
title: "Satisfaction Rate",
|
||||
description: "Clients consistently rate us excellent",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg?_wi=5",
|
||||
imageAlt: "Satisfaction",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
value: "500+",
|
||||
title: "Monthly Clients",
|
||||
description: "Trust our studio for beauty services",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-women-stylish-suit-office-with-tablet-device_23-2150167800.jpg?_wi=5",
|
||||
imageAlt: "Clients",
|
||||
},
|
||||
]}
|
||||
title="Our Achievement Highlights"
|
||||
description="Celebrating excellence in beauty transformation and customer satisfaction"
|
||||
tag="Proven Excellence"
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "1", value: "5000+", title: "Happy Brides", description: "Transformed with our premium bridal services", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-holding-flowers_23-2149580422.jpg", imageAlt: "Happy Bride"
|
||||
},
|
||||
{
|
||||
id: "2", value: "98%", title: "Satisfaction Rate", description: "Clients consistently rate us excellent", imageSrc: "http://img.b2bpic.net/free-photo/master-class-make-up-girl-makes-make-up-her-friend_1321-1461.jpg", imageAlt: "Satisfaction"
|
||||
},
|
||||
{
|
||||
id: "3", value: "500+", title: "Monthly Clients", description: "Trust our studio for beauty services", imageSrc: "http://img.b2bpic.net/free-photo/professional-women-stylish-suit-office-with-tablet-device_23-2150167800.jpg", imageAlt: "Clients"
|
||||
},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
titleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
descriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
cardTitleClassName="text-2xl md:text-3xl font-semibold text-gray-800"
|
||||
cardDescriptionClassName="text-base text-gray-600 leading-relaxed"
|
||||
textBoxTitleClassName="text-4xl md:text-5xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
textBoxDescriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Contact Section */}
|
||||
<div id="contact" data-section="contact" className="relative bg-gradient-to-r from-amber-50 to-orange-50 py-16 md:py-24">
|
||||
<ContactSplitForm
|
||||
title="Book Your Beauty Appointment"
|
||||
description="Schedule your transformation today. Contact us to reserve your preferred date and time with our expert beauty professionals."
|
||||
useInvertedBackground={false}
|
||||
inputs={[
|
||||
{
|
||||
name: "name", type: "text", placeholder: "Your Full Name", required: true,
|
||||
},
|
||||
{
|
||||
name: "email", type: "email", placeholder: "Your Email Address", required: true,
|
||||
},
|
||||
{
|
||||
name: "phone", type: "tel", placeholder: "Contact Number", required: true,
|
||||
},
|
||||
{
|
||||
name: "service", type: "text", placeholder: "Service Interested In", required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message", placeholder: "Tell us about your beauty needs and preferred date...", rows: 5,
|
||||
required: true,
|
||||
}}
|
||||
buttonText="Confirm Booking"
|
||||
imageSrc="http://img.b2bpic.net/free-vector/beauty-invoice-poster-design_23-2149651367.jpg"
|
||||
imageAlt="Book Appointment"
|
||||
mediaAnimation="slide-up"
|
||||
mediaPosition="right"
|
||||
titleClassName="text-3xl md:text-4xl font-bold bg-gradient-to-r from-amber-700 to-orange-600 bg-clip-text text-transparent"
|
||||
descriptionClassName="text-lg text-gray-600 leading-relaxed"
|
||||
buttonClassName="w-full bg-gradient-to-r from-amber-600 to-orange-500 hover:shadow-lg hover:shadow-orange-300/50 text-white font-semibold py-3 rounded-lg transition-all duration-300"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div id="footer" data-section="footer" className="relative">
|
||||
<FooterLogoEmphasis
|
||||
columns={footerColumns}
|
||||
logoText="Luxe Beauty Studio"
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home", href: "/"
|
||||
},
|
||||
{
|
||||
label: "About Us", href: "/about"
|
||||
},
|
||||
{
|
||||
label: "Services", href: "/services"
|
||||
},
|
||||
{
|
||||
label: "Gallery", href: "/gallery"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Pricing", href: "/pricing"
|
||||
},
|
||||
{
|
||||
label: "Book Appointment", href: "/contact"
|
||||
},
|
||||
{
|
||||
label: "Contact Us", href: "/contact"
|
||||
},
|
||||
{
|
||||
label: "Instagram", href: "https://instagram.com"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Terms of Service", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Refund Policy", href: "#"
|
||||
},
|
||||
{
|
||||
label: "Contact", href: "/contact"
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
containerClassName="bg-gradient-to-r from-amber-50 to-orange-50 border-t border-amber-200/50"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -1,51 +1,47 @@
|
||||
"use client";
|
||||
|
||||
import { memo } from "react";
|
||||
import useSvgTextLogo from "./useSvgTextLogo";
|
||||
import { cls } from "@/lib/utils";
|
||||
import React from "react";
|
||||
|
||||
interface SvgTextLogoProps {
|
||||
logoText: string;
|
||||
adjustHeightFactor?: number;
|
||||
verticalAlign?: "top" | "center";
|
||||
text?: string;
|
||||
className?: string;
|
||||
fontSize?: number;
|
||||
fontWeight?: number | string;
|
||||
letterSpacing?: number;
|
||||
fill?: string;
|
||||
}
|
||||
|
||||
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
|
||||
logoText,
|
||||
adjustHeightFactor,
|
||||
verticalAlign = "top",
|
||||
className = "",
|
||||
}) {
|
||||
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
|
||||
export const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
|
||||
text = "Webild", className = "", fontSize = 48,
|
||||
fontWeight = "bold", letterSpacing = 2,
|
||||
fill = "currentColor"}) => {
|
||||
const textLength = text.length;
|
||||
const charWidth = fontSize * 0.6;
|
||||
const width = textLength * charWidth + letterSpacing * (textLength - 1) + 40;
|
||||
const height = fontSize + 40;
|
||||
|
||||
return (
|
||||
<svg
|
||||
ref={svgRef}
|
||||
viewBox={viewBox}
|
||||
className={cls("w-full", className)}
|
||||
style={{ aspectRatio: aspectRatio }}
|
||||
preserveAspectRatio="none"
|
||||
role="img"
|
||||
aria-label={`${logoText} logo`}
|
||||
width={width}
|
||||
height={height}
|
||||
viewBox={`0 0 ${width} ${height}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className={className}
|
||||
aria-label={text}
|
||||
>
|
||||
<text
|
||||
ref={textRef}
|
||||
x="0"
|
||||
y={verticalAlign === "center" ? "50%" : "0"}
|
||||
className="font-bold fill-current"
|
||||
style={{
|
||||
fontSize: "20px",
|
||||
letterSpacing: "-0.02em",
|
||||
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
|
||||
}}
|
||||
x={width / 2}
|
||||
y={height / 2}
|
||||
textAnchor="middle"
|
||||
dominantBaseline="middle"
|
||||
fontSize={fontSize}
|
||||
fontWeight={fontWeight}
|
||||
letterSpacing={letterSpacing}
|
||||
fill={fill}
|
||||
fontFamily="system-ui, -apple-system, sans-serif"
|
||||
>
|
||||
{logoText}
|
||||
{text}
|
||||
</text>
|
||||
</svg>
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
SvgTextLogo.displayName = "SvgTextLogo";
|
||||
|
||||
export default SvgTextLogo;
|
||||
export default SvgTextLogo;
|
||||
Reference in New Issue
Block a user