Merge version_3 into main #9

Open
bender wants to merge 34 commits from version_3 into main
7 changed files with 637 additions and 505 deletions

View File

@@ -160,8 +160,8 @@ export default function AboutPage() {
},
]}
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90"
itemClassName=""
mediaWrapperClassName=""
/>
</div>

332
src/app/booking/page.tsx Normal file
View File

@@ -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<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>) => {
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 (
<ThemeProvider
defaultButtonVariant="shift-hover"
defaultTextAnimation="background-highlight"
borderRadius="rounded"
contentWidth="compact"
sizing="large"
background="none"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="radial-glow"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
brandName="Paintasy"
navItems={navItems}
bottomLeftText="Creative Face & Body Art"
bottomRightText="paintasy@events.com"
/>
</div>
<div id="booking-form" data-section="booking-form" className="mx-auto px-4 md:px-6 py-20 max-w-2xl">
<div className="mb-12">
<h1 className="text-4xl font-extrabold mb-4">Book Your Event</h1>
<p className="text-lg opacity-90 mb-8">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.</p>
</div>
{submitted && (
<div className="mb-6 p-4 bg-green-100 border border-green-300 rounded-lg text-green-800">
<p className="font-semibold">Thank you! Your booking request has been submitted. We'll contact you soon to confirm details.</p>
</div>
)}
<form onSubmit={handleSubmit} className="space-y-6">
{/* Contact Information Section */}
<div className="border-b pb-6">
<h2 className="text-2xl font-bold mb-4 flex items-center gap-2">
<Mail className="w-5 h-5" />
Contact Information
</h2>
<div className="space-y-4">
<div>
<label htmlFor="fullName" className="block text-sm font-semibold mb-2">Full Name *</label>
<input
id="fullName"
type="text"
name="fullName"
value={formData.fullName}
onChange={handleChange}
required
placeholder="Your full name"
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
/>
</div>
<div>
<label htmlFor="email" className="block text-sm font-semibold mb-2">Email Address *</label>
<input
id="email"
type="email"
name="email"
value={formData.email}
onChange={handleChange}
required
placeholder="your.email@example.com"
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
/>
</div>
<div>
<label htmlFor="phone" className="block text-sm font-semibold mb-2">Phone Number *</label>
<input
id="phone"
type="tel"
name="phone"
value={formData.phone}
onChange={handleChange}
required
placeholder="(555) 123-4567"
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
/>
</div>
</div>
</div>
{/* Event Details Section */}
<div className="border-b pb-6">
<h2 className="text-2xl font-bold mb-4 flex items-center gap-2">
<Calendar className="w-5 h-5" />
Event Details
</h2>
<div className="space-y-4">
<div>
<label htmlFor="eventType" className="block text-sm font-semibold mb-2">Event Type *</label>
<select
id="eventType"
name="eventType"
value={formData.eventType}
onChange={handleChange}
required
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
>
<option value="">Select an event type</option>
<option value="birthday">Birthday Party</option>
<option value="festival">Festival or Outdoor Event</option>
<option value="corporate">Corporate Event</option>
<option value="wedding">Wedding</option>
<option value="school">School Event</option>
<option value="other">Other</option>
</select>
</div>
<div className="grid grid-cols-2 gap-4">
<div>
<label htmlFor="eventDate" className="block text-sm font-semibold mb-2">Event Date *</label>
<input
id="eventDate"
type="date"
name="eventDate"
value={formData.eventDate}
onChange={handleChange}
required
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
/>
</div>
<div>
<label htmlFor="eventTime" className="block text-sm font-semibold mb-2 flex items-center gap-1">
<Clock className="w-4 h-4" />
Event Time *
</label>
<input
id="eventTime"
type="time"
name="eventTime"
value={formData.eventTime}
onChange={handleChange}
required
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
/>
</div>
</div>
<div>
<label htmlFor="guestCount" className="block text-sm font-semibold mb-2 flex items-center gap-1">
<Users className="w-4 h-4" />
Expected Guest Count *
</label>
<input
id="guestCount"
type="number"
name="guestCount"
value={formData.guestCount}
onChange={handleChange}
required
placeholder="e.g., 25"
min="1"
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
/>
</div>
</div>
</div>
{/* Service Selection Section */}
<div className="border-b pb-6">
<h2 className="text-2xl font-bold mb-4 flex items-center gap-2">
<Palette className="w-5 h-5" />
Service Selection
</h2>
<div>
<label htmlFor="serviceType" className="block text-sm font-semibold mb-2">What service are you interested in? *</label>
<select
id="serviceType"
name="serviceType"
value={formData.serviceType}
onChange={handleChange}
required
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
>
<option value="">Select a service</option>
<option value="face-painting">Face Painting Only</option>
<option value="body-painting">Body Painting</option>
<option value="both">Face & Body Painting</option>
<option value="custom">Custom Design Package</option>
<option value="unsure">Not sure - need consultation</option>
</select>
</div>
</div>
{/* Additional Notes Section */}
<div>
<label htmlFor="additionalNotes" className="block text-sm font-semibold mb-2">Additional Notes or Special Requests</label>
<textarea
id="additionalNotes"
name="additionalNotes"
value={formData.additionalNotes}
onChange={handleChange}
placeholder="Tell us about your vision, theme, any special requests, allergies, or other details that would help us serve you better."
rows={5}
className="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500"
/>
</div>
<div className="pt-6">
<button
type="submit"
className="w-full px-6 py-3 bg-blue-600 text-white font-semibold rounded-lg hover:bg-blue-700 transition-colors"
>
Submit Booking Request
</button>
<p className="text-xs text-gray-600 mt-3 text-center">We'll respond to your booking request within 24 hours with availability and pricing.</p>
</div>
</form>
</div>
<div id="footer-booking" data-section="footer-booking" className="mx-auto px-4 md:px-6">
<FooterSimple
columns={footerColumns}
bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
bottomRightText="Professional Event Entertainment | Creative Services"
ariaLabel="Site footer with links"
containerClassName="gap-12"
columnsClassName="grid-cols-2 lg:grid-cols-4"
columnTitleClassName="font-extrabold text-lg"
columnItemClassName="hover:opacity-70 transition-opacity"
/>
</div>
</ThemeProvider>
);
}

View File

