15 Commits

Author SHA1 Message Date
6500c6244a Update src/app/about/page.tsx 2026-04-28 18:16:04 +00:00
c361a68dc7 Update src/app/services/page.tsx 2026-04-28 18:15:33 +00:00
ecdee224b4 Update src/app/reviews/page.tsx 2026-04-28 18:15:32 +00:00
120275fec2 Update src/app/page.tsx 2026-04-28 18:15:32 +00:00
7803d2c20f Update src/app/gallery/page.tsx 2026-04-28 18:15:31 +00:00
b966d0f83b Update src/app/contact/page.tsx 2026-04-28 18:15:31 +00:00
9a09e37bad Update src/app/booking/page.tsx 2026-04-28 18:15:30 +00:00
6ca2e35b57 Update src/app/about/page.tsx 2026-04-28 18:15:30 +00:00
4bf94e5719 Add src/app/services/page.tsx 2026-04-28 18:14:54 +00:00
a25633bcbd Add src/app/reviews/page.tsx 2026-04-28 18:14:54 +00:00
2438825361 Update src/app/page.tsx 2026-04-28 18:14:53 +00:00
beeb827d96 Add src/app/gallery/page.tsx 2026-04-28 18:14:53 +00:00
021d12c022 Add src/app/contact/page.tsx 2026-04-28 18:14:52 +00:00
44170700b4 Add src/app/booking/page.tsx 2026-04-28 18:14:51 +00:00
70931395d5 Add src/app/about/page.tsx 2026-04-28 18:14:51 +00:00
7 changed files with 215 additions and 380 deletions

37
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,37 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function AboutPage() {
return (
<ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="compact" sizing="mediumLargeSizeMediumTitles" background="fluid" cardStyle="glass-elevated" primaryButtonStyle="diagonal-gradient" secondaryButtonStyle="solid" headingFontWeight="normal">
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Reviews", id: "/reviews" }, { name: "Contact", id: "/contact" }]} />
</div>
<div id="team" data-section="team">
<TeamCardSix
title="Meet Our Professional Staff"
description="Our team of experienced artists and technicians is dedicated to providing you with the best service possible."
tag="Friendly & Talented"
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
members={[
{ id: "1", name: "Natalie", role: "Lead Artist" },
{ id: "2", name: "Kevin", role: "Technician" }
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal logoText="VU Nails & Spa" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} />
</div>
</ReactLenis>
</ThemeProvider>
);
}

27
src/app/booking/page.tsx Normal file
View File

@@ -0,0 +1,27 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function BookingPage() {
return (
<ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="compact" sizing="mediumLargeSizeMediumTitles" background="fluid" cardStyle="glass-elevated" primaryButtonStyle="diagonal-gradient" secondaryButtonStyle="solid" headingFontWeight="normal">
<NavbarStyleApple
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "Booking", id: "/booking" }, { name: "Contact", id: "/contact" }]}
brandName="VU Nails & Spa"
/>
<main className="pt-32">
<ContactSplitForm
title="Book Now"
description="Secure your appointment by filling out the details below. We look forward to pampering you!"
inputs={[{ name: "name", type: "text", placeholder: "Name", required: true }, { name: "date", type: "date", placeholder: "Preferred Date", required: true }]}
buttonText="Book Now"
useInvertedBackground={false}
/>
</main>
<FooterBaseReveal logoText="VU Nails & Spa" columns={[]} />
</ThemeProvider>
);
}

27
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,27 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function ContactPage() {
return (
<ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="compact" sizing="mediumLargeSizeMediumTitles" background="fluid" cardStyle="glass-elevated" primaryButtonStyle="diagonal-gradient" secondaryButtonStyle="solid" headingFontWeight="normal">
<NavbarStyleApple
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "Booking", id: "/booking" }, { name: "Contact", id: "/contact" }]}
brandName="VU Nails & Spa"
/>
<main className="pt-32">
<ContactSplitForm
title="Contact Us"
description="Have questions? Reach out to our team or call us today!"
inputs={[{ name: "name", type: "text", placeholder: "Name", required: true }, { name: "email", type: "email", placeholder: "Email", required: true }]}
buttonText="Call Today"
useInvertedBackground={false}
/>
</main>
<FooterBaseReveal logoText="VU Nails & Spa" columns={[]} />
</ThemeProvider>
);
}

