Merge version_1 into main #2
504
src/app/page.tsx
504
src/app/page.tsx
@@ -12,364 +12,182 @@ import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
||||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||||
import { Eye, Flame, Heart, Smile, Sparkles, Sun } from "lucide-react";
|
||||
import { Eye, Flame, Heart, Sparkles, Sun, Hand, Foot, Smile } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="compact"
|
||||
sizing="mediumLargeSizeMediumTitles"
|
||||
background="grid"
|
||||
cardStyle="soft-shadow"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="light"
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="compact"
|
||||
sizing="mediumLargeSizeMediumTitles"
|
||||
background="grid"
|
||||
cardStyle="soft-shadow"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="light"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Ann Tattoos & Nails"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Ann Tattoos & Nails"
|
||||
button={{ text: "Book Now", href: "tel:0423790795" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
title="Your Personal Beauty Sanctuary in St Albans"
|
||||
description="Expert nails, tattoos & beauty treatments in a private, welcoming space designed for your comfort."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "tel:0423790795",
|
||||
},
|
||||
{
|
||||
text: "View Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-hands-with-beautiful-manicure_23-2149311588.jpg?_wi=1"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Your Personal Beauty Sanctuary in St Albans"
|
||||
description="Expert nails, tattoos & beauty treatments in a private, welcoming space designed for your comfort."
|
||||
buttons={[
|
||||
{ text: "Book Appointment", href: "tel:0423790795" },
|
||||
{ text: "View Services", href: "#services" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-hands-with-beautiful-manicure_23-2149311588.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"5-Star Rated",
|
||||
"Anxiety-Friendly",
|
||||
"Local Expert",
|
||||
"Personal Attention",
|
||||
"Professional Service",
|
||||
"High Quality",
|
||||
"Welcoming Atmosphere",
|
||||
]}
|
||||
title="Trusted by St Albans Locals"
|
||||
description="Providing personalized beauty care for years in a comfortable, anxiety-friendly environment."
|
||||
/>
|
||||
</div>
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"5-Star Rated", "Anxiety-Friendly", "Local Expert", "Personal Attention", "Professional Service", "High Quality", "Welcoming Atmosphere"]}
|
||||
title="Trusted by St Albans Locals"
|
||||
description="Providing personalized beauty care for years in a comfortable, anxiety-friendly environment."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="About Ann"
|
||||
title="A Private Experience Just For You"
|
||||
description="Ann provides one-on-one attention tailored to your needs. Our salon is carefully designed to be social anxiety-friendly, ensuring a calm, judgment-free space where you can relax."
|
||||
subdescription="With years of expertise, we prioritize your comfort and quality service above all else."
|
||||
icon={Heart}
|
||||
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?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="About Ann"
|
||||
title="A Private Experience Just For You"
|
||||
description="Ann provides one-on-one attention tailored to your needs. Our salon is carefully designed to be social anxiety-friendly, ensuring a calm, judgment-free space where you can relax."
|
||||
subdescription="With years of expertise, we prioritize your comfort and quality service above all else."
|
||||
icon={Heart}
|
||||
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"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Nails & Art",
|
||||
description: "Gel, acrylics, and custom nail art designs.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/white-candles-shine-shelves_1304-5595.jpg",
|
||||
},
|
||||
items: [
|
||||
{
|
||||
icon: Sparkles,
|
||||
text: "Gel Polish",
|
||||
},
|
||||
{
|
||||
icon: Sparkles,
|
||||
text: "Sculpted Acrylics",
|
||||
},
|
||||
{
|
||||
icon: Sparkles,
|
||||
text: "Custom Nail Art",
|
||||
},
|
||||
],
|
||||
reverse: false,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-with-beautiful-manicure_23-2149311588.jpg?_wi=2",
|
||||
imageAlt: "serene salon interior soft lighting",
|
||||
},
|
||||
{
|
||||
title: "Beauty Care",
|
||||
description: "Eyelash extensions and shaping services.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-s-arms-posing-with-pear-dark-background_23-2149640612.jpg",
|
||||
},
|
||||
items: [
|
||||
{
|
||||
icon: Eye,
|
||||
text: "Lash Extensions",
|
||||
},
|
||||
{
|
||||
icon: Sun,
|
||||
text: "Brow Shaping",
|
||||
},
|
||||
{
|
||||
icon: Flame,
|
||||
text: "Waxing",
|
||||
},
|
||||
],
|
||||
reverse: true,
|
||||
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?_wi=2",
|
||||
imageAlt: "serene salon interior soft lighting",
|
||||
},
|
||||
{
|
||||
title: "Relaxation",
|
||||
description: "Soothing treatments for hands and feet.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/serene-cozy-workspace-with-natural-light-plants-neutral-colors_23-2151965514.jpg",
|
||||
},
|
||||
items: [
|
||||
{
|
||||
icon: Hand,
|
||||
text: "Hand Massage",
|
||||
},
|
||||
{
|
||||
icon: Foot,
|
||||
text: "Foot Massage",
|
||||
},
|
||||
{
|
||||
icon: Smile,
|
||||
text: "Wellness",
|
||||
},
|
||||
],
|
||||
reverse: false,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/charming-smiling-lady-with-long-wavy-dark-hair-is-touching-hair-looking-camera-home_291650-2384.jpg?_wi=1",
|
||||
imageAlt: "serene salon interior soft lighting",
|
||||
},
|
||||
]}
|
||||
title="Our Beauty Menu"
|
||||
description="From precise manicures to relaxing massages, discover our full range of services."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Nails & Art", description: "Gel, acrylics, and custom nail art designs.", media: { imageSrc: "http://img.b2bpic.net/free-photo/white-candles-shine-shelves_1304-5595.jpg" },
|
||||
items: [
|
||||
{ icon: Sparkles, text: "Gel Polish" },
|
||||
{ icon: Sparkles, text: "Sculpted Acrylics" },
|
||||
{ icon: Sparkles, text: "Custom Nail Art" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
title: "Beauty Care", description: "Eyelash extensions and shaping services.", media: { imageSrc: "http://img.b2bpic.net/free-photo/woman-s-arms-posing-with-pear-dark-background_23-2149640612.jpg" },
|
||||
items: [
|
||||
{ icon: Eye, text: "Lash Extensions" },
|
||||
{ icon: Sun, text: "Brow Shaping" },
|
||||
{ icon: Flame, text: "Waxing" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
title: "Relaxation", description: "Soothing treatments for hands and feet.", media: { imageSrc: "http://img.b2bpic.net/free-photo/serene-cozy-workspace-with-natural-light-plants-neutral-colors_23-2151965514.jpg" },
|
||||
items: [
|
||||
{ icon: Hand, text: "Hand Massage" },
|
||||
{ icon: Foot, text: "Foot Massage" },
|
||||
{ icon: Smile, text: "Wellness" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
]}
|
||||
title="Our Beauty Menu"
|
||||
description="From precise manicures to relaxing massages, discover our full range of services."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Highly Recommended",
|
||||
quote: "Thank you Ann for doing such a great job!",
|
||||
name: "Ginni",
|
||||
role: "Local Guide",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/charming-smiling-lady-with-long-wavy-dark-hair-is-touching-hair-looking-camera-home_291650-2384.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Very Accommodating",
|
||||
quote: "Very accommodating and friendly... very happy with my nails.",
|
||||
name: "Janyka",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lesbian-couple-wearing-white-their-wedding_23-2150835701.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Anxiety-Friendly",
|
||||
quote: "Using this service for years... highly recommend... one on one... social anxiety friendly.",
|
||||
name: "Bianca",
|
||||
role: "Long-term Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/two-women-taking-selfie-together-after-session-shopping_23-2148673258.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "Professional",
|
||||
quote: "Quick and professional service.",
|
||||
name: "Helene",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-female-friends-getting-manicure-together_23-2150285937.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "Friendly Service",
|
||||
quote: "Good & friendly services.",
|
||||
name: "Quan Tran",
|
||||
role: "Client",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lovely-happy-woman-drying-hair-bathroom_329181-1538.jpg",
|
||||
},
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="What our wonderful clients say about their experience with Ann."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", title: "Highly Recommended", quote: "Thank you Ann for doing such a great job!", name: "Ginni", role: "Local Guide", imageSrc: "http://img.b2bpic.net/free-photo/charming-smiling-lady-with-long-wavy-dark-hair-is-touching-hair-looking-camera-home_291650-2384.jpg"},
|
||||
{
|
||||
id: "2", title: "Very Accommodating", quote: "Very accommodating and friendly... very happy with my nails.", name: "Janyka", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/lesbian-couple-wearing-white-their-wedding_23-2150835701.jpg"},
|
||||
{
|
||||
id: "3", title: "Anxiety-Friendly", quote: "Using this service for years... highly recommend... one on one... social anxiety friendly.", name: "Bianca", role: "Long-term Client", imageSrc: "http://img.b2bpic.net/free-photo/two-women-taking-selfie-together-after-session-shopping_23-2148673258.jpg"},
|
||||
{
|
||||
id: "4", title: "Professional", quote: "Quick and professional service.", name: "Helene", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/male-female-friends-getting-manicure-together_23-2150285937.jpg"},
|
||||
{
|
||||
id: "5", title: "Friendly Service", quote: "Good & friendly services.", name: "Quan Tran", role: "Client", imageSrc: "http://img.b2bpic.net/free-photo/lovely-happy-woman-drying-hair-bathroom_329181-1538.jpg"},
|
||||
]}
|
||||
title="Client Stories"
|
||||
description="What our wonderful clients say about their experience with Ann."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "p1",
|
||||
badge: "Essentials",
|
||||
price: "From $40",
|
||||
subtitle: "Nail Care & Basics",
|
||||
features: [
|
||||
"Manicure",
|
||||
"Pedicure",
|
||||
"Basic Polish",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
badge: "Popular",
|
||||
price: "From $65",
|
||||
subtitle: "Extensions & Art",
|
||||
features: [
|
||||
"Acrylics",
|
||||
"Gel Set",
|
||||
"Custom Art",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
badge: "Wellness",
|
||||
price: "From $30",
|
||||
subtitle: "Beauty & Massage",
|
||||
features: [
|
||||
"Lashes",
|
||||
"Waxing",
|
||||
"Massage",
|
||||
],
|
||||
},
|
||||
]}
|
||||
title="Transparent Pricing"
|
||||
description="Affordable luxury for everyone."
|
||||
/>
|
||||
</div>
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{ id: "p1", badge: "Essentials", price: "From $40", subtitle: "Nail Care & Basics", features: ["Manicure", "Pedicure", "Basic Polish"] },
|
||||
{ id: "p2", badge: "Popular", price: "From $65", subtitle: "Extensions & Art", features: ["Acrylics", "Gel Set", "Custom Art"] },
|
||||
{ id: "p3", badge: "Wellness", price: "From $30", subtitle: "Beauty & Massage", features: ["Lashes", "Waxing", "Massage"] },
|
||||
]}
|
||||
title="Transparent Pricing"
|
||||
description="Affordable luxury for everyone."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Is the salon private?",
|
||||
content: "Yes, we focus on a one-on-one personal environment for complete comfort.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Do you accept walk-ins?",
|
||||
content: "We recommend calling ahead to ensure your preferred time is available.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Is there parking?",
|
||||
content: "Yes, convenient parking is available near our Clare St location.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Everything you need to know about our salon."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Is the salon private?", content: "Yes, we focus on a one-on-one personal environment for complete comfort." },
|
||||
{ id: "f2", title: "Do you accept walk-ins?", content: "We recommend calling ahead to ensure your preferred time is available." },
|
||||
{ id: "f3", title: "Is there parking?", content: "Yes, convenient parking is available near our Clare St location." },
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Everything you need to know about our salon."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
text="Ready to pamper yourself? Call Ann today at 0423 790 795 to book your appointment."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:0423790795",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
text="Ready to pamper yourself? Call Ann today at 0423 790 795 to book your appointment."
|
||||
buttons={[{ text: "Call Now", href: "tel:0423790795" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/i-love-u-title-lamp-near-spa-tub-with-burning-candles_23-2148003833.jpg"
|
||||
logoText="Ann Tattoos & Nails"
|
||||
columns={[
|
||||
{
|
||||
title: "Visit Us",
|
||||
items: [
|
||||
{
|
||||
label: "11 Clare St, St Albans VIC",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Hours",
|
||||
items: [
|
||||
{
|
||||
label: "Mon-Fri: 9am-6pm",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Sat: 9am-5pm",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Sun: 10am-6pm",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "0423 790 795",
|
||||
href: "tel:0423790795",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/i-love-u-title-lamp-near-spa-tub-with-burning-candles_23-2148003833.jpg"
|
||||
logoText="Ann Tattoos & Nails"
|
||||
columns={[
|
||||
{ title: "Visit Us", items: [{ label: "11 Clare St, St Albans VIC", href: "#" }] },
|
||||
{ title: "Hours", items: [{ label: "Mon-Fri: 9am-6pm", href: "#" }, { label: "Sat: 9am-5pm", href: "#" }, { label: "Sun: 10am-6pm", href: "#" }] },
|
||||
{ title: "Contact", items: [{ label: "0423 790 795", href: "tel:0423790795" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user