Update src/app/page.tsx
This commit is contained in:
181
src/app/page.tsx
181
src/app/page.tsx
@@ -21,8 +21,7 @@ export default function HomePage() {
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{ label: "Blonde Transformations", href: "/services" },
|
||||
{ label: "Full Colour & Restyles", href: "/services" },
|
||||
{ label: "MycroKeratin Smoothing", href: "/services" },
|
||||
@@ -30,8 +29,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#team" },
|
||||
{ label: "Transformations", href: "#transformations" },
|
||||
{ label: "Book Appointment", href: "/services" },
|
||||
@@ -39,8 +37,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
title: "Contact", items: [
|
||||
{ label: "Phone: 082 557 2721", href: "tel:0825572721" },
|
||||
{ label: "Address: 7 Michael St, Thabazimbi, 0387", href: "#" },
|
||||
{ label: "Email: Contact Us", href: "mailto:info@crownedbyhim.co.za" },
|
||||
@@ -56,7 +53,7 @@ export default function HomePage() {
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="largeSmallSizeLargeTitles"
|
||||
background="grid"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
@@ -67,9 +64,7 @@ export default function HomePage() {
|
||||
brandName="Crowned by Him"
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Book Appointment",
|
||||
href: "/services",
|
||||
}}
|
||||
text: "Book Appointment", href: "/services"}}
|
||||
animateOnLoad={true}
|
||||
/>
|
||||
</div>
|
||||
@@ -81,39 +76,25 @@ export default function HomePage() {
|
||||
tag="Premium Salon"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
background={{ variant: "grid" }}
|
||||
background={{ variant: "animated-grid" }}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "/services",
|
||||
},
|
||||
text: "Book Appointment", href: "/services"},
|
||||
{
|
||||
text: "Call 082 557 2721",
|
||||
href: "tel:0825572721",
|
||||
},
|
||||
text: "Call 082 557 2721", href: "tel:0825572721"},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-using-laptop-computer-smart-phone-beautiful-student-girl-working-laptop-outdoor_1328-649.jpg",
|
||||
imageAlt: "blonde hair transformation salon bright lighting",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-using-laptop-computer-smart-phone-beautiful-student-girl-working-laptop-outdoor_1328-649.jpg", imageAlt: "blonde hair transformation salon bright lighting"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27197.jpg?_wi=1",
|
||||
imageAlt: "blonde highlights balayage salon technique",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27197.jpg", imageAlt: "blonde highlights balayage salon technique"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-hairstylist-working-with-young-client_23-2147769873.jpg?_wi=1",
|
||||
imageAlt: "keratin hair treatment smoothing results",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-hairstylist-working-with-young-client_23-2147769873.jpg", imageAlt: "keratin hair treatment smoothing results"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-done-hairdresser_23-2150771250.jpg?_wi=1",
|
||||
imageAlt: "natural hair styling salon professional",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-done-hairdresser_23-2150771250.jpg", imageAlt: "natural hair styling salon professional"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-posing_23-2148497197.jpg?_wi=1",
|
||||
imageAlt: "professional female hair stylist portrait",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-posing_23-2148497197.jpg", imageAlt: "professional female hair stylist portrait"},
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
ariaLabel="Hero section showcasing blonde transformations and salon services"
|
||||
@@ -129,40 +110,18 @@ export default function HomePage() {
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{
|
||||
text: "View All Services",
|
||||
href: "/services",
|
||||
},
|
||||
text: "View All Services", href: "/services"},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Blonde Transformations",
|
||||
price: "R 450 - R 950",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27197.jpg?_wi=2",
|
||||
imageAlt: "blonde highlights balayage salon technique",
|
||||
},
|
||||
id: "1", name: "Blonde Transformations", price: "R 450 - R 950", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27197.jpg", imageAlt: "blonde highlights balayage salon technique"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Full Colour & Restyles",
|
||||
price: "R 350 - R 800",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/good-looking-happy-woman-dressed-white-blouse-looking-away_291650-408.jpg?_wi=1",
|
||||
imageAlt: "full hair color change salon makeover",
|
||||
},
|
||||
id: "2", name: "Full Colour & Restyles", price: "R 350 - R 800", imageSrc: "http://img.b2bpic.net/free-photo/good-looking-happy-woman-dressed-white-blouse-looking-away_291650-408.jpg", imageAlt: "full hair color change salon makeover"},
|
||||
{
|
||||
id: "3",
|
||||
name: "MycroKeratin Smoothing",
|
||||
price: "R 550 - R 1200",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-hairstylist-working-with-young-client_23-2147769873.jpg?_wi=2",
|
||||
imageAlt: "keratin hair treatment smoothing results",
|
||||
},
|
||||
id: "3", name: "MycroKeratin Smoothing", price: "R 550 - R 1200", imageSrc: "http://img.b2bpic.net/free-photo/crop-hairstylist-working-with-young-client_23-2147769873.jpg", imageAlt: "keratin hair treatment smoothing results"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Natural Style Customisation",
|
||||
price: "R 250 - R 600",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-done-hairdresser_23-2150771250.jpg?_wi=2",
|
||||
imageAlt: "natural hair styling salon professional",
|
||||
},
|
||||
id: "4", name: "Natural Style Customisation", price: "R 250 - R 600", imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-done-hairdresser_23-2150771250.jpg", imageAlt: "natural hair styling salon professional"},
|
||||
]}
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
animationType="slide-up"
|
||||
@@ -181,40 +140,18 @@ export default function HomePage() {
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Your Transformation",
|
||||
href: "/services",
|
||||
},
|
||||
text: "Book Your Transformation", href: "/services"},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Blonde Transformation",
|
||||
price: "Dark to Radiant Blonde",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-caucasian-blonde-female-wearing-stylish-leather-dress-posing-fashion-photoshoot_181624-59478.jpg?_wi=1",
|
||||
imageAlt: "blonde transformation before after dark to blonde",
|
||||
},
|
||||
id: "1", name: "Blonde Transformation", price: "Dark to Radiant Blonde", imageSrc: "http://img.b2bpic.net/free-photo/attractive-caucasian-blonde-female-wearing-stylish-leather-dress-posing-fashion-photoshoot_181624-59478.jpg", imageAlt: "blonde transformation before after dark to blonde"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Color Correction",
|
||||
price: "Vibrant & Healthy Blonde",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-giving-client-haircut-salon_23-2148353408.jpg?_wi=1",
|
||||
imageAlt: "color correction vibrant blonde results",
|
||||
},
|
||||
id: "2", name: "Color Correction", price: "Vibrant & Healthy Blonde", imageSrc: "http://img.b2bpic.net/free-photo/woman-giving-client-haircut-salon_23-2148353408.jpg", imageAlt: "color correction vibrant blonde results"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Keratin Results",
|
||||
price: "Smooth & Frizz-Free",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-woman-doing-crazy-gesture_1187-4442.jpg?_wi=1",
|
||||
imageAlt: "keratin treatment smooth frizz free hair",
|
||||
},
|
||||
id: "3", name: "Keratin Results", price: "Smooth & Frizz-Free", imageSrc: "http://img.b2bpic.net/free-photo/pretty-woman-doing-crazy-gesture_1187-4442.jpg", imageAlt: "keratin treatment smooth frizz free hair"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Natural Styling",
|
||||
price: "Elegant & Customised",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-curly-hairstyle-checking-haircut-fixing-curls-near-mirror-before-return-boyfriend-have-romantic-dinner-smiling-broadly-feel-happy_176420-44744.jpg?_wi=1",
|
||||
imageAlt: "natural hair styling elegant hairstyle result",
|
||||
},
|
||||
id: "4", name: "Natural Styling", price: "Elegant & Customised", imageSrc: "http://img.b2bpic.net/free-photo/girl-curly-hairstyle-checking-haircut-fixing-curls-near-mirror-before-return-boyfriend-have-romantic-dinner-smiling-broadly-feel-happy_176420-44744.jpg", imageAlt: "natural hair styling elegant hairstyle result"},
|
||||
]}
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
animationType="slide-up"
|
||||
@@ -233,34 +170,18 @@ export default function HomePage() {
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{
|
||||
text: "Book With Us",
|
||||
href: "/services",
|
||||
},
|
||||
text: "Book With Us", href: "/services"},
|
||||
]}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
animationType="slide-up"
|
||||
groups={[
|
||||
{
|
||||
id: "stylists",
|
||||
groupTitle: "Professional Stylists",
|
||||
members: [
|
||||
id: "stylists", groupTitle: "Professional Stylists", members: [
|
||||
{
|
||||
id: "1",
|
||||
title: "Nadine Coetzee",
|
||||
subtitle: "Blonde Specialist",
|
||||
detail: "Passionate about helping women feel confident and radiant with beautifully healthy hair",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-posing_23-2148497197.jpg?_wi=2",
|
||||
imageAlt: "Nadine Coetzee, Blonde Specialist",
|
||||
},
|
||||
id: "1", title: "Nadine Coetzee", subtitle: "Blonde Specialist", detail: "Passionate about helping women feel confident and radiant with beautifully healthy hair", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-posing_23-2148497197.jpg", imageAlt: "Nadine Coetzee, Blonde Specialist"},
|
||||
{
|
||||
id: "2",
|
||||
title: "Cindy Jacobs",
|
||||
subtitle: "Experienced Stylist",
|
||||
detail: "Focused on natural, elegant styles tailored to every client's unique needs and lifestyle",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg?_wi=1",
|
||||
imageAlt: "Cindy Jacobs, Experienced Stylist",
|
||||
},
|
||||
id: "2", title: "Cindy Jacobs", subtitle: "Experienced Stylist", detail: "Focused on natural, elegant styles tailored to every client's unique needs and lifestyle", imageSrc: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg", imageAlt: "Cindy Jacobs, Experienced Stylist"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -279,40 +200,16 @@ export default function HomePage() {
|
||||
features={[
|
||||
{
|
||||
id: 1,
|
||||
tag: "Expertise",
|
||||
title: "Blonde Specialist",
|
||||
subtitle: "Expert colour techniques for stunning results",
|
||||
description: "With years of experience in blonde transformations and colour correction, Nadine specializes in achieving beautiful, natural-looking blonde results tailored to your skin tone and hair goals.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27197.jpg?_wi=3",
|
||||
imageAlt: "Blonde specialist expertise",
|
||||
},
|
||||
tag: "Expertise", title: "Blonde Specialist", subtitle: "Expert colour techniques for stunning results", description: "With years of experience in blonde transformations and colour correction, Nadine specializes in achieving beautiful, natural-looking blonde results tailored to your skin tone and hair goals.", imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-cut-hair-her-client-hair-salon_1157-27197.jpg", imageAlt: "Blonde specialist expertise"},
|
||||
{
|
||||
id: 2,
|
||||
tag: "Personal Touch",
|
||||
title: "Personalized Consultations",
|
||||
subtitle: "Your hair, your vision",
|
||||
description: "Every client receives a thorough consultation to understand your hair goals, lifestyle, and preferences. We create customized treatment plans designed specifically for you.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-caucasian-blonde-female-wearing-stylish-leather-dress-posing-fashion-photoshoot_181624-59478.jpg?_wi=2",
|
||||
imageAlt: "Personalized consultation",
|
||||
},
|
||||
tag: "Personal Touch", title: "Personalized Consultations", subtitle: "Your hair, your vision", description: "Every client receives a thorough consultation to understand your hair goals, lifestyle, and preferences. We create customized treatment plans designed specifically for you.", imageSrc: "http://img.b2bpic.net/free-photo/attractive-caucasian-blonde-female-wearing-stylish-leather-dress-posing-fashion-photoshoot_181624-59478.jpg", imageAlt: "Personalized consultation"},
|
||||
{
|
||||
id: 3,
|
||||
tag: "Quality",
|
||||
title: "Professional Products",
|
||||
subtitle: "Only the best for your hair",
|
||||
description: "We use premium, professional-grade products including MycroKeratin treatments to ensure your hair stays healthy, vibrant, and beautiful between appointments.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/crop-hairstylist-working-with-young-client_23-2147769873.jpg?_wi=3",
|
||||
imageAlt: "Professional hair products",
|
||||
},
|
||||
tag: "Quality", title: "Professional Products", subtitle: "Only the best for your hair", description: "We use premium, professional-grade products including MycroKeratin treatments to ensure your hair stays healthy, vibrant, and beautiful between appointments.", imageSrc: "http://img.b2bpic.net/free-photo/crop-hairstylist-working-with-young-client_23-2147769873.jpg", imageAlt: "Professional hair products"},
|
||||
{
|
||||
id: 4,
|
||||
tag: "Community",
|
||||
title: "Friendly Local Salon",
|
||||
subtitle: "Where you belong",
|
||||
description: "Located right here in Thabazimbi, we're more than a salon—we're your trusted local beauty partners. We build lasting relationships with our clients and make every visit special.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-done-hairdresser_23-2150771250.jpg?_wi=3",
|
||||
imageAlt: "Friendly local salon",
|
||||
},
|
||||
tag: "Community", title: "Friendly Local Salon", subtitle: "Where you belong", description: "Located right here in Thabazimbi, we're more than a salon—we're your trusted local beauty partners. We build lasting relationships with our clients and make every visit special.", imageSrc: "http://img.b2bpic.net/free-photo/female-client-getting-her-hair-done-hairdresser_23-2150771250.jpg", imageAlt: "Friendly local salon"},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
@@ -325,17 +222,11 @@ export default function HomePage() {
|
||||
author="Crowned by Him – Styled with Care"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-posing_23-2148497197.jpg",
|
||||
alt: "Nadine Coetzee",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-posing_23-2148497197.jpg", alt: "Nadine Coetzee"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg",
|
||||
alt: "Cindy Jacobs",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/redhead-female-supervisor-dressed-elegant-suit-grey-background_613910-10390.jpg", alt: "Cindy Jacobs"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/pretty-young-woman-holding-gesture_1187-3824.jpg",
|
||||
alt: "Happy client",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/pretty-young-woman-holding-gesture_1187-3824.jpg", alt: "Happy client"},
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="slide-up"
|
||||
@@ -345,7 +236,7 @@ export default function HomePage() {
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/furniture-room-background-sofa-contemporary_1203-4464.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/furniture-room-background-sofa-contemporary_1203-4464.jpg"
|
||||
imageAlt="Luxury salon interior"
|
||||
logoText="Crowned by Him"
|
||||
copyrightText="© 2025 Crowned by Him – Styled by Cindy & Gracefully Beautiful. All rights reserved."
|
||||
@@ -354,4 +245,4 @@ export default function HomePage() {
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user