30
src/app/gallery/page.tsx Normal file
View File

@@ -0,0 +1,30 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function GalleryPage() {
return (
<ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="compact" sizing="mediumLargeSizeMediumTitles" background="fluid" cardStyle="glass-elevated" primaryButtonStyle="diagonal-gradient" secondaryButtonStyle="solid" headingFontWeight="normal">
<ReactLenis root>
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Gallery", id: "/gallery" },
{ name: "Contact", id: "/contact" },
]}
brandName="VU Nails & Spa"
/>
<FooterBaseReveal
logoText="VU Nails & Spa"
columns={[
{ title: "Quick Links", items: [{ label: "Home", href: "/" }, { label: "Services", href: "/services" }] }
]}
/>
</ReactLenis>
</ThemeProvider>
);
}

View File

@@ -2,17 +2,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import TeamCardSix from '@/components/sections/team/TeamCardSix';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import { CalendarDays, MessageCircle, Star } from "lucide-react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import { Star, MessageCircle, CalendarDays } from "lucide-react";
export default function LandingPage() {
return (
@@ -29,379 +22,40 @@ export default function LandingPage() {
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{
name: "Home",
id: "hero",
},
{
name: "Services",
id: "services",
},
{
name: "Team",
id: "team",
},
{
name: "Testimonials",
id: "testimonials",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="VU Nails & Spa"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Booking", id: "/booking" },
{ name: "Contact", id: "/contact" }
]}
brandName="VU Nails & Spa"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboard
background={{
variant: "radial-gradient",
}}
title="Where Nail Art Meets Perfection"
description="Top-rated nail salon known for precision, creativity, and a welcoming experience. We bring your vision to life."
buttons={[
{
text: "Book Appointment",
href: "#contact",
},
{
text: "View Services",
href: "#services",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/winter-sports-gear-accessories_482257-76733.jpg"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/luxury-retro-wall-lamp-cafe_1150-10890.jpg",
alt: "Luxury retro wall lamp in cafe",
},
{
src: "http://img.b2bpic.net/free-photo/anime-style-beauty-salon-with-cosmetology-equipment_23-2151500998.jpg",
alt: "Anime style beauty salon",
},
{
src: "http://img.b2bpic.net/free-photo/interior-design-neoclassical-style-with-furnishings-decor_23-2151199365.jpg",
alt: "Neoclassical style interior",
},
{
src: "http://img.b2bpic.net/free-photo/mirror-hairdressing-salon_23-2147670185.jpg",
alt: "Salon mirror",
},
{
src: "http://img.b2bpic.net/free-photo/modern-reception-counter-with-classy-interior-design_482257-101081.jpg",
alt: "Modern reception counter",
},
]}
avatarText="Trusted by 500+ locals"
marqueeItems={[
{
type: "text",
text: "Certified Artists",
},
{
type: "text",
text: "Premium Products",
},
{
type: "text",
text: "Sanitized Stations",
},
{
type: "text",
text: "Online Booking",
},
{
type: "text",
text: "Artisan Craftsmanship",
},
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[{ id: "m1", icon: Star, title: "Customer Rating", value: "4.7★" }, { id: "m2", icon: MessageCircle, title: "Reviews", value: "180+" }, { id: "m3", icon: CalendarDays, title: "Availability", value: "7 Days" }]}
title="Why Clients Love Us"
description="Consistently providing 5-star service."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "m1",
icon: Star,
title: "Customer Rating",
value: "4.7★",
},
{
id: "m2",
icon: MessageCircle,
title: "Reviews",
value: "180+",
},
{
id: "m3",
icon: CalendarDays,
title: "Availability",
value: "7 Days",
},
]}
title="Why Clients Love Us"
description="Consistently providing 5-star service that keeps our community coming back."
/>
</div>
<div id="services" data-section="services">
<FeatureCardSix
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "Custom Nail Art",
description: "Intricate hand-painted designs personalized to your style.",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-with-beautiful-nails_23-2149311563.jpg",
},
{
title: "Acrylic & Dip",
description: "Long-lasting finishes applied with industry-leading precision.",
imageSrc: "http://img.b2bpic.net/free-photo/female-hands-with-purple-nail-design-holding-black-cup_127675-2628.jpg",
},
{
title: "Spa Pedicures",
description: "Indulge in a relaxing environment for total foot care.",
imageSrc: "http://img.b2bpic.net/free-photo/women-having-beauty-treatment-sauna_23-2149241458.jpg",
},
]}
title="Our Signature Services"
description="From custom hand-painted art to relaxing spa pedicures, experience precision at every step."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardOne
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[
{
id: "p1",
badge: "Popular",
price: "$45",
subtitle: "Manicures",
features: [
"Classic Polish",
"Clean Cuticle Care",
"Long-Lasting Gloss",
],
},
{
id: "p2",
badge: "Artistry",
price: "$65+",
subtitle: "Acrylic / Dip",
features: [
"Full Application",
"Shaping",
"Custom Finish",
],
},
{
id: "p3",
badge: "Custom",
price: "$80+",
subtitle: "Hand-Painted Art",
features: [
"Consultation",
"Detailed Artistry",
"Premium Finishes",
],
},
]}
title="Premium Quality, Affordable Prices"
description="Transparent pricing for high-end results that stay beautiful longer."
/>
</div>
<div id="team" data-section="team">
<TeamCardSix
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={true}
members={[
{
id: "t1",
name: "Natalie",
role: "Lead Artist",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-beautiful-woman-looking-camera-while-standing-counter-movie-house_613910-21690.jpg",
},
{
id: "t2",
name: "Kevin",
role: "Nail Technician",
imageSrc: "http://img.b2bpic.net/free-photo/person-preparing-their-drag-outfit_23-2149490852.jpg",
},
{
id: "t3",
name: "Tina",
role: "Nail Technician",
imageSrc: "http://img.b2bpic.net/free-photo/merry-young-adult-enjoying-christmas-conversation-video-call-room-decorated-festivity-celebration-talking-woman-preparing-drink-wine-kitchen-with-joyful-ornaments_482257-28400.jpg",
},
]}
title="Meet Your Nail Artists"
description="Friendly, professional, and dedicated to the perfect set. Meet the talent behind the designs."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Sarah J.",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020793.jpg",
},
{
id: "2",
name: "Emily R.",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-female-getting-her-nails-fixed-by-manicurist-inside-room-beauty-manicure-nails-hand-self-care_140725-65113.jpg",
},
{
id: "3",
name: "Jessica M.",
imageSrc: "http://img.b2bpic.net/free-photo/male-female-friends-getting-manicure-together_23-2150285919.jpg",
},
{
id: "4",
name: "Lauren T.",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-bride-getting-ready_23-2149860783.jpg",
},
{
id: "5",
name: "Rachel D.",
imageSrc: "http://img.b2bpic.net/free-photo/charming-women-with-motorcycle-helmets_23-2147771901.jpg",
},
]}
cardTitle="Client Stories"
cardTag="Loved by Hundreds"
cardAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqBase
textboxLayout="default"
useInvertedBackground={true}
faqs={[
{
id: "f1",
title: "Do you accept walk-ins?",
content: "We highly recommend booking an appointment online, especially for detailed nail art, but we do accommodate walk-ins when possible.",
},
{
id: "f2",
title: "Can I request a technician?",
content: "Absolutely! You can select your preferred technician during the online booking process.",
},
{
id: "f3",
title: "Are you open on weekends?",
content: "Yes, we are proudly open 7 days a week to fit your schedule.",
},
]}
title="Common Questions"
description="Everything you need to know about booking and our services."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Book Your Appointment"
description="Ready for your next set? Book online or call us today to secure your spot."
inputs={[
{
name: "name",
type: "text",
placeholder: "Your Name",
required: true,
},
{
name: "phone",
type: "tel",
placeholder: "Phone Number",
required: true,
},
]}
textarea={{
name: "notes",
placeholder: "Tell us what nail service or art you're looking for...",
rows: 4,
}}
imageSrc="http://img.b2bpic.net/free-photo/view-luxurious-hotel-interior-space_23-2150683467.jpg"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseReveal
logoText="VU Nails & Spa"
columns={[
{
title: "Services",
items: [
{
label: "Nail Art",
href: "#services",
},
{
label: "Acrylics",
href: "#services",
},
{
label: "Pedicures",
href: "#services",
},
],
},
{
title: "Info",
items: [
{
label: "About Us",
href: "#team",
},
{
label: "Reviews",
href: "#testimonials",
},
{
label: "FAQ",
href: "#faq",
},
],
},
{
title: "Connect",
items: [
{
label: "Call: (555) 123-4567",
href: "tel:5551234567",
},
{
label: "Email: hello@vunails.com",
href: "mailto:hello@vunails.com",
},
],
},
]}
copyrightText="© 2024 VU Nails & Spa. All rights reserved."
/>
</div>
<div id="pricing" data-section="pricing">
<PricingCardOne
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
plans={[{ id: "p1", badge: "Popular", price: "$45", subtitle: "Manicures", features: ["Classic Polish", "Clean Cuticle Care"] }, { id: "p2", badge: "Artistry", price: "$65+", subtitle: "Acrylic", features: ["Full Application", "Shaping"] }, { id: "p3", badge: "Custom", price: "$80+", subtitle: "Hand-Painted", features: ["Consultation", "Detailed Artistry"] }]}
title="Premium Quality, Affordable Prices"
description="Transparent pricing for high-end results."
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}

