diff --git a/src/app/about/page.tsx b/src/app/about/page.tsx index dab5de9..61e53af 100644 --- a/src/app/about/page.tsx +++ b/src/app/about/page.tsx @@ -160,8 +160,8 @@ export default function AboutPage() { }, ]} containerClassName="gap-12" - titleClassName="text-4xl font-extrabold" - descriptionClassName="text-lg opacity-90" + itemClassName="" + mediaWrapperClassName="" /> diff --git a/src/app/booking/page.tsx b/src/app/booking/page.tsx new file mode 100644 index 0000000..a280845 --- /dev/null +++ b/src/app/booking/page.tsx @@ -0,0 +1,332 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; +import { useState } from 'react'; +import { Calendar, Clock, Users, Palette, Phone, Mail } from 'lucide-react'; +import FooterSimple from '@/components/sections/footer/FooterSimple'; + +export default function BookingPage() { + const navItems = [ + { name: "Home", id: "home" }, + { name: "Services", id: "services" }, + { name: "Gallery", id: "/gallery" }, + { name: "Packages", id: "/packages" }, + { name: "About", id: "about" }, + { name: "Contact", id: "/contact" }, + ]; + + const footerColumns = [ + { + title: "Services", items: [ + { label: "Kids Party Face Painting", href: "/services" }, + { label: "Festival Face Art", href: "/services" }, + { label: "Corporate Events", href: "/services" }, + { label: "Body Painting", href: "/services" }, + { label: "Custom Designs", href: "/services" }, + ], + }, + { + title: "Company", items: [ + { label: "About Us", href: "/about" }, + { label: "Gallery", href: "/gallery" }, + { label: "Packages", href: "/packages" }, + { label: "FAQ", href: "#faq" }, + { label: "Contact", href: "/contact" }, + ], + }, + { + title: "Connect", items: [ + { label: "Instagram", href: "https://instagram.com" }, + { label: "Facebook", href: "https://facebook.com" }, + { label: "TikTok", href: "https://tiktok.com" }, + { label: "Email", href: "mailto:paintasy@events.com" }, + { label: "Phone", href: "tel:+15551234567" }, + ], + }, + { + title: "Service Areas", items: [ + { label: "Local Events", href: "/contact" }, + { label: "Regional Coverage", href: "/contact" }, + { label: "Book Now", href: "/packages" }, + { label: "Get Quote", href: "/contact" }, + ], + }, + ]; + + const [formData, setFormData] = useState({ + fullName: '', + email: '', + phone: '', + eventType: '', + eventDate: '', + eventTime: '', + guestCount: '', + serviceType: '', + additionalNotes: '', + }); + + const [submitted, setSubmitted] = useState(false); + + const handleChange = (e: React.ChangeEvent) => { + const { name, value } = e.target; + setFormData(prev => ({ + ...prev, + [name]: value + })); + }; + + const handleSubmit = (e: React.FormEvent) => { + e.preventDefault(); + console.log('Form submitted:', formData); + setSubmitted(true); + setTimeout(() => { + setFormData({ + fullName: '', + email: '', + phone: '', + eventType: '', + eventDate: '', + eventTime: '', + guestCount: '', + serviceType: '', + additionalNotes: '', + }); + setSubmitted(false); + }, 3000); + }; + + return ( + + + +
+
+

Book Your Event

+

Complete this form to request a booking for professional face and body art services at your event. We'll get back to you within 24 hours with availability and pricing details.

+
+ + {submitted && ( +
+

Thank you! Your booking request has been submitted. We'll contact you soon to confirm details.

+
+ )} + +
+ {/* Contact Information Section */} +
+

+ + Contact Information +

+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+
+
+ + {/* Event Details Section */} +
+

+ + Event Details +

+ +
+
+ + +
+ +
+
+ + +
+ +
+ + +
+
+ +
+ + +
+
+
+ + {/* Service Selection Section */} +
+

+ + Service Selection +

+ +
+ + +
+
+ + {/* Additional Notes Section */} +
+ +