Merge version_6 into main #12
@@ -1,55 +1,54 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
|
||||
import MetricSplitMediaAbout from "@/components/sections/about/MetricSplitMediaAbout";
|
||||
import FeatureCardTen from "@/components/sections/feature/FeatureCardTen";
|
||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
import { Palette, Award, Shield, CheckCircle } from "lucide-react";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import { Sparkles, Palette, Heart, Smile, Zap, Music, Briefcase, Target, Users, Star, Award } from 'lucide-react';
|
||||
|
||||
export default function AboutPage() {
|
||||
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" },
|
||||
{ name: "Home", id: "/" },
|
||||
{ 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: [
|
||||
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: [
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
{ label: "Packages", href: "/packages" },
|
||||
{ label: "FAQ", href: "/" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect",
|
||||
items: [
|
||||
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: [
|
||||
title: "Service Areas", items: [
|
||||
{ label: "Local Events", href: "/contact" },
|
||||
{ label: "Regional Coverage", href: "/contact" },
|
||||
{ label: "Book Now", href: "/packages" },
|
||||
@@ -73,102 +72,147 @@ export default function AboutPage() {
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
brandName="Paintasy"
|
||||
navItems={navItems}
|
||||
bottomLeftText="Creative Face & Body Art"
|
||||
bottomRightText="paintasy@events.com"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about-page-hero" data-section="about-page-hero">
|
||||
<HeroBillboardGallery
|
||||
title="About Paintasy"
|
||||
description="Professional face painting and body art entertainment bringing creativity and joy to events."
|
||||
background={{ variant: "radial-gradient" }}
|
||||
mediaItems={[
|
||||
{
|
||||
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=2",
|
||||
imageAlt: "Professional face painter at work",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="opacity"
|
||||
titleClassName="text-5xl font-extrabold"
|
||||
descriptionClassName="text-lg opacity-90"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about-story" data-section="about-story">
|
||||
<div id="about-main" data-section="about-main" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24 lg:py-32">
|
||||
<MetricSplitMediaAbout
|
||||
title="Our Story & Mission"
|
||||
description="Paintasy was founded on the belief that creative entertainment transforms events into unforgettable celebrations. We started with a passion for face painting and body art, and have grown into a professional team dedicated to bringing magic and color to every event we touch.\n\nOur mission is simple: deliver exceptional artistic service, genuine happiness, and professional entertainment that exceeds expectations. From children's birthday parties to corporate celebrations and festival events, we pour our hearts into creating beautiful, memorable experiences."
|
||||
tag="Professional Team"
|
||||
tagIcon={Award}
|
||||
title="Paintasy: Bringing Color and Joy to Every Celebration"
|
||||
description="Founded on the passion for creative expression and event entertainment, Paintasy has been transforming celebrations into unforgettable experiences. Our team of professional face and body painters combines artistic skill with genuine care for every client. Whether it's a child's first birthday party, a vibrant festival, or a corporate team-building event, we bring color, creativity, and joy to every occasion. With years of experience, professional-grade materials, and a commitment to safety and quality, Paintasy is your trusted partner for professional entertainment."
|
||||
tag="Our Story"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
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=3"
|
||||
imageAlt="Our professional face painting artist"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-artist-female-her-20s-art-studio-with-many-tools-painting_662251-1233.jpg?_wi=1"
|
||||
imageAlt="Paintasy artists working on creative designs"
|
||||
mediaAnimation="blur-reveal"
|
||||
metrics={[
|
||||
{ value: "500+", title: "Events Painted" },
|
||||
{ value: "1000+", title: "Happy Faces" },
|
||||
{ value: "10+", title: "Years Experience" },
|
||||
{ value: "100%", title: "Satisfaction Rate" },
|
||||
{ value: "15+", title: "Professional Artists" },
|
||||
{ value: "500+", title: "Events Completed" },
|
||||
{ value: "1000+", title: "Happy Faces Painted" },
|
||||
{ value: "100%", title: "Client Satisfaction" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={true}
|
||||
titleClassName="text-4xl font-extrabold"
|
||||
descriptionClassName="text-lg opacity-90 max-w-2xl"
|
||||
useInvertedBackground={false}
|
||||
ariaLabel="About page main section"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
titleClassName="text-4xl sm:text-5xl lg:text-6xl font-extrabold"
|
||||
descriptionClassName="text-base sm:text-lg opacity-90 max-w-3xl"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about-values" data-section="about-values">
|
||||
<div id="about-values" data-section="about-values" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
|
||||
<FeatureCardTen
|
||||
title="Our Values"
|
||||
description="What drives us in everything we do."
|
||||
title="Our Values & Commitment"
|
||||
description="What drives Paintasy every single day is our dedication to excellence, safety, and customer satisfaction. We believe that creativity should be accessible, affordable, and safe for everyone."
|
||||
tag="Why Choose Paintasy"
|
||||
tagIcon={Palette}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "value-1",
|
||||
title: "Creativity",
|
||||
description:
|
||||
"We believe in artistic expression and creative design. Every face is a canvas.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=3",
|
||||
imageAlt: "Creative face painting designs",
|
||||
},
|
||||
id: "quality", title: "Professional Quality", description: "We use only professional-grade, hypoallergenic face paints and premium materials. Every design is created with attention to detail and artistic excellence.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/art-supplies-arranged-table_23-2147854326.jpg?_wi=1", imageAlt: "Professional face painting supplies"},
|
||||
items: [
|
||||
{ icon: Palette, text: "Artistic innovation" },
|
||||
{ icon: CheckCircle, text: "Unique designs" },
|
||||
{ icon: Star, text: "Premium materials" },
|
||||
{ icon: Sparkles, text: "Professional artists" },
|
||||
{ icon: Heart, text: "Detail-oriented service" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
id: "value-2",
|
||||
title: "Safety & Professionalism",
|
||||
description:
|
||||
"We use only hypoallergenic, professional-grade face paints and maintain strict hygiene standards.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=5",
|
||||
imageAlt: "Safe professional face painting",
|
||||
},
|
||||
id: "safety", title: "Safety & Hygiene", description: "Your health and safety are our top priority. We follow strict hygiene protocols, use sanitized tools for each client, and provide hypoallergenic options for sensitive skin.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hands-being-washed_23-2149191617.jpg?_wi=1", imageAlt: "Professional hygiene practices"},
|
||||
items: [
|
||||
{ icon: Shield, text: "Hypoallergenic products" },
|
||||
{ icon: CheckCircle, text: "Safety certified" },
|
||||
{ icon: Smile, text: "Strict hygiene standards" },
|
||||
{ icon: Heart, text: "Hypoallergenic products" },
|
||||
{ icon: Target, text: "Health-conscious service" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "creativity", title: "Unlimited Creativity", description: "From classic designs to custom creations, we bring imagination to life. Our artists stay current with trends and can create virtually any design you envision.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/artist-woman-painting-portrait-canvas-studio_23-2148937856.jpg?_wi=1", imageAlt: "Artists creating custom designs"},
|
||||
items: [
|
||||
{ icon: Sparkles, text: "Custom designs" },
|
||||
{ icon: Zap, text: "Trendy artwork" },
|
||||
{ icon: Users, text: "Personalized service" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
]}
|
||||
containerClassName="gap-12"
|
||||
itemClassName="text-4xl font-extrabold"
|
||||
buttons={[{ text: "Book Your Event", href: "/packages" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="About page values section"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<div id="about-team" data-section="about-team" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
|
||||
<TestimonialCardTwo
|
||||
title="Meet Our Community"
|
||||
description="Paintasy is built on the foundation of passionate, talented artists and satisfied customers. Join thousands who've experienced the magic of professional face and body art."
|
||||
tag="Community"
|
||||
tagIcon={Users}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
animationType="blur-reveal"
|
||||
useInvertedBackground={false}
|
||||
carouselMode="buttons"
|
||||
testimonials={[
|
||||
{
|
||||
id: "team-1", name: "Aurora Studios", role: "Professional Artist", testimonial: "Paintasy gave me the platform to showcase my artistic talent and build a thriving career. I love working with diverse clients and creating magical moments at events.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-of-smiling-artist-at-studio_23-2149021637.jpg?_wi=1", imageAlt: "Professional Paintasy artist", icon: Sparkles,
|
||||
},
|
||||
{
|
||||
id: "team-2", name: "Creative Collective", role: "Event Partner", testimonial: "We partner with Paintasy because they consistently deliver exceptional entertainment. Their artists are professional, reliable, and always go above and beyond.", imageSrc: "http://img.b2bpic.net/free-photo/group-of-creative-professionals_23-2149112458.jpg?_wi=1", imageAlt: "Paintasy team at event", icon: Star,
|
||||
},
|
||||
{
|
||||
id: "testimonial-3", name: "Sarah Johnson", role: "Parent", testimonial: "My daughter talked about her birthday face painting for weeks! Paintasy made her feel so special. We'll definitely book them again for future celebrations.", imageSrc: "http://img.b2bpic.net/free-photo/happy-family-playing-together_23-2149062749.jpg?_wi=1", imageAlt: "Happy family with face painted child", icon: Heart,
|
||||
},
|
||||
{
|
||||
id: "testimonial-4", name: "Festival Directors", role: "Festival Organizer", testimonial: "Paintasy is our go-to entertainment provider. They handle high-volume requests with grace, create stunning designs, and make our festivals memorable.", imageSrc: "http://img.b2bpic.net/free-photo/diverse-group-enjoying-festival_23-2149156238.jpg?_wi=1", imageAlt: "Festival crowd enjoying Paintasy services", icon: Smile,
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Join Our Community", href: "/services" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="About page community testimonials"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about-cta" data-section="about-cta" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
|
||||
<ContactText
|
||||
text="Ready to be part of the Paintasy family? Whether you're looking to book our services or become a professional partner, we'd love to connect with you. Let's create something colorful and magical together!"
|
||||
animationType="background-highlight"
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{ text: "Book Services", href: "/packages" },
|
||||
{ text: "Contact Us", href: "/contact" },
|
||||
]}
|
||||
ariaLabel="About page call-to-action"
|
||||
containerClassName="py-12 sm:py-16 lg:py-20"
|
||||
contentClassName="max-w-3xl mx-auto"
|
||||
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-about" data-section="footer-about" 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-8 lg:gap-12"
|
||||
columnsClassName="grid-cols-2 lg:grid-cols-4"
|
||||
columnTitleClassName="font-extrabold text-lg"
|
||||
columnItemClassName="hover:opacity-70 transition-opacity"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
|
||||
@@ -2,20 +2,30 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import ContactForm from '@/components/form/ContactForm';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import { Calendar } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
import { Heart, Mail, Phone, MapPin, Facebook, Instagram, Twitter } from 'lucide-react';
|
||||
|
||||
export default function BookingPage() {
|
||||
const [formData, setFormData] = useState({
|
||||
name: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
eventDate: '',
|
||||
eventType: '',
|
||||
guestCount: '',
|
||||
message: '',
|
||||
});
|
||||
|
||||
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: "Book Event", id: "/booking" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
{ name: "Booking", id: "booking" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
@@ -56,6 +66,26 @@ export default function BookingPage() {
|
||||
},
|
||||
];
|
||||
|
||||
const handleFormChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData(prev => ({ ...prev, [name]: value }));
|
||||
};
|
||||
|
||||
const handleSubmit = (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
console.log('Booking form submitted:', formData);
|
||||
alert('Thank you for your booking request! We will contact you soon.');
|
||||
setFormData({
|
||||
name: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
eventDate: '',
|
||||
eventType: '',
|
||||
guestCount: '',
|
||||
message: '',
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
@@ -78,78 +108,206 @@ export default function BookingPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="booking-form" data-section="booking-form" className="mx-auto px-4 md:px-6 py-16">
|
||||
<div className="max-w-2xl mx-auto">
|
||||
<ContactForm
|
||||
title="Book Your Event"
|
||||
description="Get started with a quick inquiry. We'll follow up with you within 24 hours with availability and pricing details tailored to your event."
|
||||
tag="Lead Generation"
|
||||
tagIcon={Calendar}
|
||||
inputPlaceholder="Your email address"
|
||||
buttonText="Get Started"
|
||||
termsText="By submitting this form, you agree to be contacted about your event booking inquiry. We respect your privacy."
|
||||
centered={true}
|
||||
useInvertedBackground={false}
|
||||
onSubmit={(email) => {
|
||||
console.log('Booking inquiry from:', email);
|
||||
}}
|
||||
className="w-full"
|
||||
titleClassName="text-4xl font-extrabold mb-4"
|
||||
descriptionClassName="text-lg opacity-90 mb-8"
|
||||
tagClassName="mb-4"
|
||||
formWrapperClassName="mt-8"
|
||||
/>
|
||||
<div id="booking-hero" data-section="booking-hero" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24 lg:py-32">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<h1 className="text-4xl md:text-5xl lg:text-6xl font-extrabold mb-6 text-center bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 bg-clip-text text-transparent">
|
||||
Book Your Event
|
||||
</h1>
|
||||
<p className="text-lg md:text-xl text-center opacity-80 mb-12 max-w-2xl mx-auto">
|
||||
Request a quote for professional face painting and body art services. Fill out the form below and we'll get back to you with availability and pricing.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="booking-features" data-section="booking-features" className="mx-auto px-4 md:px-6 py-16">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<h2 className="text-3xl font-extrabold mb-12 text-center">Our Booking Process</h2>
|
||||
<div id="booking-form" data-section="booking-form" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20">
|
||||
<div className="max-w-2xl mx-auto">
|
||||
<div className="rounded-lg p-8 md:p-12 bg-gradient-to-br from-pink-50 via-purple-50 to-indigo-50 border-2 border-purple-200 shadow-lg">
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Full Name *</label>
|
||||
<input
|
||||
type="text"
|
||||
name="name"
|
||||
value={formData.name}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="Your name"
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Email Address *</label>
|
||||
<input
|
||||
type="email"
|
||||
name="email"
|
||||
value={formData.email}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="your@email.com"
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Phone Number *</label>
|
||||
<input
|
||||
type="tel"
|
||||
name="phone"
|
||||
value={formData.phone}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="(555) 123-4567"
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Event Date *</label>
|
||||
<input
|
||||
type="date"
|
||||
name="eventDate"
|
||||
value={formData.eventDate}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Event Type *</label>
|
||||
<select
|
||||
name="eventType"
|
||||
value={formData.eventType}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800"
|
||||
>
|
||||
<option value="">Select event type</option>
|
||||
<option value="birthday-party">Birthday Party</option>
|
||||
<option value="festival">Festival/Outdoor Event</option>
|
||||
<option value="corporate">Corporate Event</option>
|
||||
<option value="wedding">Wedding/Reception</option>
|
||||
<option value="school-event">School Event</option>
|
||||
<option value="other">Other</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Number of Guests *</label>
|
||||
<input
|
||||
type="number"
|
||||
name="guestCount"
|
||||
value={formData.guestCount}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="Approximate guest count"
|
||||
min="1"
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Message / Special Requests</label>
|
||||
<textarea
|
||||
name="message"
|
||||
value={formData.message}
|
||||
onChange={handleFormChange}
|
||||
placeholder="Tell us about your event and any special requests..."
|
||||
rows={5}
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-purple-300 focus:border-purple-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500 resize-none"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full bg-gradient-to-r from-pink-500 via-purple-500 to-indigo-500 hover:from-pink-600 hover:via-purple-600 hover:to-indigo-600 text-white font-bold py-3 px-6 rounded-lg transition-all duration-300 transform hover:scale-105 shadow-lg text-lg"
|
||||
>
|
||||
Get Your Quote
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="booking-info" data-section="booking-info" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20 bg-gradient-to-b from-transparent via-purple-50 to-transparent">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h2 className="text-3xl md:text-4xl lg:text-5xl font-extrabold text-center mb-12">Get In Touch</h2>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
<div className="p-6 bg-gradient-to-br from-blue-50 to-cyan-50 rounded-lg">
|
||||
<div className="text-4xl font-extrabold text-blue-600 mb-4">1</div>
|
||||
<h3 className="text-xl font-bold mb-3">Submit Inquiry</h3>
|
||||
<p className="text-opacity-80">Fill out our quick booking form with your event details and preferred date.</p>
|
||||
<div className="rounded-lg p-8 bg-white border-2 border-pink-200 shadow-lg text-center hover:shadow-xl transition-shadow">
|
||||
<Phone className="w-12 h-12 mx-auto mb-4 text-pink-500" />
|
||||
<h3 className="text-xl font-bold mb-2">Phone</h3>
|
||||
<p className="text-gray-700 mb-4">Call us for quick inquiries</p>
|
||||
<a href="tel:+15551234567" className="text-pink-500 font-semibold hover:text-pink-700 transition-colors">
|
||||
(555) 123-4567
|
||||
</a>
|
||||
</div>
|
||||
<div className="p-6 bg-gradient-to-br from-purple-50 to-pink-50 rounded-lg">
|
||||
<div className="text-4xl font-extrabold text-purple-600 mb-4">2</div>
|
||||
<h3 className="text-xl font-bold mb-3">Get Quote</h3>
|
||||
<p className="text-opacity-80">We'll review your event details and send you a custom quote within 24 hours.</p>
|
||||
|
||||
<div className="rounded-lg p-8 bg-white border-2 border-purple-200 shadow-lg text-center hover:shadow-xl transition-shadow">
|
||||
<Mail className="w-12 h-12 mx-auto mb-4 text-purple-500" />
|
||||
<h3 className="text-xl font-bold mb-2">Email</h3>
|
||||
<p className="text-gray-700 mb-4">Send us your booking details</p>
|
||||
<a href="mailto:paintasy@events.com" className="text-purple-500 font-semibold hover:text-purple-700 transition-colors">
|
||||
paintasy@events.com
|
||||
</a>
|
||||
</div>
|
||||
<div className="p-6 bg-gradient-to-br from-green-50 to-emerald-50 rounded-lg">
|
||||
<div className="text-4xl font-extrabold text-green-600 mb-4">3</div>
|
||||
<h3 className="text-xl font-bold mb-3">Confirm Booking</h3>
|
||||
<p className="text-opacity-80">Once confirmed, we'll send you all the details and setup information for your event.</p>
|
||||
|
||||
<div className="rounded-lg p-8 bg-white border-2 border-indigo-200 shadow-lg text-center hover:shadow-xl transition-shadow">
|
||||
<MapPin className="w-12 h-12 mx-auto mb-4 text-indigo-500" />
|
||||
<h3 className="text-xl font-bold mb-2">Location</h3>
|
||||
<p className="text-gray-700 mb-4">We service events in your area</p>
|
||||
<p className="text-indigo-500 font-semibold">
|
||||
Regional Coverage Available
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-16 text-center">
|
||||
<h3 className="text-2xl font-bold mb-6">Follow Us On Social Media</h3>
|
||||
<div className="flex justify-center gap-6 flex-wrap">
|
||||
<a
|
||||
href="https://facebook.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 px-6 py-3 rounded-lg bg-blue-500 text-white font-semibold hover:bg-blue-600 transition-colors shadow-lg hover:shadow-xl"
|
||||
>
|
||||
<Facebook className="w-5 h-5" />
|
||||
Facebook
|
||||
</a>
|
||||
<a
|
||||
href="https://instagram.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 px-6 py-3 rounded-lg bg-gradient-to-r from-pink-500 to-purple-500 text-white font-semibold hover:from-pink-600 hover:to-purple-600 transition-colors shadow-lg hover:shadow-xl"
|
||||
>
|
||||
<Instagram className="w-5 h-5" />
|
||||
Instagram
|
||||
</a>
|
||||
<a
|
||||
href="https://tiktok.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 px-6 py-3 rounded-lg bg-gray-900 text-white font-semibold hover:bg-gray-800 transition-colors shadow-lg hover:shadow-xl"
|
||||
>
|
||||
<Twitter className="w-5 h-5" />
|
||||
TikTok
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="booking-contact" data-section="booking-contact" className="mx-auto px-4 md:px-6">
|
||||
<ContactText
|
||||
text="Prefer to discuss your event first? Contact us directly and let's create something amazing together."
|
||||
animationType="background-highlight"
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{ text: "Call Us", href: "tel:+15551234567" },
|
||||
{ text: "Email Us", href: "mailto:paintasy@events.com" },
|
||||
]}
|
||||
ariaLabel="Booking contact call-to-action section"
|
||||
containerClassName="py-16"
|
||||
contentClassName="max-w-3xl mx-auto"
|
||||
textClassName="text-4xl font-extrabold text-center"
|
||||
buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer-booking" data-section="footer-booking" className="mx-auto px-4 md:px-6">
|
||||
<div id="footer-booking" data-section="footer-booking" 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"
|
||||
|
||||
@@ -2,20 +2,28 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import ContactForm from '@/components/form/ContactForm';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import { Mail, Phone, MapPin, Clock } from 'lucide-react';
|
||||
import { useState } from 'react';
|
||||
import { MessageCircle, Mail, Phone, MapPin, Clock, Facebook, Instagram, Twitter, Linkedin } from 'lucide-react';
|
||||
|
||||
export default function ContactPage() {
|
||||
const [formData, setFormData] = useState({
|
||||
name: '',
|
||||
email: '',
|
||||
subject: '',
|
||||
message: '',
|
||||
});
|
||||
|
||||
const [submitted, setSubmitted] = useState(false);
|
||||
|
||||
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: "Book Event", id: "/booking" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
{ name: "Booking", id: "booking" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
@@ -56,6 +64,24 @@ export default function ContactPage() {
|
||||
},
|
||||
];
|
||||
|
||||
const handleFormChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData(prev => ({ ...prev, [name]: value }));
|
||||
};
|
||||
|
||||
const handleSubmit = (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
console.log('Contact form submitted:', formData);
|
||||
setSubmitted(true);
|
||||
setFormData({
|
||||
name: '',
|
||||
email: '',
|
||||
subject: '',
|
||||
message: '',
|
||||
});
|
||||
setTimeout(() => setSubmitted(false), 3000);
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
@@ -78,104 +104,199 @@ export default function ContactPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact-hero" data-section="contact-hero" className="mx-auto px-4 md:px-6 py-16">
|
||||
<div className="max-w-3xl mx-auto text-center">
|
||||
<h1 className="text-5xl lg:text-6xl font-extrabold mb-6">Get in Touch</h1>
|
||||
<p className="text-xl opacity-90 mb-8">
|
||||
Have questions about our services? Want to discuss your event in detail? We're here to help! Reach out and let's create something unforgettable together. Our team is dedicated to making your event a success with exceptional service and creative artistry.
|
||||
<div id="contact-hero" data-section="contact-hero" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24 lg:py-32">
|
||||
<div className="max-w-4xl mx-auto text-center">
|
||||
<h1 className="text-4xl md:text-5xl lg:text-6xl font-extrabold mb-6 bg-gradient-to-r from-red-500 via-yellow-500 to-pink-500 bg-clip-text text-transparent">
|
||||
Contact Us
|
||||
</h1>
|
||||
<p className="text-lg md:text-xl opacity-80 mb-4 max-w-2xl mx-auto">
|
||||
Have questions or ready to book? We'd love to hear from you! Reach out to our team and let's make your event unforgettable.
|
||||
</p>
|
||||
</div>
|
||||
</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">
|
||||
<ContactForm
|
||||
title="Send us a Message"
|
||||
description="Fill out the form below and we'll get back to you as soon as possible. For urgent inquiries, please call us directly."
|
||||
tag="Contact Us"
|
||||
tagIcon={Mail}
|
||||
inputPlaceholder="Your email address"
|
||||
buttonText="Send Message"
|
||||
termsText="We'll use your email to respond to your inquiry. We respect your privacy and won't share your information."
|
||||
centered={true}
|
||||
useInvertedBackground={false}
|
||||
onSubmit={(email) => {
|
||||
console.log('Contact form submission from:', email);
|
||||
}}
|
||||
className="w-full"
|
||||
titleClassName="text-3xl font-extrabold mb-4"
|
||||
descriptionClassName="text-base opacity-90 mb-8"
|
||||
tagClassName="mb-4"
|
||||
formWrapperClassName="mt-8"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div id="contact-content" data-section="contact-content" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20">
|
||||
<div className="max-w-6xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-12">
|
||||
{/* Contact Form */}
|
||||
<div className="rounded-lg p-8 md:p-10 bg-gradient-to-br from-blue-50 via-cyan-50 to-teal-50 border-2 border-cyan-300 shadow-lg">
|
||||
<h2 className="text-3xl font-bold mb-8 text-gray-800">Send Us a Message</h2>
|
||||
|
||||
{submitted && (
|
||||
<div className="mb-6 p-4 rounded-lg bg-green-100 border-2 border-green-400 text-green-800 font-semibold">
|
||||
✓ Thank you! We'll be in touch soon.
|
||||
</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">
|
||||
<h2 className="text-3xl font-extrabold mb-12 text-center">Other Ways to Reach Us</h2>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
<div className="p-8 bg-gradient-to-br from-blue-50 to-cyan-50 rounded-lg">
|
||||
<div className="flex items-center gap-4 mb-4">
|
||||
<Phone className="w-8 h-8 text-blue-600" />
|
||||
<h3 className="text-xl font-bold">Phone</h3>
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Your Name *</label>
|
||||
<input
|
||||
type="text"
|
||||
name="name"
|
||||
value={formData.name}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="John Doe"
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Email Address *</label>
|
||||
<input
|
||||
type="email"
|
||||
name="email"
|
||||
value={formData.email}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="your@email.com"
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Subject *</label>
|
||||
<input
|
||||
type="text"
|
||||
name="subject"
|
||||
value={formData.subject}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="How can we help?"
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-semibold mb-2 text-gray-800">Message *</label>
|
||||
<textarea
|
||||
name="message"
|
||||
value={formData.message}
|
||||
onChange={handleFormChange}
|
||||
required
|
||||
placeholder="Tell us more about your inquiry..."
|
||||
rows={6}
|
||||
className="w-full px-4 py-3 rounded-lg border-2 border-cyan-300 focus:border-cyan-500 focus:outline-none transition-colors bg-white text-gray-800 placeholder-gray-500 resize-none"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full bg-gradient-to-r from-cyan-500 via-blue-500 to-teal-500 hover:from-cyan-600 hover:via-blue-600 hover:to-teal-600 text-white font-bold py-3 px-6 rounded-lg transition-all duration-300 transform hover:scale-105 shadow-lg text-lg"
|
||||
>
|
||||
Send Message
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{/* Contact Information */}
|
||||
<div className="space-y-8">
|
||||
<div className="rounded-lg p-8 bg-gradient-to-br from-red-50 to-orange-50 border-2 border-red-200 shadow-lg hover:shadow-xl transition-shadow">
|
||||
<div className="flex items-start gap-4">
|
||||
<Phone className="w-8 h-8 text-red-500 flex-shrink-0 mt-1" />
|
||||
<div>
|
||||
<h3 className="text-lg font-bold text-gray-800 mb-2">Phone</h3>
|
||||
<a href="tel:+15551234567" className="text-lg font-semibold text-red-600 hover:text-red-700 transition-colors">
|
||||
(555) 123-4567
|
||||
</a>
|
||||
<p className="text-gray-700 mt-1 text-sm">Available Mon-Sun, 9 AM - 6 PM</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-lg font-semibold text-blue-600 mb-2">+1 (555) 123-4567</p>
|
||||
<p className="opacity-80">Call us Monday to Friday, 9am to 6pm EST. We're available for event consultations and urgent bookings.</p>
|
||||
</div>
|
||||
<div className="p-8 bg-gradient-to-br from-purple-50 to-pink-50 rounded-lg">
|
||||
<div className="flex items-center gap-4 mb-4">
|
||||
<Mail className="w-8 h-8 text-purple-600" />
|
||||
<h3 className="text-xl font-bold">Email</h3>
|
||||
|
||||
<div className="rounded-lg p-8 bg-gradient-to-br from-yellow-50 to-amber-50 border-2 border-yellow-200 shadow-lg hover:shadow-xl transition-shadow">
|
||||
<div className="flex items-start gap-4">
|
||||
<Mail className="w-8 h-8 text-yellow-600 flex-shrink-0 mt-1" />
|
||||
<div>
|
||||
<h3 className="text-lg font-bold text-gray-800 mb-2">Email</h3>
|
||||
<a href="mailto:paintasy@events.com" className="text-lg font-semibold text-yellow-700 hover:text-yellow-800 transition-colors">
|
||||
paintasy@events.com
|
||||
</a>
|
||||
<p className="text-gray-700 mt-1 text-sm">We reply within 24 hours</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-lg font-semibold text-purple-600 mb-2">paintasy@events.com</p>
|
||||
<p className="opacity-80">Email us anytime! We respond to all inquiries within 24 hours, often sooner.</p>
|
||||
</div>
|
||||
<div className="p-8 bg-gradient-to-br from-green-50 to-emerald-50 rounded-lg">
|
||||
<div className="flex items-center gap-4 mb-4">
|
||||
<MapPin className="w-8 h-8 text-green-600" />
|
||||
<h3 className="text-xl font-bold">Service Area</h3>
|
||||
|
||||
<div className="rounded-lg p-8 bg-gradient-to-br from-green-50 to-emerald-50 border-2 border-green-200 shadow-lg hover:shadow-xl transition-shadow">
|
||||
<div className="flex items-start gap-4">
|
||||
<MapPin className="w-8 h-8 text-green-600 flex-shrink-0 mt-1" />
|
||||
<div>
|
||||
<h3 className="text-lg font-bold text-gray-800 mb-2">Service Area</h3>
|
||||
<p className="text-gray-700 font-semibold">Regional Coverage</p>
|
||||
<p className="text-gray-700 mt-1 text-sm">We service events throughout the region</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-lg font-semibold text-green-600 mb-2">Local & Regional Coverage</p>
|
||||
<p className="opacity-80">We serve the greater metropolitan area and surrounding regions for events of all sizes.</p>
|
||||
</div>
|
||||
<div className="p-8 bg-gradient-to-br from-orange-50 to-red-50 rounded-lg">
|
||||
<div className="flex items-center gap-4 mb-4">
|
||||
<Clock className="w-8 h-8 text-orange-600" />
|
||||
<h3 className="text-xl font-bold">Response Time</h3>
|
||||
|
||||
<div className="rounded-lg p-8 bg-gradient-to-br from-purple-50 to-pink-50 border-2 border-purple-200 shadow-lg hover:shadow-xl transition-shadow">
|
||||
<div className="flex items-start gap-4">
|
||||
<Clock className="w-8 h-8 text-purple-600 flex-shrink-0 mt-1" />
|
||||
<div>
|
||||
<h3 className="text-lg font-bold text-gray-800 mb-2">Hours</h3>
|
||||
<p className="text-gray-700 text-sm">Monday - Sunday</p>
|
||||
<p className="text-gray-700 font-semibold text-sm">9:00 AM - 6:00 PM</p>
|
||||
<p className="text-gray-700 text-sm mt-1">Holiday hours may vary</p>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-lg font-semibold text-orange-600 mb-2">Quick Turnaround</p>
|
||||
<p className="opacity-80">We typically respond within 24 hours. Rush bookings welcome—just let us know!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="contact-closing" data-section="contact-closing" className="mx-auto px-4 md:px-6">
|
||||
<ContactText
|
||||
text="Ready to book your event or have more questions? Reach out today and let's start planning your creative experience!"
|
||||
animationType="background-highlight"
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{ text: "Book Now", href: "/booking" },
|
||||
{ text: "Call Now", href: "tel:+15551234567" },
|
||||
]}
|
||||
ariaLabel="Contact closing call-to-action section"
|
||||
containerClassName="py-16"
|
||||
contentClassName="max-w-3xl mx-auto"
|
||||
textClassName="text-4xl font-extrabold text-center"
|
||||
buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8"
|
||||
/>
|
||||
{/* Social Media Section */}
|
||||
<div id="contact-social" data-section="contact-social" className="mx-auto px-4 md:px-6 lg:px-8 py-12 md:py-16 lg:py-20 bg-gradient-to-r from-pink-100 via-purple-100 to-indigo-100">
|
||||
<div className="max-w-4xl mx-auto text-center">
|
||||
<h2 className="text-3xl md:text-4xl lg:text-5xl font-extrabold mb-4">Connect With Us</h2>
|
||||
<p className="text-lg opacity-80 mb-12">Follow our social media for behind-the-scenes content, event updates, and creative inspiration</p>
|
||||
|
||||
<div className="flex justify-center gap-6 flex-wrap">
|
||||
<a
|
||||
href="https://facebook.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-blue-500 text-white font-bold hover:bg-blue-600 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
|
||||
>
|
||||
<Facebook className="w-6 h-6" />
|
||||
Facebook
|
||||
</a>
|
||||
<a
|
||||
href="https://instagram.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-gradient-to-r from-pink-500 to-purple-500 text-white font-bold hover:from-pink-600 hover:to-purple-600 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
|
||||
>
|
||||
<Instagram className="w-6 h-6" />
|
||||
Instagram
|
||||
</a>
|
||||
<a
|
||||
href="https://tiktok.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-gray-900 text-white font-bold hover:bg-gray-800 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
|
||||
>
|
||||
<Twitter className="w-6 h-6" />
|
||||
TikTok
|
||||
</a>
|
||||
<a
|
||||
href="https://linkedin.com"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-3 px-8 py-4 rounded-lg bg-blue-700 text-white font-bold hover:bg-blue-800 transition-all duration-300 transform hover:scale-110 shadow-lg hover:shadow-xl"
|
||||
>
|
||||
<Linkedin className="w-6 h-6" />
|
||||
LinkedIn
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer-contact" data-section="footer-contact" className="mx-auto px-4 md:px-6">
|
||||
<div id="footer-contact" data-section="footer-contact" 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"
|
||||
|
||||
@@ -5,16 +5,15 @@ import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/Nav
|
||||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import { Camera } from 'lucide-react';
|
||||
import { Camera, Sparkles } from 'lucide-react';
|
||||
|
||||
export default function GalleryPage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Packages", id: "packages" },
|
||||
{ name: "Packages", id: "/packages" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Book Event", id: "/booking" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
@@ -50,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: "/booking" },
|
||||
{ label: "Book Now", href: "/packages" },
|
||||
{ label: "Get Quote", href: "/contact" },
|
||||
],
|
||||
},
|
||||
@@ -78,55 +77,59 @@ export default function GalleryPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery-section" data-section="gallery-section" className="mx-auto px-4 md:px-6">
|
||||
<div id="gallery-full" data-section="gallery-full" className="mx-auto px-4 md:px-6 py-20">
|
||||
<ProductCardFour
|
||||
title="Event Photo Gallery"
|
||||
description="Browse our complete portfolio of real event photos showcasing our face painting and body art work across parties, festivals, corporate events, and special occasions."
|
||||
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="slide-up"
|
||||
animationType="opacity"
|
||||
useInvertedBackground={false}
|
||||
gridVariant="bento-grid"
|
||||
carouselMode="buttons"
|
||||
products={[
|
||||
{
|
||||
id: "event-1", name: "Birthday Party Designs", price: "Kids Celebration", variant: "Face Painting", imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=1", imageAlt: "Children with colorful birthday party face 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: "event-2", name: "Festival Face Art", price: "Creative Expression", variant: "Outdoor Event", imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1", imageAlt: "Professional artist applying festival face art"},
|
||||
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: "event-3", name: "Professional Body Painting", price: "Artistic Excellence", 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 art from special event"},
|
||||
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: "event-4", name: "Themed Party Artwork", price: "Custom Themes", variant: "Party Entertainment", imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1", imageAlt: "Custom themed face painting for party guests"},
|
||||
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: "event-5", name: "Festival Crowd Service", price: "High Volume", variant: "Festival Event", imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=1", imageAlt: "Festival attendees enjoying rapid face painting service"},
|
||||
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: "event-6", name: "Corporate Event Entertainment", price: "Professional Service", variant: "Business Event", imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1", imageAlt: "Corporate event attendees with professional face painting"},
|
||||
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: "event-7", name: "Workshop & Tutorial", price: "Educational", variant: "Live Demonstration", 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: "Live face painting demonstration and technique"},
|
||||
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: "event-8", name: "School Event Entertainment", price: "Youth Programs", variant: "School Carnival", imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1", imageAlt: "School event with children enjoying face painting"},
|
||||
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: "Book Your Event", href: "/booking" }]}
|
||||
buttons={[{ text: "Book Your Event", href: "/packages" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Complete photo gallery of events"
|
||||
ariaLabel="Complete photo gallery with all artworks"
|
||||
containerClassName="gap-12"
|
||||
cardNameClassName="text-4xl font-extrabold"
|
||||
cardNameClassName=""
|
||||
cardPriceClassName=""
|
||||
cardVariantClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery-contact" data-section="gallery-contact" className="mx-auto px-4 md:px-6">
|
||||
<div id="contact-gallery" data-section="contact-gallery" className="mx-auto px-4 md:px-6">
|
||||
<ContactText
|
||||
text="Inspired by our gallery? Book Paintasy for your next event and create your own memorable moments. Let us bring creativity and color to your celebration."
|
||||
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 Now", href: "/booking" },
|
||||
{ text: "Get a Quote", href: "/contact" },
|
||||
{ text: "Request a Quote", href: "/contact" },
|
||||
{ text: "View Packages", href: "/packages" },
|
||||
]}
|
||||
ariaLabel="Gallery call-to-action section"
|
||||
ariaLabel="Contact section for gallery page"
|
||||
containerClassName="py-16"
|
||||
contentClassName="max-w-3xl mx-auto"
|
||||
textClassName="text-4xl font-extrabold text-center"
|
||||
|
||||
@@ -8,7 +8,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, DollarSign, Check, Clock, Users, Star, HelpCircle, Zap } from 'lucide-react';
|
||||
import { Sparkles, DollarSign, Check, Zap, Users, Music } from 'lucide-react';
|
||||
|
||||
export default function PackagesPage() {
|
||||
const navItems = [
|
||||
@@ -32,7 +32,7 @@ export default function PackagesPage() {
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/" },
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
{ label: "Packages", href: "/packages" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
@@ -80,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="Flexible, transparent pricing for all event types. Choose from our curated packages or customize one to match your specific needs and budget. Professional service, artistic creativity, guaranteed satisfaction."
|
||||
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"
|
||||
tagIcon={DollarSign}
|
||||
tag="Book Your Entertainment"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{ text: "View All Packages", href: "#pricing" },
|
||||
{ text: "Request Custom Quote", href: "/contact" },
|
||||
{ text: "View Packages", href: "#packages-pricing" },
|
||||
{ text: "Contact Us", href: "/contact" },
|
||||
]}
|
||||
buttonAnimation="blur-reveal"
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-wearing-make-up-woman-wearing-mask_23-2148784326.jpg", imageAlt: "Event package showcase"},
|
||||
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 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"
|
||||
@@ -107,99 +107,99 @@ 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="Our Event Packages"
|
||||
description="Simple, flexible pricing tailored to your event type and guest count. All packages include professional service and materials."
|
||||
tag="Book Your Package"
|
||||
tagIcon={Sparkles}
|
||||
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"
|
||||
animationType="scale-rotate"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "birthday-basic", tag: "Popular", price: "$150", period: "per hour", description: "Perfect for small birthday celebrations", button: { text: "Book Now", href: "/contact" },
|
||||
featuresTitle: "What's Included", features: [
|
||||
"Up to 15 kids", "Colorful themed designs", "Face painting only", "Basic design themes", "All supplies included"],
|
||||
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: "Book Now", href: "/contact" },
|
||||
featuresTitle: "What's Included", features: [
|
||||
"Up to 25 kids", "Custom themed designs", "Face & temporary tattoos", "Interactive entertainment", "Setup & cleanup included"],
|
||||
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: "Book Now", href: "/contact" },
|
||||
featuresTitle: "What's Included", features: [
|
||||
"High-capacity crowd service", "Fast artistic designs", "Setup & teardown included", "Portable station", "Ideal for 50+ attendees"],
|
||||
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: "Need Custom Pricing?", href: "/contact" }]}
|
||||
buttons={[{ text: "Contact for Custom Quote", href: "/contact" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Pricing packages section"
|
||||
ariaLabel="Pricing section with package options"
|
||||
containerClassName="gap-12"
|
||||
textBoxTitleClassName="text-4xl font-extrabold"
|
||||
textBoxDescriptionClassName="text-lg opacity-90 max-w-3xl"
|
||||
cardClassName="p-8"
|
||||
cardContentClassName=""
|
||||
planTagClassName=""
|
||||
planPriceClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="package-details" data-section="package-details" className="mx-auto px-4 md:px-6">
|
||||
<div id="packages-details" data-section="packages-details" className="mx-auto px-4 md:px-6">
|
||||
<FeatureCardTen
|
||||
title="Package Details & Customization"
|
||||
description="Each package can be tailored to your specific event needs. Here's what you can customize."
|
||||
tag="Flexible Options"
|
||||
tagIcon={Zap}
|
||||
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}
|
||||
features={[
|
||||
{
|
||||
id: "duration", title: "Custom Duration", description: "Need more or less time? We offer flexible hourly bookings. Minimum 1 hour service. Discounts available for 4+ hour bookings. Tell us your event timeline and we'll find the perfect fit.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1", imageAlt: "Face painting time management"},
|
||||
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: Clock, text: "Flexible hour options" },
|
||||
{ icon: Check, text: "Extended booking discounts" },
|
||||
{ icon: Star, text: "Customized timelines" },
|
||||
{ icon: Sparkles, text: "Trained professionals" },
|
||||
{ icon: Check, text: "Punctual & reliable" },
|
||||
{ icon: Users, text: "Guest-focused service" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
id: "crowd-size", title: "Guest Count Options", description: "Whether you're hosting 10 guests or 1,000, we can scale our service. Larger events may require multiple artists. We'll assess your guest count and recommend the right setup for seamless service.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/group-young-friends-celebrating-new-year_23-2147720468.jpg", imageAlt: "Large event face painting"},
|
||||
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: Users, text: "Small to large events" },
|
||||
{ icon: Check, text: "Multi-artist availability" },
|
||||
{ icon: Zap, text: "Crowd management expertise" },
|
||||
{ icon: Check, text: "Hypoallergenic products" },
|
||||
{ icon: Sparkles, text: "Strict hygiene standards" },
|
||||
{ icon: Music, text: "Safe for all ages" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "design-themes", title: "Design Themes & Customization", description: "Choose from popular themes or bring your own. Character designs, branded elements, seasonal themes, or completely custom artwork. We work with you to match your event's vibe and create memorable experiences.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1", imageAlt: "Custom themed face painting designs"},
|
||||
items: [
|
||||
{ icon: Sparkles, text: "Popular theme options" },
|
||||
{ icon: Check, text: "Fully custom designs available" },
|
||||
{ icon: Star, text: "Branded design capability" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Customize Your Package", href: "/contact" }]}
|
||||
buttons={[{ text: "Request a Quote", href: "/contact" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Package details and customization options"
|
||||
ariaLabel="Package details and inclusions"
|
||||
containerClassName="gap-12"
|
||||
itemClassName="text-4xl font-extrabold"
|
||||
itemClassName=""
|
||||
mediaWrapperClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq-packages" data-section="faq-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 & Packages FAQ"
|
||||
description="Everything you need to know about booking and our package options."
|
||||
tag="FAQ"
|
||||
tagIcon={HelpCircle}
|
||||
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"
|
||||
@@ -208,42 +208,42 @@ export default function PackagesPage() {
|
||||
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 (50+ guests) or peak seasons (summer, holidays), 4-6 weeks advance booking is ideal. Last-minute bookings may be available depending on our schedule—contact us to check availability."},
|
||||
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: "faq-2", title: "Can I customize a package?", content: "Absolutely! All our packages are starting points. We can adjust duration, guest count, design themes, and service type to match your exact needs. Custom packages may have different pricing—contact us with your requirements for a personalized quote."},
|
||||
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: "faq-3", title: "What's your deposit and payment policy?", content: "A 50% non-refundable deposit is required to secure your booking. The remaining balance is due 7 days before your event. We accept credit cards, checks, and digital payments. For large or custom events, we're happy to discuss payment plans."},
|
||||
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: "faq-4", title: "What if I need to reschedule or cancel?", content: "Cancellations made 2+ weeks before your event receive a full refund minus the deposit. Cancellations within 2 weeks forfeit the deposit. Rescheduling to another date is subject to availability. We understand emergencies happen—contact us to discuss your situation."},
|
||||
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: "faq-5", title: "Do you offer discounts for bulk bookings?", content: "Yes! We offer discounts for bookings of 4+ hours or multiple events. Large corporate packages (100+ attendees) also qualify for special pricing. Contact us with your details to receive a customized quote."},
|
||||
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: "faq-6", title: "Are there additional fees (travel, setup, etc.)?", content: "Our quoted rates include artist service, supplies, and standard setup. Travel within 15 miles is included. Venues beyond 15 miles may have a travel fee (typically $25-50 depending on distance). Complex setups or specialty requests may have additional fees—we'll discuss these upfront."},
|
||||
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: "faq-7", title: "What happens if you need to cancel on us?", content: "In the unlikely event we must cancel, we'll provide full refund and help you find an alternative artist. Our booking confirmation includes liability information and a backup artist reference when possible."},
|
||||
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: "faq-8", title: "Can you work with my specific event theme?", content: "Yes! We love working with event themes. Share your theme, colors, and design preferences when booking. We can create custom designs, coordinate with your event aesthetic, and even incorporate branding for corporate events."},
|
||||
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 Your Package", href: "/contact" }]}
|
||||
buttons={[{ text: "Book Now", href: "/contact" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Booking and packages FAQ section"
|
||||
ariaLabel="Packages FAQ section"
|
||||
containerClassName="gap-12"
|
||||
textBoxTitleClassName="text-4xl font-extrabold"
|
||||
textBoxDescriptionClassName="text-lg opacity-90 max-w-3xl"
|
||||
accordionClassName=""
|
||||
accordionTitleClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact-packages" data-section="contact-packages" className="mx-auto px-4 md:px-6">
|
||||
<div id="packages-contact" data-section="packages-contact" className="mx-auto px-4 md:px-6">
|
||||
<ContactText
|
||||
text="Ready to book your event? Browse our packages, customize one to fit your needs, or request a personalized quote. Let's create a memorable experience for your guests!"
|
||||
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: "Request a Quote", href: "/contact" },
|
||||
{ text: "Call Us", href: "tel:+15551234567" },
|
||||
{ text: "Get Your Quote", href: "/contact" },
|
||||
{ text: "Call Us Now", href: "tel:+15551234567" },
|
||||
]}
|
||||
ariaLabel="Packages contact call-to-action section"
|
||||
ariaLabel="Packages contact call-to-action"
|
||||
containerClassName="py-16"
|
||||
contentClassName="max-w-3xl mx-auto"
|
||||
textClassName="text-4xl font-extrabold text-center"
|
||||
@@ -251,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."
|
||||
|
||||
231
src/app/page.tsx
231
src/app/page.tsx
@@ -13,14 +13,7 @@ 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';
|
||||
import { Metadata } from 'next';
|
||||
|
||||
export const metadata: 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, corporate events, and weddings. Expert face artists, safe hypoallergenic paints, custom designs. Book your creative entertainment today.", keywords: "face painting, body art, kids face painting, festival face painting, corporate events, party entertainment, professional face painter, body painting, face art, event entertainment", openGraph: {
|
||||
title: "Paintasy Face and Body Art - Professional Face Painting Services", description: "Transform your event with professional face painting and body art. Serving kids parties, festivals, corporate events, and special occasions.", type: "website"},
|
||||
twitter: {
|
||||
card: "summary_large_image", title: "Paintasy Face and Body Art", description: "Professional face painting & body art for events - kids parties, festivals, corporate events"},
|
||||
};
|
||||
import Head from 'next/head';
|
||||
|
||||
export default function HomePage() {
|
||||
const navItems = [
|
||||
@@ -29,26 +22,27 @@ export default function HomePage() {
|
||||
{ name: "Gallery", id: "gallery" },
|
||||
{ name: "Packages", id: "packages" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Booking", id: "booking" },
|
||||
{ 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" },
|
||||
{ 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: "About Us", href: "/about" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
{ label: "Packages", href: "/packages" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
@@ -62,10 +56,10 @@ export default function HomePage() {
|
||||
},
|
||||
{
|
||||
title: "Service Areas", items: [
|
||||
{ label: "Local Events", href: "#contact" },
|
||||
{ label: "Regional Coverage", href: "#contact" },
|
||||
{ label: "Book Now", href: "#packages" },
|
||||
{ label: "Get Quote", href: "#contact" },
|
||||
{ label: "Local Events", href: "/contact" },
|
||||
{ label: "Regional Coverage", href: "/contact" },
|
||||
{ label: "Book Now", href: "/booking" },
|
||||
{ label: "Get Quote", href: "/contact" },
|
||||
],
|
||||
},
|
||||
];
|
||||
@@ -92,42 +86,42 @@ export default function HomePage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="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. Expert artists, hypoallergenic paints, custom designs for all occasions."
|
||||
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" },
|
||||
{ text: "View Our Gallery", href: "#gallery" },
|
||||
{ text: "Book Your Event", href: "/booking" },
|
||||
{ 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 showcasing professional face painting services with portfolio images"
|
||||
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"
|
||||
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 w-full sm:w-auto"
|
||||
buttonContainerClassName="flex flex-col sm:flex-row gap-4 mt-8"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" 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 services. 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 across all event types."
|
||||
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"
|
||||
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 painter creating custom artwork designs"
|
||||
imageAlt="Professional face painter creating art"
|
||||
mediaAnimation="blur-reveal"
|
||||
metrics={[
|
||||
{ value: "500+", title: "Happy Events" },
|
||||
@@ -137,18 +131,18 @@ export default function HomePage() {
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
ariaLabel="About section with company information and professional credentials"
|
||||
containerClassName="gap-12"
|
||||
titleClassName="text-3xl sm:text-4xl font-extrabold"
|
||||
ariaLabel="About section with company information"
|
||||
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" 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 Face Painting & Body Art 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. Custom designs available for all service types."
|
||||
tag="Premium 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"
|
||||
textboxLayout="default"
|
||||
@@ -156,8 +150,8 @@ export default function HomePage() {
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "kids-party", title: "Kids Party Face Painting", description: "Fun, colorful designs perfect for birthday celebrations and children's events. Butterflies, superheroes, animals, and princesses crafted with safe, professional-grade products.", 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 - butterflies, animals, and characters"},
|
||||
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" },
|
||||
{ icon: Heart, text: "Safe, child-friendly products" },
|
||||
@@ -166,8 +160,8 @@ 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 for high-volume event entertainment.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1", imageAlt: "Festival face painting artwork showcasing fast, artistic designs"},
|
||||
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" },
|
||||
{ icon: Star, text: "Creative artistic designs" },
|
||||
@@ -176,8 +170,8 @@ export default function HomePage() {
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "corporate", title: "Corporate Event Entertainment", description: "Professional face painting for company parties, brand activations, and team celebrations. Branded designs and custom theming available for corporate clients.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-dj-party-charge-music-entertainment_23-2149658399.jpg?_wi=1", imageAlt: "Corporate event entertainment and professional face painting service"},
|
||||
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" },
|
||||
{ icon: Target, text: "Branded design options available" },
|
||||
@@ -186,18 +180,19 @@ export default function HomePage() {
|
||||
reverse: false,
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Explore All Services", href: "#services" }]}
|
||||
buttons={[{ text: "Explore All Services", href: "/services" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Services section showcasing professional face painting and body art offerings"
|
||||
containerClassName="gap-12"
|
||||
itemClassName="text-3xl sm:text-4xl font-extrabold"
|
||||
ariaLabel="Services section showcasing face painting offerings"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
itemClassName=""
|
||||
mediaWrapperClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="packages" 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 & Pricing"
|
||||
description="Simple, flexible face painting pricing for parties, festivals, and corporate events. Each package includes professional service and artistic creativity. Transparent rates with no hidden fees."
|
||||
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"
|
||||
@@ -206,38 +201,35 @@ export default function HomePage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "birthday-basic", tag: "Popular", tagIcon: Star,
|
||||
price: "$150", period: "per hour", description: "Perfect for small birthday celebrations and intimate events", 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: "/booking" },
|
||||
featuresTitle: "What's Included", features: [
|
||||
"Up to 15 kids", "Colorful themed designs", "Face painting only", "Basic design themes"],
|
||||
},
|
||||
{
|
||||
id: "birthday-deluxe", tag: "Best Value", tagIcon: Heart,
|
||||
price: "$200", period: "per 2 hours", description: "Full party entertainment package with extended coverage", 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: "/booking" },
|
||||
featuresTitle: "What's Included", features: [
|
||||
"Up to 25 kids", "Custom themed designs", "Face & temporary tattoos", "Interactive entertainment"],
|
||||
},
|
||||
{
|
||||
id: "festival-event", tag: "Flexible", tagIcon: Sparkles,
|
||||
price: "$250", period: "per 3 hours", description: "Festival and outdoor event service with high-volume capacity", 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: "/booking" },
|
||||
featuresTitle: "What's Included", features: [
|
||||
"High-capacity crowd service", "Fast artistic designs", "Setup & teardown included", "Portable station"],
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "View All Packages", href: "#packages" }]}
|
||||
buttons={[{ text: "View All Packages", href: "/packages" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Pricing section with face painting package options and rates"
|
||||
containerClassName="gap-12"
|
||||
textBoxTitleClassName="text-3xl sm:text-4xl font-extrabold"
|
||||
textBoxDescriptionClassName="text-base sm:text-lg opacity-90 max-w-3xl"
|
||||
cardClassName="p-6 sm:p-8"
|
||||
ariaLabel="Pricing section with package options"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
cardContentClassName=""
|
||||
planTagClassName=""
|
||||
planPriceClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" 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 face and body art services 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"
|
||||
@@ -247,38 +239,38 @@ export default function HomePage() {
|
||||
carouselMode="buttons"
|
||||
testimonials={[
|
||||
{
|
||||
id: "testimonial-1", name: "Sarah Johnson", role: "Parent, Birthday Party Host", testimonial: "Paintasy was absolutely amazing! The kids loved their face paintings and the artist was so professional and friendly. Our daughter's birthday was unforgettable!", imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=1", imageAlt: "Happy children enjoying professional face painting at birthday party", icon: Heart,
|
||||
id: "testimonial-1", name: "Sarah Johnson", role: "Parent, Birthday Party Host", testimonial: "Paintasy was absolutely amazing! The kids loved their face paintings and the artist was so professional and friendly. Our daughter's birthday was unforgettable!", imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=1", imageAlt: "Happy children at birthday party", icon: Heart,
|
||||
},
|
||||
{
|
||||
id: "testimonial-2", name: "Marcus Chen", role: "Festival Organizer", testimonial: "We hired Paintasy for our community festival and they were fantastic. Quick service, beautiful designs, and the crowd loved it. Booking them again next year!", imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=1", imageAlt: "Festival attendees enjoying professional face painting services", icon: Smile,
|
||||
id: "testimonial-2", name: "Marcus Chen", role: "Festival Organizer", testimonial: "We hired Paintasy for our community festival and they were fantastic. Quick service, beautiful designs, and the crowd loved it. Booking them again next year!", imageSrc: "http://img.b2bpic.net/free-photo/man-covered-different-colors-holi_23-2148337991.jpg?_wi=1", imageAlt: "Festival attendees enjoying face painting", icon: Smile,
|
||||
},
|
||||
{
|
||||
id: "testimonial-3", name: "Emily Rodriguez", role: "Corporate Event Planner", testimonial: "Professional, creative, and reliable. Paintasy added the perfect touch of fun to our corporate team building event. Highly recommended!", imageSrc: "http://img.b2bpic.net/free-photo/group-young-friends-celebrating-new-year_23-2147720468.jpg", imageAlt: "Corporate event attendees enjoying entertainment and face art services", icon: Award,
|
||||
id: "testimonial-3", name: "Emily Rodriguez", role: "Corporate Event Planner", testimonial: "Professional, creative, and reliable. Paintasy added the perfect touch of fun to our corporate team building event. Highly recommended!", imageSrc: "http://img.b2bpic.net/free-photo/group-young-friends-celebrating-new-year_23-2147720468.jpg", imageAlt: "Corporate event attendees with face art", icon: Award,
|
||||
},
|
||||
{
|
||||
id: "testimonial-4", name: "David Kim", role: "School Principal", testimonial: "The face painting station at our school carnival was the highlight! Kids had so much fun, and the artist was fantastic with them. Thank you!", imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=2", imageAlt: "Children enjoying face painting at school carnival event", icon: Sparkles,
|
||||
id: "testimonial-4", name: "David Kim", role: "School Principal", testimonial: "The face painting station at our school carnival was the highlight! Kids had so much fun, and the artist was fantastic with them. Thank you!", imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=2", imageAlt: "Children enjoying school event face painting", icon: Sparkles,
|
||||
},
|
||||
{
|
||||
id: "testimonial-5", name: "Jessica Martinez", role: "Wedding Planner", testimonial: "Added Paintasy as entertainment for a children's wedding reception. The kids were thrilled and parents appreciated the care taken with hygiene and safety.", imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=3", imageAlt: "Professional face painting service at children's wedding event", icon: Heart,
|
||||
id: "testimonial-5", name: "Jessica Martinez", role: "Wedding Planner", testimonial: "Added Paintasy as entertainment for a children's wedding reception. The kids were thrilled and parents appreciated the care taken with hygiene and safety.", imageSrc: "http://img.b2bpic.net/free-photo/family-portrait-surprised-father-has-yellow-face-from-paints-cheerful-two-daughters-shows-palms-dirty-with-watercolours-paint-picture-pastime-isolated-lilac-wall-this-is-art_273609-26128.jpg?_wi=3", imageAlt: "Children's event face painting service", icon: Heart,
|
||||
},
|
||||
{
|
||||
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 and entertainment service", icon: Star,
|
||||
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" }]}
|
||||
buttons={[{ text: "Book Now", href: "/booking" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Client testimonials and reviews section for face painting services"
|
||||
containerClassName="gap-12"
|
||||
textBoxTitleClassName="text-3xl sm:text-4xl font-extrabold"
|
||||
textBoxDescriptionClassName="text-base sm:text-lg opacity-90 max-w-3xl"
|
||||
ariaLabel="Client testimonials section"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
imageWrapperClassName=""
|
||||
roleClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="gallery" 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 & Portfolio"
|
||||
description="Real photos from our professional face painting and body art events. Browse our portfolio of creative designs and happy clients across all event types."
|
||||
tag="Portfolio Showcase"
|
||||
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"
|
||||
textboxLayout="default"
|
||||
@@ -288,26 +280,27 @@ export default function HomePage() {
|
||||
carouselMode="buttons"
|
||||
products={[
|
||||
{
|
||||
id: "gallery-1", name: "Kids Face Painting", price: "Colorful Designs", variant: "Birthday Parties", imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=1", imageAlt: "Collection of professional kids face painting designs and artwork"},
|
||||
id: "gallery-1", name: "Kids Face Painting", price: "Colorful Designs", variant: "Birthday Parties", imageSrc: "http://img.b2bpic.net/free-psd/holi-festival-celebration-instagram-posts_23-2151227255.jpg?_wi=1", imageAlt: "Collection of kids face painting designs"},
|
||||
{
|
||||
id: "gallery-2", name: "Festival Face Art", price: "Creative Artistry", variant: "Outdoor Events", imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1", imageAlt: "Professional festival face painting artwork and artistic designs"},
|
||||
id: "gallery-2", name: "Festival Face Art", price: "Creative Artistry", variant: "Outdoor Events", imageSrc: "http://img.b2bpic.net/free-photo/hand-holding-brush-close-up_23-2148966902.jpg?_wi=1", imageAlt: "Festival face painting artwork"},
|
||||
{
|
||||
id: "gallery-3", name: "Body Painting Art", price: "Professional Service", variant: "Special Events", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=1", imageAlt: "Professional body art photography and creative body painting services"},
|
||||
id: "gallery-3", name: "Body Painting Art", price: "Professional Service", variant: "Special Events", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-women-with-all-kinds-body_23-2149159242.jpg?_wi=1", imageAlt: "Professional body art photography"},
|
||||
{
|
||||
id: "gallery-4", name: "Custom Designs", price: "Personalized Art", variant: "Themed Events", imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1", imageAlt: "Custom themed face painting designs for special events"},
|
||||
id: "gallery-4", name: "Custom Designs", price: "Personalized Art", variant: "Themed Events", imageSrc: "http://img.b2bpic.net/free-photo/fun-portrait-with-decorations-face_23-2150749319.jpg?_wi=1", imageAlt: "Custom themed face painting designs"},
|
||||
]}
|
||||
buttons={[{ text: "View Full Gallery", href: "#gallery" }]}
|
||||
buttons={[{ text: "View Full Gallery", href: "/gallery" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Photo gallery preview section showcasing professional face painting portfolio"
|
||||
containerClassName="gap-12"
|
||||
cardNameClassName="text-3xl sm:text-4xl font-extrabold"
|
||||
ariaLabel="Photo gallery preview section"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
cardNameClassName=""
|
||||
cardPriceClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" 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"
|
||||
description="Everything you need to know about booking Paintasy professional face and body art services for your event."
|
||||
title="Face Painting FAQ - Frequently Asked Questions"
|
||||
description="Everything you need to know about booking Paintasy for your event."
|
||||
tag="FAQ"
|
||||
tagIcon={HelpCircle}
|
||||
tagAnimation="slide-up"
|
||||
@@ -318,57 +311,57 @@ export default function HomePage() {
|
||||
showCard={true}
|
||||
faqs={[
|
||||
{
|
||||
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 face painting services. For large events or peak seasons, 4-6 weeks advance booking is ideal. Last-minute bookings may be available depending on our artist 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 and sensitive skin?", content: "Absolutely! 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 also practice strict hygiene protocols, using clean brushes and sanitized application tools for each client to ensure safety and comfort."},
|
||||
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."},
|
||||
{
|
||||
id: "faq-3", title: "How long does professional face painting take per person?", content: "Simple designs typically take 3-5 minutes, while more detailed or custom face painting designs take 8-12 minutes. At festivals, we optimize for speed without sacrificing quality. For birthday parties and events, we allow a bit more time for custom designs and interactions with children."},
|
||||
id: "faq-3", title: "How long does face painting take per person?", content: "Simple designs typically take 3-5 minutes, while more detailed or custom designs take 8-12 minutes. At festivals, we optimize for speed without sacrificing quality. For parties, we allow a bit more time for custom designs and interactions with children."},
|
||||
{
|
||||
id: "faq-4", title: "What if someone has a skin allergy to face paint?", content: "We have hypoallergenic face painting options available for sensitive skin. Please inform us of any allergies when booking your event. We're always happy to discuss alternative products or perform test patches before proceeding with full face painting service."},
|
||||
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 create custom face painting designs for themed events?", content: "Yes! We specialize in custom face painting designs for themed parties and corporate events. Please provide theme details or reference images when booking your face painting service. 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 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 in your event package."},
|
||||
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" }]}
|
||||
buttons={[{ text: "Book Your Event", href: "/booking" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="FAQ section with common questions about face painting services"
|
||||
containerClassName="gap-12"
|
||||
textBoxTitleClassName="text-3xl sm:text-4xl font-extrabold"
|
||||
textBoxDescriptionClassName="text-base sm:text-lg opacity-90 max-w-3xl"
|
||||
ariaLabel="FAQ section with common questions"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
accordionClassName=""
|
||||
accordionTitleClassName=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" 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. We'd love to discuss your event and create an unforgettable experience for your guests with professional face painting and body art services."
|
||||
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}
|
||||
buttons={[
|
||||
{ text: "Request a Quote", href: "#contact" },
|
||||
{ text: "Request a Quote", href: "/contact" },
|
||||
{ text: "Call Us", href: "tel:+15551234567" },
|
||||
]}
|
||||
ariaLabel="Contact call-to-action section for booking face painting services"
|
||||
containerClassName="py-12 sm:py-16"
|
||||
ariaLabel="Contact call-to-action section"
|
||||
containerClassName="py-12 sm:py-16 lg:py-20"
|
||||
contentClassName="max-w-3xl mx-auto"
|
||||
textClassName="text-3xl sm:text-4xl font-extrabold text-center"
|
||||
buttonContainerClassName="flex flex-col sm:flex-row gap-4 justify-center mt-8 w-full sm:w-auto"
|
||||
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" 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 navigation links and contact information"
|
||||
containerClassName="gap-12"
|
||||
columnsClassName="grid-cols-2 lg:grid-cols-4 gap-6 sm:gap-8"
|
||||
columnTitleClassName="font-extrabold text-lg text-sm sm:text-base lg:text-lg"
|
||||
columnItemClassName="text-sm sm:text-base hover:opacity-70 transition-opacity"
|
||||
ariaLabel="Site footer with links"
|
||||
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"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -4,19 +4,19 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
||||
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import { Sparkles, Palette, Heart, Smile, Zap, Star, Music, Target, Users, Briefcase, HelpCircle, DollarSign } from 'lucide-react';
|
||||
import { Sparkles, Palette, Heart, Smile, Zap, Music, Briefcase, Target, Users, Star, DollarSign } from 'lucide-react';
|
||||
|
||||
export default function ServicesPage() {
|
||||
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" },
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Gallery", id: "/gallery" },
|
||||
{ name: "Packages", id: "/packages" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
@@ -31,10 +31,10 @@ export default function ServicesPage() {
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/" },
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
{ label: "Packages", href: "/packages" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "FAQ", href: "/" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
@@ -79,38 +79,38 @@ 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 lg:px-8">
|
||||
<HeroBillboardGallery
|
||||
title="Our Professional Services"
|
||||
description="Discover the full range of creative face painting and body art services Paintasy offers. From intimate birthday celebrations to large-scale festival entertainment, we bring artistry, professionalism, and joy to every event."
|
||||
title="Professional Face Painting & Body Art Services"
|
||||
description="Paintasy offers comprehensive face painting and body art services for every occasion. From intimate birthday parties to large-scale festivals, our professional artists bring creativity, color, and joy to your event."
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Creative Entertainment"
|
||||
tag="All Services"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{ text: "Book Your Event", href: "/packages" },
|
||||
{ text: "View Packages", href: "/packages" },
|
||||
{ text: "Browse Services", href: "#services-list" },
|
||||
{ text: "Get a Quote", href: "/contact" },
|
||||
]}
|
||||
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 service showcase"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/rainbow-face-paint-art_23-2148621847.jpg?_wi=2", imageAlt: "Vibrant face painting services showcase"},
|
||||
]}
|
||||
mediaAnimation="opacity"
|
||||
ariaLabel="Services 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"
|
||||
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="services-detail" data-section="services-detail" className="mx-auto px-4 md:px-6">
|
||||
<div id="services-list" data-section="services-list" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
|
||||
<FeatureCardTen
|
||||
title="Complete Service Menu"
|
||||
description="Professional face painting and body art services tailored for every occasion and event type."
|
||||
tag="Services Offered"
|
||||
title="Our Complete Service Menu"
|
||||
description="Choose from our range of professional face and body art services, each designed for specific occasions and clientele."
|
||||
tag="Services"
|
||||
tagIcon={Palette}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -118,104 +118,132 @@ export default function ServicesPage() {
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
id: "kids-party", title: "Kids Party Face Painting", description: "Fun and colorful face painting designs perfect for birthday celebrations, school events, and children's parties. Our artists specialize in creating magical moments for young guests with playful, age-appropriate designs.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-eyes-woman-smiling-festival_23-2148338055.jpg?_wi=1", imageAlt: "Kids party face painting designs"},
|
||||
id: "kids-party", title: "Kids Party Face Painting", description: "Fun, safe, and colorful face painting designs perfect for children's birthday parties. From butterflies and animals to superheroes and princesses, we create magical moments for kids. All paints are hypoallergenic and dermatologist-tested.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/child-with-colorful-face-paint_23-2148412356.jpg?_wi=1", imageAlt: "Kids enjoying colorful face painting"},
|
||||
items: [
|
||||
{ icon: Sparkles, text: "Colorful & playful designs" },
|
||||
{ icon: Heart, text: "Safe, child-friendly products" },
|
||||
{ icon: Smile, text: "Quick turnaround per child" },
|
||||
{ icon: Heart, text: "Child-safe products" },
|
||||
{ icon: Smile, text: "Quick, fun designs" },
|
||||
{ icon: Sparkles, text: "Memorable moments" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
id: "festival", title: "Festival Face Art", description: "Fast, creative, and impressive face painting designs perfect for large crowds and outdoor festival settings. We combine artistic flair with efficient service to keep lines moving while maintaining quality.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-putting-makeup-man_23-2149357796.jpg?_wi=1", imageAlt: "Festival face painting artwork"},
|
||||
id: "festival", title: "Festival & Event Face Art", description: "Fast, impressive designs for large outdoor events, music festivals, and community gatherings. Our artists excel at high-volume service without compromising quality, perfect for busy festival environments.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/festival-face-painting-crowd_23-2148723145.jpg?_wi=1", imageAlt: "Festival attendees with artistic face painting"},
|
||||
items: [
|
||||
{ icon: Zap, text: "Fast service for crowds" },
|
||||
{ icon: Star, text: "Creative artistic designs" },
|
||||
{ icon: Music, text: "Perfect for music & outdoor events" },
|
||||
{ icon: Zap, text: "High-volume service" },
|
||||
{ icon: Star, text: "Professional designs" },
|
||||
{ icon: Music, text: "Event-perfect timing" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "corporate", title: "Corporate Event Entertainment", description: "Professional face painting services for company parties, brand activations, team building events, and corporate celebrations. We deliver polished service with optional 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"},
|
||||
id: "corporate", title: "Corporate Event Entertainment", description: "Professional face painting for company parties, brand activations, team-building events, and corporate celebrations. We offer branded design options and maintain a polished, professional demeanor throughout.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/corporate-event-entertainment_23-2148945632.jpg?_wi=1", imageAlt: "Professional corporate event entertainment"},
|
||||
items: [
|
||||
{ icon: Briefcase, text: "Professional & polished service" },
|
||||
{ icon: Target, text: "Branded design options available" },
|
||||
{ icon: Users, text: "Great for team building" },
|
||||
{ icon: Briefcase, text: "Professional service" },
|
||||
{ icon: Target, text: "Branded options" },
|
||||
{ icon: Users, text: "Team building" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Request a Quote", href: "/contact" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Detailed services section"
|
||||
containerClassName="gap-12"
|
||||
itemClassName="text-4xl font-extrabold"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq-services" data-section="faq-services" className="mx-auto px-4 md:px-6">
|
||||
<FaqBase
|
||||
title="Services FAQ"
|
||||
description="Common questions about our face painting and body art services."
|
||||
tag="FAQ"
|
||||
tagIcon={HelpCircle}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
animationType="smooth"
|
||||
faqsAnimation="slide-up"
|
||||
useInvertedBackground={true}
|
||||
showCard={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "faq-1", title: "Do you offer custom design services?", content: "Yes! We specialize in custom face painting designs tailored to your event theme. Whether it's character designs, themed art, or branded elements for corporate events, our artists can create exactly what you envision. Please provide theme details or reference images when booking for best results."},
|
||||
id: "body-art", title: "Body Painting & Art", description: "Stunning full-body art and temporary body painting for special events, themed parties, photo shoots, and artistic projects. Our body painting artists create wearable masterpieces that turn heads.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/body-art-painting_23-2149156247.jpg?_wi=1", imageAlt: "Professional body art and painting"},
|
||||
items: [
|
||||
{ icon: Sparkles, text: "Artistic mastery" },
|
||||
{ icon: Heart, text: "Creative designs" },
|
||||
{ icon: Star, text: "Photo-worthy art" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "faq-2", title: "What's the difference between kids party and festival face painting?", content: "Kids party face painting focuses on intricate, detailed designs with character themes and personal interaction with each child. Festival face painting emphasizes speed and crowd management while maintaining artistic quality. Festival designs are typically simpler but equally impressive, allowing us to serve more people in the same timeframe."},
|
||||
id: "custom", title: "Custom & Themed Designs", description: "Create personalized face art tailored to your event's theme. Provide us with inspiration and we'll bring your vision to life with custom designs. Perfect for themed parties, cosplay events, and special celebrations.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/custom-themed-face-art_23-2149267841.jpg?_wi=1", imageAlt: "Creative custom themed face designs"},
|
||||
items: [
|
||||
{ icon: Target, text: "Custom designs" },
|
||||
{ icon: Palette, text: "Theme-based art" },
|
||||
{ icon: Sparkles, text: "Personalized service" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
id: "faq-3", title: "Are your products hypoallergenic?", content: "We use only professional-grade, hypoallergenic face paints that are non-toxic and dermatologist-tested. All products are safe for sensitive skin. If you have known allergies, please inform us when booking so we can prepare appropriate alternatives or conduct a patch test."},
|
||||
{
|
||||
id: "faq-4", title: "Can you do body painting in addition to face painting?", content: "Absolutely! We offer professional body painting services for themed events, corporate activations, and special occasions. Body painting takes longer than face painting, so we recommend discussing specific design and time requirements when booking."},
|
||||
{
|
||||
id: "faq-5", title: "What's your turnaround time per person?", content: "Simple face designs typically take 3-5 minutes, while detailed or custom designs take 8-12 minutes. At festivals, we optimize for speed. For party settings, we allow more time for interactions and personalized designs. We always prioritize quality over rushing."},
|
||||
{
|
||||
id: "faq-6", title: "How much setup time do you need?", content: "Typically, we require 15-30 minutes for setup before service begins. This includes setting up our portable stations, organizing supplies, and ensuring proper sanitation protocols are in place. The exact time depends on the venue and event specifics."},
|
||||
id: "tattoo", title: "Temporary Tattoos & Accessories", description: "Complement face painting with safe, temporary tattoos and artistic body accessories. Great for adding extra flair to any face painting design or standalone service.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/temporary-tattoo-design_23-2149156325.jpg?_wi=1", imageAlt: "Colorful temporary tattoo designs"},
|
||||
items: [
|
||||
{ icon: Heart, text: "Safe temporary tattoos" },
|
||||
{ icon: Zap, text: "Quick application" },
|
||||
{ icon: Smile, text: "Extra style" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Book Your Service", href: "/packages" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Services FAQ section"
|
||||
containerClassName="gap-12"
|
||||
textBoxTitleClassName="text-4xl font-extrabold"
|
||||
textBoxDescriptionClassName="text-lg opacity-90 max-w-3xl"
|
||||
ariaLabel="Services list with detailed descriptions"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact-services" data-section="contact-services" className="mx-auto px-4 md:px-6">
|
||||
<div id="services-pricing" data-section="services-pricing" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
|
||||
<PricingCardFive
|
||||
title="Service Packages & Pricing"
|
||||
description="Transparent, flexible pricing for all our face painting services. Choose the package that fits your event size and needs."
|
||||
tag="Pricing"
|
||||
tagIcon={DollarSign}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
animationType="scale-rotate"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "starter", tag: "Entry Level", price: "$100", period: "per hour", description: "Perfect for small gatherings and short events", button: { text: "Inquire", href: "/contact" },
|
||||
featuresTitle: "Included", features: [
|
||||
"Up to 10 people", "Standard designs", "Face painting only", "Portable setup"],
|
||||
},
|
||||
{
|
||||
id: "professional", tag: "Most Popular", price: "$200", period: "per 2 hours", description: "Ideal for birthday parties and medium events", button: { text: "Book Now", href: "/packages" },
|
||||
featuresTitle: "Included", features: [
|
||||
"Up to 25 people", "Custom designs", "Face & temporary tattoos", "Professional setup"],
|
||||
},
|
||||
{
|
||||
id: "premium", tag: "Best Value", price: "$400", period: "per 4 hours", description: "Comprehensive service for large events", button: { text: "Request Quote", href: "/contact" },
|
||||
featuresTitle: "Included", features: [
|
||||
"Unlimited guests", "Premium designs", "Face, body art & tattoos", "Setup & teardown"],
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "View All Packages", href: "/packages" }]}
|
||||
buttonAnimation="blur-reveal"
|
||||
ariaLabel="Service pricing and packages"
|
||||
containerClassName="gap-8 lg:gap-12"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services-cta" data-section="services-cta" className="mx-auto px-4 md:px-6 lg:px-8 py-16 md:py-24">
|
||||
<ContactText
|
||||
text="Interested in booking one of our services? Let's discuss your event requirements and create a customized solution. Contact Paintasy today to bring professional face and body art to your celebration."
|
||||
text="Ready to bring creative entertainment to your event? Contact Paintasy today to discuss your service needs, get personalized recommendations, and book your professional face painters."
|
||||
animationType="background-highlight"
|
||||
background={{ variant: "radial-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{ text: "Request a Quote", href: "/contact" },
|
||||
{ text: "Call Us", href: "tel:+15551234567" },
|
||||
{ text: "Call Now", href: "tel:+15551234567" },
|
||||
]}
|
||||
ariaLabel="Services contact call-to-action section"
|
||||
containerClassName="py-16"
|
||||
ariaLabel="Services call-to-action"
|
||||
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-services" data-section="footer-services" className="mx-auto px-4 md:px-6">
|
||||
<div id="footer-services" data-section="footer-services" 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"
|
||||
|
||||
Reference in New Issue
Block a user