@@ -2,33 +2,20 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Mail, Sparkles } from 'lucide-react';
import { useState } from 'react';
export const metadata = {
title: "Contact Us - Book Face Painting & Body Art | Paintasy", description: "Professional face painting and body art services for parties, festivals, and events. Get in touch with Paintasy to book your face painter, request quotes, and discuss custom face painting designs.", keywords: "book face painter, face painting services, body art booking, contact face painter, professional face painting, request face painting quote"};
import { Mail, Phone, MapPin } from 'lucide-react';
export default function ContactPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Home", id: "home" },
{ name: "Services", id: "services" },
{ name: "Gallery", id: "/gallery" },
{ name: "Packages", id: "/" },
{ name: "About", id: "/" },
{ name: "Packages", id: "/packages" },
{ name: "About", id: "about" },
{ name: "Contact", id: "/contact" },
];
const [formData, setFormData] = useState({
name: '',
email: '',
phone: '',
eventDate: '',
eventType: '',
message: '',
});
const footerColumns = [
{
title: "Services", items: [
@@ -41,10 +28,10 @@ export default function ContactPage() {
},
{
title: "Company", items: [
{ label: "About Us", href: "/" },
{ label: "About Us", href: "/about" },
{ label: "Gallery", href: "/gallery" },
{ label: "Packages", href: "/" },
{ label: "FAQ", href: "/" },
{ label: "Packages", href: "/packages" },
{ label: "FAQ", href: "#faq" },
{ label: "Contact", href: "/contact" },
],
},
@@ -61,7 +48,7 @@ export default function ContactPage() {
title: "Service Areas", items: [
{ label: "Local Events", href: "/contact" },
{ label: "Regional Coverage", href: "/contact" },
{ label: "Book Now", href: "/contact" },
{ label: "Book Now", href: "/packages" },
{ label: "Get Quote", href: "/contact" },
],
},
@@ -89,144 +76,31 @@ export default function ContactPage() {
/>
</div>
<div id="contact-cta" data-section="contact-cta" className="mx-auto px-4 md:px-6 pt-24">
<ContactCTA
<div id="contact-split" data-section="contact-split" className="mx-auto px-4 md:px-6 py-20">
<ContactSplit
tag="Get in Touch"
tagIcon={Mail}
tagAnimation="slide-up"
title="Book Your Professional Face Painter"
description="Transform your event with professional face painting and body art. Our skilled face painters deliver creative designs that bring joy to every occasion. From kids parties to festivals, corporate events to special celebrations, we provide exceptional face painting entertainment. Let's create unforgettable memories together."
buttons={[
{ text: "Request Quote", href: "#contact-form" },
{ text: "Call Now", href: "tel:+15551234567" },
]}
buttonAnimation="blur-reveal"
title="Book Your Event Today"
description="Transform your celebration with professional face and body art. Quick response times, flexible scheduling, and creative designs tailored to your event. Let's make your event unforgettable!"
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
ariaLabel="Contact CTA section"
mediaPosition="right"
inputPlaceholder="Enter your email"
buttonText="Send Message"
termsText="By submitting this form, you agree to be contacted about your event inquiry."
mediaAnimation="opacity"
onSubmit={(email) => {
console.log("Form submitted with email:", email);
}}
ariaLabel="Contact form section"
containerClassName="gap-12"
textBoxClassName="max-w-2xl"
tagClassName="text-sm"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90"
descriptionClassName="text-lg opacity-90 max-w-2xl"
buttonClassName="px-8 py-3"
buttonTextClassName="font-semibold"
/>
</div>
<div id="contact-form" data-section="contact-form" className="mx-auto px-4 md:px-6 py-16">
<div className="max-w-2xl mx-auto">
<h2 className="text-3xl font-extrabold mb-4">Request a Quote</h2>
<p className="text-lg opacity-90 mb-8">Tell us about your event and get a personalized quote from our team. We'll respond within 24 hours.</p>
<form className="space-y-6 bg-gradient-to-br from-card to-background p-8 rounded-lg border border-accent">
<div>
<label className="block text-sm font-semibold mb-2">Event Type</label>
<select
value={formData.eventType}
onChange={(e) => setFormData({ ...formData, eventType: e.target.value })}
className="w-full px-4 py-2 border border-accent rounded-lg bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary-cta"
>
<option value="">Select an event type...</option>
<option value="kids-party">Kids Birthday Party</option>
<option value="festival">Festival or Outdoor Event</option>
<option value="corporate">Corporate Event</option>
<option value="wedding">Wedding</option>
<option value="school">School Event</option>
<option value="other">Other</option>
</select>
</div>
<div>
<label className="block text-sm font-semibold mb-2">Event Date</label>
<input
type="date"
value={formData.eventDate}
onChange={(e) => setFormData({ ...formData, eventDate: e.target.value })}
className="w-full px-4 py-2 border border-accent rounded-lg bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary-cta"
/>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div>
<label className="block text-sm font-semibold mb-2">Full Name</label>
<input
type="text"
value={formData.name}
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
placeholder="Your name"
className="w-full px-4 py-2 border border-accent rounded-lg bg-background text-foreground placeholder-opacity-50 focus:outline-none focus:ring-2 focus:ring-primary-cta"
/>
</div>
<div>
<label className="block text-sm font-semibold mb-2">Email</label>
<input
type="email"
value={formData.email}
onChange={(e) => setFormData({ ...formData, email: e.target.value })}
placeholder="your@email.com"
className="w-full px-4 py-2 border border-accent rounded-lg bg-background text-foreground placeholder-opacity-50 focus:outline-none focus:ring-2 focus:ring-primary-cta"
/>
</div>
</div>
<div>
<label className="block text-sm font-semibold mb-2">Phone Number</label>
<input
type="tel"
value={formData.phone}
onChange={(e) => setFormData({ ...formData, phone: e.target.value })}
placeholder="(555) 123-4567"
className="w-full px-4 py-2 border border-accent rounded-lg bg-background text-foreground placeholder-opacity-50 focus:outline-none focus:ring-2 focus:ring-primary-cta"
/>
</div>
<div>
<label className="block text-sm font-semibold mb-2">Tell Us About Your Event</label>
<textarea
value={formData.message}
onChange={(e) => setFormData({ ...formData, message: e.target.value })}
placeholder="Event details, number of attendees, design preferences..."
rows={5}
className="w-full px-4 py-2 border border-accent rounded-lg bg-background text-foreground placeholder-opacity-50 focus:outline-none focus:ring-2 focus:ring-primary-cta resize-none"
/>
</div>
<button
type="submit"
onClick={(e) => {
e.preventDefault();
window.location.href = `mailto:paintasy@events.com?subject=Face Painting Quote Request from ${formData.name}&body=Event Type: ${formData.eventType}%0AEvent Date: ${formData.eventDate}%0AName: ${formData.name}%0AEmail: ${formData.email}%0APhone: ${formData.phone}%0A%0AEvent Details:%0A${formData.message}`;
}}
className="w-full px-6 py-3 bg-gradient-to-r from-primary-cta to-accent text-white font-semibold rounded-lg hover:shadow-lg transition-shadow"
>
Send Quote Request
</button>
</form>
</div>
</div>
<div id="contact-info" data-section="contact-info" className="mx-auto px-4 md:px-6 py-16">
<div className="max-w-4xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-8">
<div className="text-center">
<div className="mb-4 text-4xl">📞</div>
<h3 className="text-xl font-extrabold mb-2">Call Us</h3>
<p className="opacity-90">Phone and text</p>
<a href="tel:+15551234567" className="text-primary-cta font-semibold hover:underline mt-2 inline-block">
+1 (555) 123-4567
</a>
</div>
<div className="text-center">
<div className="mb-4 text-4xl">✉️</div>
<h3 className="text-xl font-extrabold mb-2">Email Us</h3>
<p className="opacity-90">We'll respond within 24 hours</p>
<a href="mailto:paintasy@events.com" className="text-primary-cta font-semibold hover:underline mt-2 inline-block">
paintasy@events.com
</a>
</div>
<div className="text-center">
<div className="mb-4 text-4xl">🎨</div>
<h3 className="text-xl font-extrabold mb-2">Follow Us</h3>
<p className="opacity-90">Connect on social media</p>
<div className="flex justify-center gap-4 mt-2">
<a href="https://instagram.com" className="text-primary-cta hover:underline">Instagram</a>
<a href="https://facebook.com" className="text-primary-cta hover:underline">Facebook</a>
</div>
</div>
</div>
</div>
<div id="footer-contact" data-section="footer-contact" className="mx-auto px-4 md:px-6">
<FooterSimple
columns={footerColumns}
@@ -241,4 +115,4 @@ export default function ContactPage() {
</div>
</ThemeProvider>
);
}
}

View File

@@ -7,16 +7,13 @@ import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Camera, Sparkles } from 'lucide-react';
export const metadata = {
title: "Gallery - Face Painting & Body Art Portfolio | Paintasy", description: "View our complete gallery of professional face painting and body art work. Real photos from parties, festivals, corporate events, and special occasions. Browse creative designs by category.", keywords: "face painting gallery, body art portfolio, face painting photos, face painter work, professional face art, event entertainment"};
export default function GalleryPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Home", id: "home" },
{ name: "Services", id: "services" },
{ name: "Gallery", id: "/gallery" },
{ name: "Packages", id: "/" },
{ name: "About", id: "/" },
{ name: "Packages", id: "/packages" },
{ name: "About", id: "about" },
{ name: "Contact", id: "/contact" },
];
@@ -32,10 +29,10 @@ export default function GalleryPage() {
},
{
title: "Company", items: [
{ label: "About Us", href: "/" },
{ label: "About Us", href: "/about" },
{ label: "Gallery", href: "/gallery" },
{ label: "Packages", href: "/" },
{ label: "FAQ", href: "/" },
{ label: "Packages", href: "/packages" },
{ label: "FAQ", href: "#faq" },
{ label: "Contact", href: "/contact" },
],
},
@@ -52,7 +49,7 @@ export default function GalleryPage() {
title: "Service Areas", items: [
{ label: "Local Events", href: "/contact" },
{ label: "Regional Coverage", href: "/contact" },
{ label: "Book Now", href: "/" },
{ label: "Book Now", href: "/packages" },
{ label: "Get Quote", href: "/contact" },
],
},
@@ -80,122 +77,59 @@ export default function GalleryPage() {
/>
</div>
<div id="gallery-kids" data-section="gallery-kids" className="mx-auto px-4 md:px-6 pt-24">
<div id="gallery-full" data-section="gallery-full" className="mx-auto px-4 md:px-6 py-20">
<ProductCardFour
title="Kids Party Face Painting Gallery"
description="Creative, colorful face painting designs perfect for children's birthday parties and celebrations. Safe, high-quality art that brings smiles to young faces."
tag="Kids Designs"
tagIcon={Sparkles}
tagAnimation="slide-up"
textboxLayout="default"
animationType="opacity"
useInvertedBackground={false}
gridVariant="three-columns-all-equal-width"
carouselMode="buttons"
products={[
{
id: "kids-1", name: "Butterfly Dreams", price: "Kids Design", variant: "Birthday Favorite", imageSrc: "http://img.b2bpic.net/free-photo/cute-girl-with-painted-face_23-2149089213.jpg", imageAlt: "Colorful butterfly face painting for kids"},
{
id: "kids-2", name: "Superhero Mask", price: "Kids Design", variant: "Party Popular", imageSrc: "http://img.b2bpic.net/free-photo/boy-face-painting_23-2148784394.jpg", imageAlt: "Superhero mask face painting for children"},
{
id: "kids-3", name: "Princess Crown", price: "Kids Design", variant: "Girls Favorite", imageSrc: "http://img.b2bpic.net/free-photo/little-girl-with-face-painting_23-2149089210.jpg", imageAlt: "Princess themed face painting with crown design"},
{
id: "kids-4", name: "Animal Fun", price: "Kids Design", variant: "All Ages", imageSrc: "http://img.b2bpic.net/free-photo/child-face-painted-tiger_23-2148948273.jpg", imageAlt: "Tiger face painting design for children"},
{
id: "kids-5", name: "Galaxy Stars", price: "Kids Design", variant: "Popular Choice", imageSrc: "http://img.b2bpic.net/free-photo/girl-with-stars-face-paint_23-2149089215.jpg", imageAlt: "Galaxy and stars face painting artwork"},
{
id: "kids-6", name: "Glitter Rainbow", price: "Kids Design", variant: "Party Favorite", imageSrc: "http://img.b2bpic.net/free-photo/child-with-rainbow-face-paint_23-2148948275.jpg", imageAlt: "Rainbow glitter face painting design"},
]}
buttons={[{ text: "Book Kids Party Painting", href: "/contact" }]}
buttonAnimation="blur-reveal"
ariaLabel="Kids party face painting gallery"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
/>
</div>
<div id="gallery-festival" data-section="gallery-festival" className="mx-auto px-4 md:px-6 pt-16">
<ProductCardFour
title="Festival & Event Face Art"
description="Professional face painting showcasing artistic designs from festivals, outdoor events, and large gatherings. Fast, creative service with stunning results."
tag="Festival Art"
title="Complete Photo Gallery"
description="Explore our full collection of face painting and body art work from events, festivals, and celebrations. Real photos showcasing our professional artistry and creativity."
tag="Portfolio"
tagIcon={Camera}
tagAnimation="slide-up"
textboxLayout="default"
animationType="opacity"
useInvertedBackground={true}
gridVariant="three-columns-all-equal-width"
carouselMode="buttons"
products={[
{
id: "festival-1", name: "Artistic Abstraction", price: "Festival Design", variant: "Modern Art", imageSrc: "http://img.b2bpic.net/free-photo/face-art-festival_23-2148784315.jpg", imageAlt: "Abstract artistic face painting design"},
{
id: "festival-2", name: "Geometric Patterns", price: "Festival Design", variant: "Contemporary", imageSrc: "http://img.b2bpic.net/free-photo/geometric-face-paint-design_23-2148948280.jpg", imageAlt: "Geometric pattern face painting artwork"},
{
id: "festival-3", name: "Nature Inspired", price: "Festival Design", variant: "Organic Art", imageSrc: "http://img.b2bpic.net/free-photo/nature-themed-face-art_23-2149089220.jpg", imageAlt: "Nature inspired face painting with floral elements"},
{
id: "festival-4", name: "Metallic Shine", price: "Festival Design", variant: "Bold Statement", imageSrc: "http://img.b2bpic.net/free-photo/metallic-face-paint_23-2148948282.jpg", imageAlt: "Metallic gold and silver face painting design"},
{
id: "festival-5", name: "Vibrant Expression", price: "Festival Design", variant: "Artistic", imageSrc: "http://img.b2bpic.net/free-photo/vibrant-face-paint-art_23-2149089225.jpg", imageAlt: "Vibrant multicolor face painting creation"},
{
id: "festival-6", name: "Cosmic Design", price: "Festival Design", variant: "Space Theme", imageSrc: "http://img.b2bpic.net/free-photo/cosmic-face-art_23-2148948285.jpg", imageAlt: "Cosmic and space themed face painting"},
]}
buttons={[{ text: "Book Festival Entertainment", href: "/contact" }]}
buttonAnimation="blur-reveal"
ariaLabel="Festival and event face art gallery"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
/>
</div>
<div id="gallery-body-art" data-section="gallery-body-art" className="mx-auto px-4 md:px-6 pt-16">
<ProductCardFour
title="Professional Body Art & Advanced Designs"
description="Premium body painting and advanced face art designs for special occasions. Professional artwork by experienced face painters specializing in detailed, high-impact designs."
tag="Professional Art"
tagIcon={Sparkles}
tagAnimation="slide-up"
textboxLayout="default"
animationType="opacity"
useInvertedBackground={false}
gridVariant="three-columns-all-equal-width"
gridVariant="bento-grid"
carouselMode="buttons"
products={[
{
id: "body-1", name: "Full Body Art", price: "Premium Design", variant: "Special Events", imageSrc: "http://img.b2bpic.net/free-photo/body-art-painting_23-2149159240.jpg", imageAlt: "Professional full body art painting"},
id: "gallery-kids-1", name: "Butterfly Dreams", price: "Kids Party", variant: "Birthday Event", imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1", imageAlt: "Butterfly face painting design on child"},
{
id: "body-2", name: "Elegant Face Art", price: "Premium Design", variant: "Professional", imageSrc: "http://img.b2bpic.net/free-photo/elegant-face-design_23-2148948290.jpg", imageAlt: "Elegant professional face art design"},
id: "gallery-kids-2", name: "Superhero Masks", price: "Kids Party", variant: "Birthday Event", imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1", imageAlt: "Superhero themed face painting for children"},
{
id: "body-3", name: "Detailed Portrait", price: "Premium Design", variant: "Artistic", imageSrc: "http://img.b2bpic.net/free-photo/detailed-portrait-face-art_23-2149089230.jpg", imageAlt: "Detailed portrait style face painting"},
id: "gallery-festival-1", name: "Festival Fantasy", price: "Festival Art", variant: "Outdoor Event", imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=1", imageAlt: "Vibrant festival face painting with multiple colors"},
{
id: "body-4", name: "Character Design", price: "Premium Design", variant: "Creative", imageSrc: "http://img.b2bpic.net/free-photo/character-face-art_23-2148948292.jpg", imageAlt: "Character themed face art design"},
id: "gallery-festival-2", name: "Rainbow Celebration", price: "Festival Art", variant: "Outdoor Event", imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=1", imageAlt: "Rainbow colored festival face art"},
{
id: "body-5", name: "Fantasy Makeup", price: "Premium Design", variant: "Special Occasion", imageSrc: "http://img.b2bpic.net/free-photo/fantasy-face-makeup_23-2149089235.jpg", imageAlt: "Fantasy themed face makeup art"},
id: "gallery-body-1", name: "Body Art Elegance", price: "Body Painting", variant: "Special Event", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=1", imageAlt: "Professional body painting artwork"},
{
id: "body-6", name: "Custom Artwork", price: "Premium Design", variant: "Bespoke", imageSrc: "http://img.b2bpic.net/free-photo/custom-face-art_23-2148948295.jpg", imageAlt: "Custom face art design created for client"},
id: "gallery-custom-1", name: "Artistic Creation", price: "Custom Design", variant: "Themed Event", imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1", imageAlt: "Artist applying custom face painting design"},
{
id: "gallery-kids-3", name: "Princess Tiara", price: "Kids Party", variant: "Birthday Event", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-adult-man-his-30s-that-is-painting-big-canvas-with-lot-brushes-palette-while-sitting-floor-art-studio_662251-323.jpg?_wi=1", imageAlt: "Princess themed face painting on young girl"},
{
id: "gallery-festival-3", name: "Glitter Dreams", price: "Festival Art", variant: "Outdoor Event", imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1", imageAlt: "Glittery festival face painting design"},
{
id: "gallery-corporate-1", name: "Brand Activation", price: "Corporate Event", variant: "Professional", imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1", imageAlt: "Corporate event face painting for brand activation"},
]}
buttons={[{ text: "Request Custom Design", href: "/contact" }]}
buttons={[{ text: "Book Your Event", href: "/packages" }]}
buttonAnimation="blur-reveal"
ariaLabel="Professional body art and advanced designs gallery"
ariaLabel="Complete photo gallery with all artworks"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
cardNameClassName=""
cardPriceClassName=""
cardVariantClassName=""
/>
</div>
<div id="contact-gallery" data-section="contact-gallery" className="mx-auto px-4 md:px-6 pt-16">
<div id="contact-gallery" data-section="contact-gallery" className="mx-auto px-4 md:px-6">
<ContactText
text="Love what you see in our gallery? Our professional face painters are ready to create custom designs for your next event. Whether it's a kids party, festival, or corporate celebration, we bring creativity and expertise to every face painting service."
text="Love what you see? Let's bring these creative designs to your next event! Contact Paintasy today to book your professional face and body art experience."
animationType="background-highlight"
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
buttons={[
{ text: "Book Face Painting Now", href: "/contact" },
{ text: "View Packages", href: "/" },
{ text: "Request a Quote", href: "/contact" },
{ text: "View Packages", href: "/packages" },
]}
ariaLabel="Gallery contact section"
ariaLabel="Contact section for gallery page"
containerClassName="py-16"
contentClassName="max-w-3xl mx-auto"
textClassName="text-4xl font-extrabold text-center"
@@ -203,7 +137,7 @@ export default function GalleryPage() {
/>
</div>
<div id="footer-gallery" data-section="footer-gallery" className="mx-auto px-4 md:px-6 pt-16">
<div id="footer-gallery" data-section="footer-gallery" className="mx-auto px-4 md:px-6">
<FooterSimple
columns={footerColumns}
bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
@@ -217,4 +151,4 @@ export default function GalleryPage() {
</div>
</ThemeProvider>
);
}
}

View File

@@ -4,10 +4,11 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Sparkles, DollarSign, HelpCircle } from 'lucide-react';
import { Sparkles, DollarSign, Check, Zap, Users, Music } from 'lucide-react';
export default function PackagesPage() {
const navItems = [
@@ -57,10 +58,6 @@ export default function PackagesPage() {
},
];
const handleBookingSubmit = (data: Record<string, string>) => {
console.log("Booking inquiry submitted:", data);
};
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
@@ -83,25 +80,25 @@ export default function PackagesPage() {
/>
</div>
<div id="hero-packages" data-section="hero-packages" className="mx-auto px-4 md:px-6">
<div id="packages-hero" data-section="packages-hero" className="mx-auto px-4 md:px-6">
<HeroBillboardGallery
title="Event Packages & Booking"
description="Simple, flexible pricing for parties, festivals, and corporate events. Each package includes professional service and artistic creativity. Book your event today!"
title="Event Packages & Booking Options"
description="Professional face painting and body art packages designed for every event type. Choose from flexible pricing, customize your experience, and book your entertainment today."
background={{ variant: "radial-gradient" }}
tag="Transparent Pricing"
tag="Book Your Entertainment"
tagIcon={Sparkles}
tagAnimation="slide-up"
buttons={[
{ text: "View Packages", href: "#pricing" },
{ text: "Get a Custom Quote", href: "#booking-form" },
{ text: "View Packages", href: "#packages-pricing" },
{ text: "Contact Us", href: "/contact" },
]}
buttonAnimation="blur-reveal"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/happy-excited-children-sitting-down-floor-hugging-celebrating-child-birthday-party_231208-3661.jpg", imageAlt: "Happy kids at a party with face painting"},
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg?_wi=1", imageAlt: "Professional face painting event entertainment"},
]}
mediaAnimation="opacity"
ariaLabel="Packages and booking hero section"
ariaLabel="Packages page hero section"
className="min-h-screen"
containerClassName="flex flex-col lg:flex-row items-center justify-between gap-12"
titleClassName="text-5xl lg:text-6xl font-extrabold leading-tight"
@@ -110,11 +107,11 @@ export default function PackagesPage() {
/>
</div>
<div id="pricing" data-section="pricing" className="mx-auto px-4 md:px-6">
<div id="packages-pricing" data-section="packages-pricing" className="mx-auto px-4 md:px-6">
<PricingCardFive
title="Choose Your Package"
description="Select the package that best fits your event needs. All packages include professional service, setup, and our artist's materials. Custom packages available upon request."
tag="Transparent Pricing"
title="Our Event Packages"
description="Transparent, flexible pricing for every event type. All packages include professional service, quality materials, and our commitment to making your event memorable."
tag="Flexible Pricing"
tagIcon={DollarSign}
tagAnimation="slide-up"
textboxLayout="default"
@@ -122,73 +119,131 @@ export default function PackagesPage() {
useInvertedBackground={false}
plans={[
{
id: "birthday-basic", tag: "Popular", price: "$150", period: "per hour", description: "Perfect for small birthday celebrations", button: { text: "Request Quote", href: "#booking-form" },
featuresTitle: "What's Included", features: [
"Up to 15 kids", "Colorful themed designs", "Face painting only", "Basic design themes", "Professional artist"],
id: "kids-party-basic", tag: "Popular", tagIcon: Users,
price: "$150", period: "per hour", description: "Perfect for small birthday celebrations with basic designs", button: { text: "Book Package", href: "/contact" },
featuresTitle: "Package Includes", features: [
"Up to 15 children", "Colorful, playful designs", "Face painting only", "Setup & teardown", "Artist materials provided"],
},
{
id: "birthday-deluxe", tag: "Best Value", price: "$200", period: "per 2 hours", description: "Full party entertainment package", button: { text: "Request Quote", href: "#booking-form" },
featuresTitle: "What's Included", features: [
"Up to 25 kids", "Custom themed designs", "Face & temporary tattoos", "Interactive entertainment", "Professional artist", "Setup & teardown"],
id: "kids-party-deluxe", tag: "Best Value", tagIcon: Check,
price: "$200", period: "per 2 hours", description: "Full party entertainment with premium designs and add-ons", button: { text: "Book Package", href: "/contact" },
featuresTitle: "Package Includes", features: [
"Up to 25 children", "Custom themed designs", "Face painting & temporary tattoos", "Interactive entertainment", "Professional quality assured"],
},
{
id: "festival-event", tag: "Flexible", price: "$250", period: "per 3 hours", description: "Festival and outdoor event service", button: { text: "Request Quote", href: "#booking-form" },
featuresTitle: "What's Included", features: [
"High-capacity crowd service", "Fast artistic designs", "Setup & teardown included", "Portable station", "5-10 min per person", "Weather-resistant setup"],
id: "festival-event", tag: "High-Volume", tagIcon: Zap,
price: "$250", period: "per 3 hours", description: "Fast, artistic designs for festivals and outdoor events", button: { text: "Book Package", href: "/contact" },
featuresTitle: "Package Includes", features: [
"High-capacity crowd service", "Fast artistic designs", "Portable setup station", "Setup & teardown included", "Multiple artist option available"],
},
{
id: "corporate-event", tag: "Professional", tagIcon: Music,
price: "$300", period: "per 4 hours", description: "Premium service for corporate events and brand activations", button: { text: "Book Package", href: "/contact" },
featuresTitle: "Package Includes", features: [
"Professional branded designs", "Custom theme integration", "Extended hours available", "Multiple artist coordination", "Premium materials & finishes"],
},
]}
buttons={[{ text: "Get Custom Package", href: "#booking-form" }]}
buttons={[{ text: "Contact for Custom Quote", href: "/contact" }]}
buttonAnimation="blur-reveal"
ariaLabel="Event packages pricing section"
ariaLabel="Pricing section with package options"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
cardClassName="p-8"
cardContentClassName=""
planTagClassName=""
planPriceClassName=""
/>
</div>
<div id="booking-form" data-section="booking-form" className="mx-auto px-4 md:px-6">
<ContactSplitForm
title="Book Your Event"
description="Fill out the form below to request a booking or get a custom quote. We'll get back to you within 24 hours with pricing and availability."
<div id="packages-details" data-section="packages-details" className="mx-auto px-4 md:px-6">
<FeatureCardTen
title="What's Included in Every Package"
description="All Paintasy packages come with professional service, quality materials, and our commitment to your event's success."
tag="Package Details"
tagIcon={Check}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={true}
inputs={[
{ name: "fullName", type: "text", placeholder: "Your Full Name", required: true },
{ name: "email", type: "email", placeholder: "Your Email Address", required: true },
{ name: "phone", type: "tel", placeholder: "Your Phone Number", required: true },
{ name: "eventDate", type: "date", placeholder: "Event Date", required: true },
{ name: "eventType", type: "text", placeholder: "Event Type (Birthday, Festival, Corporate, etc.)", required: true },
{ name: "guestCount", type: "number", placeholder: "Expected Number of Guests", required: true },
{ name: "location", type: "text", placeholder: "Event Location", required: true },
features={[
{
id: "package-details-1", title: "Professional Artist Service", description: "Our trained, experienced face painting artists deliver high-quality designs. We arrive on time, set up professionally, and ensure every guest receives outstanding service.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-adult-man-his-30s-that-is-painting-big-canvas-with-lot-brushes-palette-while-sitting-floor-art-studio_662251-323.jpg?_wi=1", imageAlt: "Professional face painting artist at work"},
items: [
{ icon: Sparkles, text: "Trained professionals" },
{ icon: Check, text: "Punctual & reliable" },
{ icon: Users, text: "Guest-focused service" },
],
reverse: false,
},
{
id: "package-details-2", title: "Premium Materials & Hygiene", description: "We use professional-grade, hypoallergenic face paints and follow strict hygiene protocols. Clean brushes, sanitized tools, and safe products for all skin types ensure a worry-free experience.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1", imageAlt: "Professional quality face painting materials"},
items: [
{ icon: Check, text: "Hypoallergenic products" },
{ icon: Sparkles, text: "Strict hygiene standards" },
{ icon: Music, text: "Safe for all ages" },
],
reverse: true,
},
]}
textarea={{
name: "eventDetails", placeholder: "Tell us about your event - theme, special requests, design preferences, or any other details you'd like us to know.", rows: 6,
required: false,
}}
buttonText="Request Booking"
onSubmit={handleBookingSubmit}
mediaPosition="right"
imageSrc="http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1"
imageAlt="Face painting booking inquiry"
mediaAnimation="opacity"
ariaLabel="Booking form section"
buttons={[{ text: "Request a Quote", href: "/contact" }]}
buttonAnimation="blur-reveal"
ariaLabel="Package details and inclusions"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90"
itemClassName=""
mediaWrapperClassName=""
/>
</div>
<div id="cta-packages" data-section="cta-packages" className="mx-auto px-4 md:px-6">
<div id="packages-faq" data-section="packages-faq" className="mx-auto px-4 md:px-6">
<FaqBase
title="Booking & Package FAQs"
description="Everything you need to know about our packages and booking process."
tag="Questions?"
tagIcon={DollarSign}
tagAnimation="slide-up"
textboxLayout="default"
animationType="smooth"
faqsAnimation="slide-up"
useInvertedBackground={true}
showCard={true}
faqs={[
{
id: "booking-faq-1", title: "How do I book a package?", content: "Simply click 'Book Package' or 'Contact Us' and fill out the booking form with your event details. We'll confirm availability, discuss any customizations, and finalize the details. You can also call us directly at the phone number provided."},
{
id: "booking-faq-2", title: "What is your booking timeline?", content: "We recommend booking 2-3 weeks in advance for regular events. For large festivals or peak seasons, 4-6 weeks is ideal. Last-minute bookings may be available depending on our schedule—contact us to check availability."},
{
id: "booking-faq-3", title: "Do you offer custom package pricing?", content: "Absolutely! Our packages are flexible. If you need something different—different duration, larger group, or additional services—we can create a custom package tailored to your event. Contact us to discuss your specific needs."},
{
id: "booking-faq-4", title: "What's the cancellation or rescheduling policy?", content: "We offer flexible rescheduling up to 7 days before your event at no charge. Cancellations made 14+ days in advance receive a full refund. Cancellations within 7 days may incur fees. Contact us for specific details."},
{
id: "booking-faq-5", title: "Can I add more hours or upgrade my package?", content: "Yes! You can add additional hours, upgrade designs, or add services like body painting at any time. Additional hours are typically charged at the hourly rate specified in your package. Discuss upgrades when booking or contact us anytime."},
{
id: "booking-faq-6", title: "What payment methods do you accept?", content: "We accept all major credit cards, PayPal, bank transfers, and cash. A deposit is required to secure your booking, with the balance due before the event. Contact us for specific payment details."},
{
id: "booking-faq-7", title: "Do you travel to events outside the area?", content: "Yes, we service regional events! Travel fees may apply for locations outside our standard service area. Contact us with your event location, and we'll provide a custom quote including travel costs."},
{
id: "booking-faq-8", title: "Can you work with large groups or multiple artists?", content: "Definitely! For large events, we can coordinate multiple artists to handle high volume efficiently. This ensures every guest gets painted without excessive wait times. Discuss group sizes when booking."},
]}
buttons={[{ text: "Book Now", href: "/contact" }]}
buttonAnimation="blur-reveal"
ariaLabel="Packages FAQ section"
containerClassName="gap-12"
accordionClassName=""
accordionTitleClassName=""
/>
</div>
<div id="packages-contact" data-section="packages-contact" className="mx-auto px-4 md:px-6">
<ContactText
text="Ready to make your event unforgettable? Browse our packages above or contact us for a custom quote. We're excited to bring creative face painting to your celebration!"
text="Ready to book your event? Let's create an unforgettable experience with Paintasy Face and Body Art. Contact us today to discuss your package, ask questions, and secure your date."
animationType="background-highlight"
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
buttons={[
{ text: "Send a Message", href: "#booking-form" },
{ text: "Call Us", href: "tel:+15551234567" },
{ text: "Get Your Quote", href: "/contact" },
{ text: "Call Us Now", href: "tel:+15551234567" },
]}
ariaLabel="Call-to-action for bookings"
ariaLabel="Packages contact call-to-action"
containerClassName="py-16"
contentClassName="max-w-3xl mx-auto"
textClassName="text-4xl font-extrabold text-center"
@@ -196,7 +251,7 @@ export default function PackagesPage() {
/>
</div>
<div id="footer-packages" data-section="footer-packages" className="mx-auto px-4 md:px-6">
<div id="packages-footer" data-section="packages-footer" className="mx-auto px-4 md:px-6">
<FooterSimple
columns={footerColumns}
bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."

View File

@@ -13,18 +13,16 @@ import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import Link from 'next/link';
import { Sparkles, Palette, Heart, Smile, Zap, Music, Briefcase, Target, Users, Star, DollarSign, Camera, HelpCircle, Award } from 'lucide-react';
export const metadata = {
title: "Paintasy Face and Body Art - Professional Face Painting & Body Art Services", description: "Professional face painting and body art services for kids parties, festivals, and corporate events. Expert face painters specializing in creative designs. Book your event today!", keywords: "face painting, body art, face painter, kids face painting, festival face painting, party entertainment, face design, professional face painter"};
import Head from 'next/head';
export default function HomePage() {
const navItems = [
{ name: "Home", id: "home" },
{ name: "Services", id: "services" },
{ name: "Gallery", id: "/gallery" },
{ name: "Gallery", id: "gallery" },
{ name: "Packages", id: "packages" },
{ name: "About", id: "about" },
{ name: "Contact", id: "/contact" },
{ name: "Contact", id: "contact" },
];
const footerColumns = [
@@ -39,10 +37,10 @@ export default function HomePage() {
},
{
title: "Company", items: [
{ label: "About Us", href: "#about-home" },
{ label: "About Us", href: "/about" },
{ label: "Gallery", href: "/gallery" },
{ label: "Packages", href: "#packages-home" },
{ label: "FAQ", href: "#faq-home" },
{ label: "Packages", href: "/packages" },
{ label: "FAQ", href: "#faq" },
{ label: "Contact", href: "/contact" },
],
},
@@ -59,7 +57,7 @@ export default function HomePage() {
title: "Service Areas", items: [
{ label: "Local Events", href: "/contact" },
{ label: "Regional Coverage", href: "/contact" },
{ label: "Book Now", href: "#packages-home" },
{ label: "Book Now", href: "/packages" },
{ label: "Get Quote", href: "/contact" },
],
},
@@ -87,37 +85,37 @@ export default function HomePage() {
/>
</div>
<div id="hero-home" data-section="hero-home" className="mx-auto px-4 md:px-6">
<div id="hero-home" data-section="hero-home" className="mx-auto px-4 md:px-6 lg:px-8">
<HeroBillboardGallery
title="Paintasy Face and Body Art"
description="Professional face painting and body art for parties, festivals, corporate events, and special occasions. Transform your event with creativity and color."
title="Professional Face Painting & Body Art for Events"
description="Transform your event with expert face painting and body art. Paintasy delivers professional, creative entertainment for birthday parties, festivals, corporate events, and special occasions. Book professional face painters for your celebration today."
background={{ variant: "radial-gradient" }}
tag="Creative Entertainment"
tagIcon={Sparkles}
tagAnimation="slide-up"
buttons={[
{ text: "Book Your Event", href: "#packages-home" },
{ text: "Book Your Event", href: "/packages" },
{ text: "View Our Gallery", href: "/gallery" },
]}
buttonAnimation="blur-reveal"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg", imageAlt: "Professional face painting at event"},
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg?_wi=2", imageAlt: "Professional face painting at event"},
]}
mediaAnimation="opacity"
ariaLabel="Hero section with face painting showcase"
ariaLabel="Hero section with professional face painting showcase"
className="min-h-screen"
containerClassName="flex flex-col lg:flex-row items-center justify-between gap-12"
titleClassName="text-5xl lg:text-6xl font-extrabold leading-tight"
descriptionClassName="text-lg lg:text-xl opacity-90 max-w-2xl"
containerClassName="flex flex-col lg:flex-row items-center justify-between gap-8 lg:gap-12"
titleClassName="text-4xl sm:text-5xl lg:text-6xl font-extrabold leading-tight"
descriptionClassName="text-base sm:text-lg lg:text-xl opacity-90 max-w-2xl"
buttonContainerClassName="flex flex-col sm:flex-row gap-4 mt-8"
/>
</div>
<div id="about-home" data-section="about-home" className="mx-auto px-4 md:px-6">
<div id="about-home" data-section="about-home" className="mx-auto px-4 md:px-6 lg:px-8">
<MetricSplitMediaAbout
title="About Paintasy Face and Body Art"
description="Paintasy brings creativity and color to events with professional face painting and body art. We've been transforming celebrations and creating magical moments for hundreds of happy clients. Our artists are trained professionals dedicated to delivering exceptional service, vibrant designs, and memorable experiences."
title="About Paintasy - Expert Face Painting Services"
description="Paintasy brings creativity and color to events with professional face painting and body art services. We've been transforming celebrations and creating magical moments for hundreds of happy clients across the region. Our trained professional artists are dedicated to delivering exceptional service, vibrant designs, and unforgettable experiences for every event."
tag="Professional Artists"
tagIcon={Palette}
tagAnimation="slide-up"
@@ -133,16 +131,16 @@ export default function HomePage() {
metricsAnimation="slide-up"
useInvertedBackground={false}
ariaLabel="About section with company information"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-2xl"
containerClassName="gap-8 lg:gap-12"
titleClassName="text-3xl sm:text-4xl lg:text-5xl font-extrabold"
descriptionClassName="text-base sm:text-lg opacity-90 max-w-2xl"
/>
</div>
<div id="services-home" data-section="services-home" className="mx-auto px-4 md:px-6">
<div id="services-home" data-section="services-home" className="mx-auto px-4 md:px-6 lg:px-8">
<FeatureCardTen
title="Our Services"
description="Professional face painting and body art tailored for every occasion. From intimate birthday parties to large festival events, we deliver creativity and joy."
title="Our Face Painting & Body Art Services"
description="Professional face painting and body art services tailored for every occasion. From intimate birthday parties to large festival events, we deliver creativity, joy, and exceptional entertainment."
tag="Services"
tagIcon={Palette}
tagAnimation="slide-up"
@@ -151,7 +149,7 @@ export default function HomePage() {
useInvertedBackground={true}
features={[
{
id: "kids-party", title: "Kids Party Face Painting", description: "Fun, colorful designs perfect for birthday celebrations. Butterflies, superheroes, animals, and princesses.", media: {
id: "kids-party", title: "Kids Party Face Painting", description: "Fun, colorful face painting designs perfect for birthday celebrations. Butterflies, superheroes, animals, princesses, and more.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1", imageAlt: "Kids party face painting designs"},
items: [
{ icon: Sparkles, text: "Colorful & playful designs" },
@@ -161,7 +159,7 @@ export default function HomePage() {
reverse: false,
},
{
id: "festival", title: "Festival Face Art", description: "Fast, creative designs perfect for large crowds and outdoor events. Artistic flair meets quick service.", media: {
id: "festival", title: "Festival Face Art & Body Painting", description: "Fast, creative designs perfect for large crowds and outdoor events. Artistic flair meets quick service for maximum event impact.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1", imageAlt: "Festival face painting artwork"},
items: [
{ icon: Zap, text: "Fast service for crowds" },
@@ -171,7 +169,7 @@ export default function HomePage() {
reverse: true,
},
{
id: "corporate", title: "Corporate Event Entertainment", description: "Professional face painting for company parties, brand activations, and team celebrations.", media: {
id: "corporate", title: "Corporate Event Entertainment", description: "Professional face painting for company parties, brand activations, and team celebrations with branded design options.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1", imageAlt: "Corporate event face painting"},
items: [
{ icon: Briefcase, text: "Professional & polished service" },
@@ -183,17 +181,17 @@ export default function HomePage() {
]}
buttons={[{ text: "Explore All Services", href: "/services" }]}
buttonAnimation="blur-reveal"
ariaLabel="Services section showcasing offerings"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
ariaLabel="Services section showcasing face painting offerings"
containerClassName="gap-8 lg:gap-12"
itemClassName=""
mediaWrapperClassName=""
/>
</div>
<div id="packages-home" data-section="packages-home" className="mx-auto px-4 md:px-6">
<div id="packages-home" data-section="packages-home" className="mx-auto px-4 md:px-6 lg:px-8">
<PricingCardFive
title="Event Packages"
description="Simple, flexible pricing for parties, festivals, and corporate events. Each package includes professional service and artistic creativity."
title="Face Painting Event Packages"
description="Simple, flexible pricing for face painting services at parties, festivals, and corporate events. Each package includes professional service and artistic creativity."
tag="Transparent Pricing"
tagIcon={DollarSign}
tagAnimation="slide-up"
@@ -202,35 +200,35 @@ export default function HomePage() {
useInvertedBackground={false}
plans={[
{
id: "birthday-basic", tag: "Popular", price: "$150", period: "per hour", description: "Perfect for small birthday celebrations", button: { text: "Request Quote", href: "/contact" },
id: "birthday-basic", tag: "Popular", price: "$150", period: "per hour", description: "Perfect for small birthday celebrations", button: { text: "Request Quote", href: "/packages" },
featuresTitle: "What's Included", features: [
"Up to 15 kids", "Colorful themed designs", "Face painting only", "Basic design themes"],
},
{
id: "birthday-deluxe", tag: "Best Value", price: "$200", period: "per 2 hours", description: "Full party entertainment package", button: { text: "Request Quote", href: "/contact" },
id: "birthday-deluxe", tag: "Best Value", price: "$200", period: "per 2 hours", description: "Full party entertainment package", button: { text: "Request Quote", href: "/packages" },
featuresTitle: "What's Included", features: [
"Up to 25 kids", "Custom themed designs", "Face & temporary tattoos", "Interactive entertainment"],
},
{
id: "festival-event", tag: "Flexible", price: "$250", period: "per 3 hours", description: "Festival and outdoor event service", button: { text: "Request Quote", href: "/contact" },
id: "festival-event", tag: "Flexible", price: "$250", period: "per 3 hours", description: "Festival and outdoor event service", button: { text: "Request Quote", href: "/packages" },
featuresTitle: "What's Included", features: [
"High-capacity crowd service", "Fast artistic designs", "Setup & teardown included", "Portable station"],
},
]}
buttons={[{ text: "View All Packages", href: "#packages-home" }]}
buttons={[{ text: "View All Packages", href: "/packages" }]}
buttonAnimation="blur-reveal"
ariaLabel="Pricing section with package options"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
cardClassName="p-8"
containerClassName="gap-8 lg:gap-12"
cardContentClassName=""
planTagClassName=""
planPriceClassName=""
/>
</div>
<div id="testimonials-home" data-section="testimonials-home" className="mx-auto px-4 md:px-6">
<div id="testimonials-home" data-section="testimonials-home" className="mx-auto px-4 md:px-6 lg:px-8">
<TestimonialCardTwo
title="What Our Clients Say"
description="Real testimonials from happy clients who've booked Paintasy for their events."
title="Client Testimonials - Face Painting Reviews"
description="Real testimonials from happy clients who've booked Paintasy for their events and celebrations."
tag="Client Reviews"
tagIcon={Star}
tagAnimation="slide-up"
@@ -258,19 +256,19 @@ export default function HomePage() {
id: "testimonial-6", name: "Thomas Wilson", role: "Event Manager", testimonial: "From consultation to execution, Paintasy was excellent. They delivered exactly what we envisioned for our community event. A+", imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=2", imageAlt: "Community event face painting", icon: Star,
},
]}
buttons={[{ text: "Book Now", href: "#packages-home" }]}
buttons={[{ text: "Book Now", href: "/packages" }]}
buttonAnimation="blur-reveal"
ariaLabel="Client testimonials section"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
containerClassName="gap-8 lg:gap-12"
imageWrapperClassName=""
roleClassName=""
/>
</div>
<div id="gallery-preview-home" data-section="gallery-preview-home" className="mx-auto px-4 md:px-6">
<div id="gallery-preview-home" data-section="gallery-preview-home" className="mx-auto px-4 md:px-6 lg:px-8">
<ProductCardFour
title="Photo Gallery Showcase"
description="Real photos from our events and happy clients. Browse our portfolio of face painting and body art work."
title="Photo Gallery - Face Painting Portfolio"
description="Real photos from our events and happy clients. Browse our portfolio of professional face painting and body art work."
tag="Portfolio"
tagIcon={Camera}
tagAnimation="slide-up"
@@ -292,15 +290,15 @@ export default function HomePage() {
buttons={[{ text: "View Full Gallery", href: "/gallery" }]}
buttonAnimation="blur-reveal"
ariaLabel="Photo gallery preview section"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
containerClassName="gap-8 lg:gap-12"
cardNameClassName=""
cardPriceClassName=""
/>
</div>
<div id="faq-home" data-section="faq-home" className="mx-auto px-4 md:px-6">
<div id="faq-home" data-section="faq-home" className="mx-auto px-4 md:px-6 lg:px-8">
<FaqBase
title="Frequently Asked Questions"
title="Face Painting FAQ - Frequently Asked Questions"
description="Everything you need to know about booking Paintasy for your event."
tag="FAQ"
tagIcon={HelpCircle}
@@ -312,7 +310,7 @@ export default function HomePage() {
showCard={true}
faqs={[
{
id: "faq-1", title: "How far in advance should I book?", content: "We recommend booking at least 2-3 weeks in advance to secure your preferred date and time. For large events or peak seasons, 4-6 weeks advance booking is ideal. Last-minute bookings may be available depending on our schedule."},
id: "faq-1", title: "How far in advance should I book face painting services?", content: "We recommend booking at least 2-3 weeks in advance to secure your preferred date and time. For large events or peak seasons, 4-6 weeks advance booking is ideal. Last-minute bookings may be available depending on our schedule."},
{
id: "faq-2", title: "Are your face paints safe for children?", content: "Absolutely! We use only professional-grade, hypoallergenic face paints that are non-toxic and dermatologist-tested. All products are safe for sensitive skin. We also practice strict hygiene protocols, using clean brushes and sanitized application tools for each client."},
{
@@ -320,22 +318,22 @@ export default function HomePage() {
{
id: "faq-4", title: "What if someone has a skin allergy?", content: "We have hypoallergenic options available. Please inform us of any allergies when booking. We're always happy to discuss alternative products or test patches before proceeding with full face painting."},
{
id: "faq-5", title: "Can you do custom designs?", content: "Yes! We specialize in custom designs for themed parties and corporate events. Please provide theme details or reference images when booking. There may be a small additional fee for very complex custom designs."},
id: "faq-5", title: "Can you do custom face painting designs?", content: "Yes! We specialize in custom face painting designs for themed parties and corporate events. Please provide theme details or reference images when booking. There may be a small additional fee for very complex custom designs."},
{
id: "faq-6", title: "What's included in your packages?", content: "All packages include professional face painting service, setup and teardown, and our artist's materials. Some packages include additional services like temporary tattoos or body painting. Check specific package details for what's included."},
id: "faq-6", title: "What's included in your face painting packages?", content: "All packages include professional face painting service, setup and teardown, and our artist's materials. Some packages include additional services like temporary tattoos or body painting. Check specific package details for what's included."},
]}
buttons={[{ text: "Book Your Event", href: "#packages-home" }]}
buttons={[{ text: "Book Your Event", href: "/packages" }]}
buttonAnimation="blur-reveal"
ariaLabel="FAQ section with common questions"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
containerClassName="gap-8 lg:gap-12"
accordionClassName=""
accordionTitleClassName=""
/>
</div>
<div id="contact-home" data-section="contact-home" className="mx-auto px-4 md:px-6">
<div id="contact-home" data-section="contact-home" className="mx-auto px-4 md:px-6 lg:px-8">
<ContactText
text="Ready to add magic to your event? Get in touch with Paintasy Face and Body Art. Professional face painters ready to deliver exceptional entertainment and creative designs. We'd love to discuss your event and create an unforgettable experience for your guests."
text="Ready to add magic to your event? Get in touch with Paintasy Face and Body Art. We'd love to discuss your event and create an unforgettable experience for your guests."
animationType="background-highlight"
background={{ variant: "radial-gradient" }}
useInvertedBackground={false}
@@ -344,20 +342,20 @@ export default function HomePage() {
{ text: "Call Us", href: "tel:+15551234567" },
]}
ariaLabel="Contact call-to-action section"
containerClassName="py-16"
containerClassName="py-12 sm:py-16 lg:py-20"
contentClassName="max-w-3xl mx-auto"
textClassName="text-4xl font-extrabold text-center"
textClassName="text-2xl sm:text-3xl lg:text-4xl font-extrabold text-center"
buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
/>
</div>
<div id="footer-home" data-section="footer-home" className="mx-auto px-4 md:px-6">
<div id="footer-home" data-section="footer-home" className="mx-auto px-4 md:px-6 lg:px-8">
<FooterSimple
columns={footerColumns}
bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."
bottomRightText="Professional Event Entertainment | Creative Services"
ariaLabel="Site footer with links"
containerClassName="gap-12"
containerClassName="gap-8 lg:gap-12"
columnsClassName="grid-cols-2 lg:grid-cols-4"
columnTitleClassName="font-extrabold text-lg"
columnItemClassName="hover:opacity-70 transition-opacity"
@@ -365,4 +363,4 @@ export default function HomePage() {
</div>
</ThemeProvider>
);
}
}

View File

@@ -7,7 +7,7 @@ import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactText from '@/components/sections/contact/ContactText';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Sparkles, Palette, Heart, Smile, Zap, Star, Music, Users, DollarSign, HelpCircle } from 'lucide-react';
import { Sparkles, Palette, Heart, Smile, Zap, Music, Star, DollarSign } from 'lucide-react';
export default function ServicesPage() {
const navItems = [
@@ -79,25 +79,25 @@ export default function ServicesPage() {
/>
</div>
<div id="hero-services" data-section="hero-services" className="mx-auto px-4 md:px-6">
<div id="services-hero" data-section="services-hero" className="mx-auto px-4 md:px-6">
<HeroBillboardGallery
title="Our Services"
description="Professional face painting and body art tailored for every occasion. From intimate birthday parties to large festival events, we deliver creativity and joy to all your special moments."
title="Our Professional Services"
description="Discover our complete range of face painting and body art services. Whether you're planning a kids' birthday party, organizing a festival, or hosting a corporate event, we have the perfect creative solution for you."
background={{ variant: "radial-gradient" }}
tag="Professional Services"
tagIcon={Sparkles}
tagIcon={Palette}
tagAnimation="slide-up"
buttons={[
{ text: "Book Now", href: "/packages" },
{ text: "Get a Quote", href: "/contact" },
{ text: "Book Your Event", href: "/packages" },
{ text: "Request a Quote", href: "/contact" },
]}
buttonAnimation="blur-reveal"
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1", imageAlt: "Professional face painting services showcase"},
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg?_wi=3", imageAlt: "Professional face painting artist at work"},
]}
mediaAnimation="opacity"
ariaLabel="Services hero section"
ariaLabel="Services page hero section"
className="min-h-screen"
containerClassName="flex flex-col lg:flex-row items-center justify-between gap-12"
titleClassName="text-5xl lg:text-6xl font-extrabold leading-tight"
@@ -106,154 +106,93 @@ export default function ServicesPage() {
/>
</div>
<div id="kids-parties" data-section="kids-parties" className="mx-auto px-4 md:px-6">
<div id="services-details" data-section="services-details" className="mx-auto px-4 md:px-6">
<FeatureCardTen
title="Kids Party Face Painting"
description="Make every birthday celebration unforgettable with our colorful and playful face painting designs. Our artists specialize in creating magical moments for children of all ages."
tag="Party Entertainment"
tagIcon={Smile}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
features={[
{
id: "superhero-designs", title: "Superhero Designs", description: "Transform kids into their favorite superheroes with bold, colorful, and inspiring designs that make them feel powerful and special.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1", imageAlt: "Superhero face painting for kids"},
items: [
{ icon: Star, text: "Superman, Batman, Wonder Woman" },
{ icon: Sparkles, text: "Colorful and detailed designs" },
{ icon: Heart, text: "Safe, non-toxic face paints" },
],
reverse: false,
},
{
id: "animal-designs", title: "Animal & Fantasy Designs", description: "Bring imagination to life with enchanting animal faces and fantasy characters that capture children's wonder and creativity.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1", imageAlt: "Animal face painting designs"},
items: [
{ icon: Heart, text: "Butterflies, tigers, cats, dragons" },
{ icon: Zap, text: "Quick application - 5-10 minutes" },
{ icon: Smile, text: "Kids love the transformation" },
],
reverse: true,
},
{
id: "princess-themes", title: "Princess & Fairytale Themes", description: "Create magical memories with elegant princess face paintings and enchanted character designs that make dreams come true.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1", imageAlt: "Princess themed face painting"},
items: [
{ icon: Sparkles, text: "Cinderella, Ariel, Elsa designs" },
{ icon: Heart, text: "Elegant and refined details" },
{ icon: Star, text: "Photo-ready designs" },
],
reverse: false,
},
]}
buttons={[{ text: "Book Kids Party", href: "/packages" }]}
buttonAnimation="blur-reveal"
ariaLabel="Kids party face painting service"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
/>
</div>
<div id="festival-face-painting" data-section="festival-face-painting" className="mx-auto px-4 md:px-6">
<FeatureCardTen
title="Festival Face Painting"
description="Energize your outdoor events and festivals with fast, creative face art that delights crowds. Perfect for music festivals, carnivals, markets, and large celebrations."
tag="Festival Entertainment"
tagIcon={Music}
title="Service Offerings"
description="Each service is tailored to your event needs with professional artists, high-quality materials, and attention to detail."
tag="What We Offer"
tagIcon={Sparkles}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={true}
features={[
{
id: "quick-designs", title: "Quick Artistic Designs", description: "Optimized for high-volume events with beautiful, creative designs completed in 5-10 minutes per person.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1", imageAlt: "Festival quick face painting designs"},
id: "kids-party-service", title: "Kids Party Face Painting", description: "Transform children's faces into their favorite characters and creatures with our vibrant, playful designs. Perfect for birthday celebrations, creating magical moments and lasting memories.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1", imageAlt: "Colorful kids party face painting designs"},
items: [
{ icon: Zap, text: "Fast turnaround time" },
{ icon: Star, text: "Creative, artistic patterns" },
{ icon: Sparkles, text: "Professional quality results" },
{ icon: Sparkles, text: "Fun character designs" },
{ icon: Heart, text: "Safe for sensitive skin" },
{ icon: Smile, text: "Quick & efficient service" },
],
reverse: false,
},
{
id: "crowd-service", title: "High-Capacity Crowd Service", description: "Handle large crowds with efficiency and joy. Our portable stations and experienced artists keep the line moving while maintaining artistic excellence.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1", imageAlt: "Festival crowd face painting station"},
id: "festival-service", title: "Festival Face Art", description: "Eye-catching, artistic designs crafted at speed for crowds. Our festival service combines creative artistry with quick turnaround, perfect for outdoor events and high-traffic areas.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1", imageAlt: "Festival face art creative designs"},
items: [
{ icon: Users, text: "100+ people per event" },
{ icon: Music, text: "Perfect for any festival" },
{ icon: Heart, text: "Portable & self-contained setup" },
{ icon: Zap, text: "Fast professional service" },
{ icon: Star, text: "Artistic & bold designs" },
{ icon: Music, text: "Event-ready atmosphere" },
],
reverse: true,
},
{
id: "event-themes", title: "Event-Themed Designs", description: "Customize designs to match your festival theme, whether it's Halloween, neon nights, masquerade balls, or themed celebrations.", media: {
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=1", imageAlt: "Themed festival face painting"},
items: [
{ icon: Palette, text: "Custom color schemes" },
{ icon: Star, text: "Theme-matched designs" },
{ icon: Sparkles, text: "Cohesive event branding" },
],
reverse: false,
},
]}
buttons={[{ text: "Book Festival Service", href: "/packages" }]}
buttons={[{ text: "Book a Service", href: "/packages" }]}
buttonAnimation="blur-reveal"
ariaLabel="Festival face painting service"
ariaLabel="Detailed services section"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
itemClassName=""
mediaWrapperClassName=""
/>
</div>
<div id="faq-services" data-section="faq-services" className="mx-auto px-4 md:px-6">
<div id="services-faq" data-section="services-faq" className="mx-auto px-4 md:px-6">
<FaqBase
title="Services FAQ"
title="Service FAQs"
description="Common questions about our face painting and body art services."
tag="FAQ"
tagIcon={HelpCircle}
tag="Questions?"
tagIcon={DollarSign}
tagAnimation="slide-up"
textboxLayout="default"
animationType="smooth"
faqsAnimation="slide-up"
useInvertedBackground={false}
useInvertedBackground={true}
showCard={true}
faqs={[
{
id: "service-faq-1", title: "What is included in kids party face painting?", content: "Our kids party service includes professional face painting with colorful, playful designs. Kids can choose from superheroes, animals, princesses, and fantasy characters. Each design takes 5-10 minutes. We bring all materials and tools needed for safe, hygienic application."},
id: "service-faq-1", title: "How many children can you paint at a party?", content: "Depending on the party duration and design complexity, we can typically paint 15-25 children per hour. For birthday parties, we recommend 2-3 hours for groups of 10-20 kids, allowing time for custom designs and interactions."},
{
id: "service-faq-2", title: "How many kids can you paint at a party?", content: "This depends on party length. For a 2-hour party, we can typically paint 15-25 kids depending on design complexity. For longer parties (3-4 hours), we can accommodate 25-40+ children. Let us know your party size when booking, and we'll recommend the best package."},
id: "service-faq-2", title: "What designs are available for kids' parties?", content: "We offer classic designs like butterflies, superheroes, animals, pirates, princesses, and more. We can also create custom designs based on party themes. Browse our portfolio for inspiration, and we'll work with you to bring your vision to life."},
{
id: "service-faq-3", title: "Are the face paints hypoallergenic?", content: "Yes! We use only professional-grade, hypoallergenic face paints that are non-toxic and dermatologist-tested. All products are safe for sensitive skin and children. We practice strict hygiene protocols with clean brushes and sanitized tools for each client. If a child has known allergies, please inform us in advance."},
id: "service-faq-3", title: "Are the face paints waterproof?", content: "Our professional-grade paints are water-resistant and designed to last for several hours. They're not fully waterproof but are durable enough for most outdoor activities. We recommend avoiding prolonged water exposure immediately after application."},
{
id: "service-faq-4", title: "What makes festival face painting different?", content: "Festival face painting is designed for high-volume, quick service in outdoor settings. We create beautiful, artistic designs that can be completed in 5-10 minutes per person. Our portable stations are weather-resistant, and we're experienced with large crowds, long lines, and fast-paced environments."},
id: "service-faq-4", title: "Can you accommodate large festival events?", content: "Absolutely! We specialize in festival and outdoor event services. For large crowds, we can work quickly without compromising quality. We bring all necessary equipment and set up an efficient service station that can handle high volume."},
{
id: "service-faq-5", title: "Can you do custom designs for specific themes?", content: "Absolutely! We specialize in custom designs for themed parties and corporate events. Please provide your theme details, color preferences, or reference images when booking. For very complex custom designs, there may be a small additional fee, but we always discuss this upfront."},
id: "service-faq-5", title: "Do you offer body painting services?", content: "Yes, we offer professional body painting for special events, themed parties, and artistic projects. Body painting takes longer than face painting but creates stunning visual effects. Contact us to discuss your specific needs."},
{
id: "service-faq-6", title: "How long does face paint last?", content: "Our face paints typically last 4-6 hours with normal activity. They may smudge or fade with heavy sweating or water exposure. We provide care instructions on how to help the paint last longer. For longer events, we can touch up designs if needed."},
id: "service-faq-6", title: "What is your hygiene protocol?", content: "We follow strict hygiene standards. We use clean, sanitized brushes and applicators for each client. We also offer touchless application methods for those with sensitivities. All materials are professional-grade and hypoallergenic."},
]}
buttons={[{ text: "View All Packages", href: "/packages" }]}
buttons={[{ text: "Book Your Service", href: "/packages" }]}
buttonAnimation="blur-reveal"
ariaLabel="Services FAQ section"
containerClassName="gap-12"
titleClassName="text-4xl font-extrabold"
descriptionClassName="text-lg opacity-90 max-w-3xl"
accordionClassName=""
accordionTitleClassName=""
/>
</div>
<div id="contact-services" data-section="contact-services" className="mx-auto px-4 md:px-6">
<div id="services-contact" data-section="services-contact" className="mx-auto px-4 md:px-6">
<ContactText
text="Ready to bring creative face painting to your next event? Whether it's a kids' birthday party or a large festival, we're here to make it memorable. Get in touch with Paintasy to discuss your specific service needs."
text="Ready to book one of our services? Get in touch today! We'll work with you to customize the perfect face painting and body art experience for your event."
animationType="background-highlight"
background={{ variant: "radial-gradient" }}
useInvertedBackground={true}
useInvertedBackground={false}
buttons={[
{ text: "Request a Quote", href: "/contact" },
{ text: "Call Us", href: "tel:+15551234567" },
{ text: "Book Now", href: "/packages" },
]}
ariaLabel="Contact call-to-action section"
ariaLabel="Services contact call-to-action"
containerClassName="py-16"
contentClassName="max-w-3xl mx-auto"
textClassName="text-4xl font-extrabold text-center"
@@ -261,7 +200,7 @@ export default function ServicesPage() {
/>
</div>
<div id="footer-services" data-section="footer-services" className="mx-auto px-4 md:px-6">
<div id="services-footer" data-section="services-footer" className="mx-auto px-4 md:px-6">
<FooterSimple
columns={footerColumns}
bottomLeftText="© 2024 Paintasy Face and Body Art. All rights reserved."