bender/84e29b90-d994-4f93-9739-bb328234969f
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_3 into main

Browse Source 
Merge version_3 into main
This commit was merged in pull request #4.
This commit is contained in:
bender
2026-05-13 13:08:13 +00:00
parent b8a70f98e9 d0044b9fa9
commit c155bb05ab
1 changed files with 52 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

104
src/app/booking/page.tsx
View File

@@ -1,65 +1,65 @@
"use client";
import { useState } from "react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from "next/link";
export default function BookingPage() {
return (
<ThemeProvider>
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/#about" },
{ name: "Services", id: "/#services" },
{ name: "Booking", id: "/booking" },
]}
brandName="Varad Salon"
button={{ text: "Home", href: "/" }}
/>
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="entrance-slide"
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{ name: "Home", id: "/" },
{ name: "Booking", id: "/booking" },
]}
brandName="Varad Salon"
button={{ text: "Home", href: "/" }}
/>
</div>
<main className="pt-24">
<section className="container mx-auto py-16">
<h1 className="text-4xl font-bold mb-8 text-center">Book an Appointment</h1>
<form className="max-w-lg mx-auto p-8 rounded-2xl bg-secondary/10">
<div className="flex flex-col gap-4">
<div>
<label className="block text-sm font-medium mb-1">Full Name</label>
<input type="text" className="w-full p-3 rounded-lg border" placeholder="John Doe" />
</div>
<div>
<label className="block text-sm font-medium mb-1">Phone Number</label>
<input type="tel" className="w-full p-3 rounded-lg border" placeholder="(555) 000-0000" />
</div>
<div>
<label className="block text-sm font-medium mb-1">Desired Service</label>
<select className="w-full p-3 rounded-lg border">
<option>Haircut & Styling</option>
<option>Hair Coloring</option>
<option>Facials & Skin</option>
<option>Bridal Packages</option>
<option>Wellness Massage</option>
</select>
</div>
<div>
<label className="block text-sm font-medium mb-1">Additional Details</label>
<textarea className="w-full p-3 rounded-lg border h-32" placeholder="Any special requests or preferred timing?" />
</div>
<button type="submit" className="w-full p-4 bg-primary text-white rounded-lg font-bold">Confirm Booking</button>
</div>
</form>
</section>
</main>
<div id="booking" data-section="booking">
<ContactCTA
tag="Appointment"
title="Book an Appointment"
description="Secure your preferred time at Varad Salon."
buttons={[{ text: "Confirm Booking" }]}
background={{ variant: "plain" }}
/>
</div>
<FooterLogoEmphasis
columns={[
{ items: [{ label: "Services", href: "/#services" }, { label: "About", href: "/#about" }, { label: "Book Now", href: "/booking" }] },
{ items: [{ label: "Instagram" }, { label: "Facebook" }, { label: "Google Maps" }] },
]}
logoText="Varad Salon"
/>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="Varad Salon"
columns={[
{
items: [
{ label: "Home", href: "/" },
{ label: "Booking", href: "/booking" }
]
},
{
items: [
{ label: "Instagram" },
{ label: "Facebook" }
]
}
]}
/>
</div>
</ThemeProvider>
);
}