30
src/app/reviews/page.tsx Normal file
View File

@@ -0,0 +1,30 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function ReviewsPage() {
return (
<ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="compact" sizing="mediumLargeSizeMediumTitles" background="fluid" cardStyle="glass-elevated" primaryButtonStyle="diagonal-gradient" secondaryButtonStyle="solid" headingFontWeight="normal">
<ReactLenis root>
<NavbarStyleApple navItems={[{ name: "Home", id: "/" }, { name: "About", id: "/about" }, { name: "Reviews", id: "/reviews" }, { name: "Contact", id: "/contact" }]} brandName="VU Nails & Spa" />
<TestimonialCardTwo
title="What Our Loyal Customers Say"
tag="4.7-Star Rating"
animationType="slide-up"
textboxLayout="default"
description="See why our community loves us."
useInvertedBackground={false}
testimonials={[
{ id: "1", name: "Sarah J.", role: "Regular Customer", testimonial: "The best nail salon in town, always clean and professional." },
{ id: "2", name: "Emily R.", role: "Local Resident", testimonial: "Fantastic service and reasonable prices. Highly recommend!" }
]}
/>
<FooterBaseReveal logoText="VU Nails & Spa" columns={[{ title: "Links", items: [{ label: "Home", href: "/" }] }]} />
</ReactLenis>
</ThemeProvider>
);
}

30
src/app/services/page.tsx Normal file
View File

@@ -0,0 +1,30 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
export default function ServicesPage() {
return (
<ThemeProvider defaultButtonVariant="icon-arrow" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="compact" sizing="mediumLargeSizeMediumTitles" background="fluid" cardStyle="glass-elevated" primaryButtonStyle="diagonal-gradient" secondaryButtonStyle="solid" headingFontWeight="normal">
<ReactLenis root>
<NavbarStyleApple
navItems={[
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Gallery", id: "/gallery" },
{ name: "Contact", id: "/contact" },
]}
brandName="VU Nails & Spa"
/>
<FooterBaseReveal
logoText="VU Nails & Spa"
columns={[
{ title: "Quick Links", items: [{ label: "Home", href: "/" }, { label: "Gallery", href: "/gallery" }] }
]}
/>
</ReactLenis>
</ThemeProvider>
);
}