8 Commits

Author SHA1 Message Date
02ef23c9fa Update src/app/page.tsx 2026-04-27 23:51:01 +00:00
0a81b9a789 Merge version_6 into main
Merge version_6 into main
2026-04-27 23:48:17 +00:00
dbcbc5634f Update src/app/page.tsx 2026-04-27 23:48:14 +00:00
29c6173870 Merge version_6 into main
Merge version_6 into main
2026-04-27 23:47:47 +00:00
3ed9140f81 Update src/app/page.tsx 2026-04-27 23:47:41 +00:00
d0445e58e6 Switch to version 4: remove src/app/booking/page.tsx 2026-04-27 23:46:02 +00:00
4c35de8956 Switch to version 4: modified src/app/page.tsx 2026-04-27 23:46:02 +00:00
b438209472 Merge version_5 into main
Merge version_5 into main
2026-04-27 23:45:21 +00:00
2 changed files with 14 additions and 77 deletions

View File

@@ -1,69 +0,0 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Calendar } from 'lucide-react';
export default function BookingPage() {
return (
<ThemeProvider
defaultButtonVariant="elastic-effect"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="small"
sizing="large"
background="floatingGradient"
cardStyle="soft-shadow"
primaryButtonStyle="gradient"
secondaryButtonStyle="radial-glow"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="Sharp Edge"
navItems={[
{ name: "Home", id: "/" },
{ name: "Our Story", id: "/#about" },
{ name: "Services", id: "/#cuts" },
{ name: "Barbers", id: "/#team" },
{ name: "Gallery", id: "/#experience" },
{ name: "FAQ", id: "/#faq" }
]}
button={{ text: "Book Now", href: "/booking" }}
/>
</div>
<div id="booking-form" data-section="contact">
<ContactSplitForm
title="Secure Your Appointment"
description="Select your preferred barber, choose a time slot, and tell us which service you need. We'll confirm your booking shortly."
inputs={[
{ name: "name", type: "text", placeholder: "Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true },
{ name: "date", type: "date", placeholder: "Booking Date", required: true },
{ name: "time", type: "time", placeholder: "Booking Time", required: true }
]}
multiSelect={{
name: "barber", label: "Select Staff (or choose 'Any Available')", options: ["Any Available", "Marco V.", "Sarah J.", "David K.", "Liam R.", "Elena M.", "Jason B."]
}}
textarea={{ name: "notes", placeholder: "Additional notes (optional)", rows: 3 }}
buttonText="Confirm Booking"
/>
</div>
<div id="footer" data-section="footer">
<FooterBase
logoText="Sharp Edge"
columns={[
{ title: "Visit", items: [{ label: "Location", href: "#" }, { label: "Directions", href: "#" }] },
{ title: "Services", items: [{ label: "Cuts", href: "#" }, { label: "Shaves", href: "#" }] },
{ title: "Business", items: [{ label: "Book Now", href: "/booking" }, { label: "Contact", href: "/#contact" }] }
]
}
/>
</div>
</ThemeProvider>
);
}

View File

@@ -11,7 +11,7 @@ import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCar
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia'; import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactCenter from '@/components/sections/contact/ContactCenter'; import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterBase from '@/components/sections/footer/FooterBase'; import FooterBase from '@/components/sections/footer/FooterBase';
import { Scissors, Calendar, Star, Clock, User, Award } from 'lucide-react'; import { Scissors, Calendar, Award } from 'lucide-react';
export default function LandingPage() { export default function LandingPage() {
return ( return (
@@ -38,7 +38,7 @@ export default function LandingPage() {
{ name: "FAQ", id: "faq" } { name: "FAQ", id: "faq" }
]} ]}
button={{ button={{
text: "Book Now", href: "/booking" text: "Book Now", href: "#contact"
}} }}
/> />
</div> </div>
@@ -51,7 +51,7 @@ export default function LandingPage() {
tagIcon={Scissors} tagIcon={Scissors}
background={{ variant: "plain" }} background={{ variant: "plain" }}
buttons={[ buttons={[
{ text: "Book with Your Barber", href: "/booking" }, { text: "Book with Your Barber", href: "#contact" },
{ text: "View Services", href: "#cuts" } { text: "View Services", href: "#cuts" }
]} ]}
buttonAnimation="slide-up" buttonAnimation="slide-up"
@@ -77,6 +77,7 @@ export default function LandingPage() {
imageAlt="Expert barber at work" imageAlt="Expert barber at work"
mediaAnimation="slide-up" mediaAnimation="slide-up"
metricsAnimation="slide-up" metricsAnimation="slide-up"
useInvertedBackground={false}
/> />
</div> </div>
@@ -94,6 +95,7 @@ export default function LandingPage() {
gridVariant="three-columns-all-equal-width" gridVariant="three-columns-all-equal-width"
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false}
/> />
</div> </div>
@@ -108,6 +110,7 @@ export default function LandingPage() {
{ tag: "Beard", title: "Beard Design", subtitle: "Expert shaping", description: "Sculpted beard care for the modern man.", imageSrc: "http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-barber-shop_613910-6221.jpg" } { tag: "Beard", title: "Beard Design", subtitle: "Expert shaping", description: "Sculpted beard care for the modern man.", imageSrc: "http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-barber-shop_613910-6221.jpg" }
]} ]}
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false}
/> />
</div> </div>
@@ -124,6 +127,7 @@ export default function LandingPage() {
gridVariant="three-columns-all-equal-width" gridVariant="three-columns-all-equal-width"
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false}
/> />
</div> </div>
@@ -139,6 +143,7 @@ export default function LandingPage() {
]} ]}
animationType="slide-up" animationType="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false}
/> />
</div> </div>
@@ -155,6 +160,7 @@ export default function LandingPage() {
imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6196.jpg" imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table_627829-6196.jpg"
faqsAnimation="slide-up" faqsAnimation="slide-up"
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false}
/> />
</div> </div>
@@ -162,12 +168,12 @@ export default function LandingPage() {
<ContactCenter <ContactCenter
tag="Bookings" tag="Bookings"
title="Book Your Appointment" title="Book Your Appointment"
description="Use our online booking system to secure your spot with your preferred barber." description="Use the calendar below to secure your spot with your preferred barber."
tagIcon={Calendar} tagIcon={Calendar}
background={{ variant: "sparkles-gradient" }} background={{ variant: "sparkles-gradient" }}
useInvertedBackground={false}
inputPlaceholder="Your name or email" inputPlaceholder="Your name or email"
buttonText="Go to Booking Page" buttonText="Reserve Now"
onSubmit={() => window.location.href = '/booking'}
/> />
</div> </div>
@@ -177,10 +183,10 @@ export default function LandingPage() {
columns={[ columns={[
{ title: "Visit", items: [{ label: "Location", href: "#" }, { label: "Directions", href: "#" }] }, { title: "Visit", items: [{ label: "Location", href: "#" }, { label: "Directions", href: "#" }] },
{ title: "Services", items: [{ label: "Cuts", href: "#" }, { label: "Shaves", href: "#" }] }, { title: "Services", items: [{ label: "Cuts", href: "#" }, { label: "Shaves", href: "#" }] },
{ title: "Business", items: [{ label: "Book Now", href: "/booking" }, { label: "Contact", href: "#contact" }] } { title: "Business", items: [{ label: "Book Now", href: "#contact" }, { label: "Contact", href: "#" }] }
]} ]}
/> />
</div> </div>
</ThemeProvider> </ThemeProvider>
); );
} }