Update src/app/page.tsx
This commit is contained in:
@@ -32,40 +32,40 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Головна", id: "hero" },
|
||||
{ name: "Про нас", id: "about" },
|
||||
{ name: "Послуги", id: "features" },
|
||||
{ name: "Ціни", id: "pricing" },
|
||||
{ name: "Відгуки", id: "testimonials" },
|
||||
{ name: "Контакти", id: "contact" }
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="Барбер у дома"
|
||||
brandName="Home Barber"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
title="Барбер у вас вдома — стиль без зайвих зусиль"
|
||||
description="Професійні стрижки та догляд за бородою від майстрів преміум-рівня прямо у вас вдома. Економте свій час, не втрачаючи якості."
|
||||
title="Barber at Your Doorstep — Effortless Style"
|
||||
description="Premium haircuts and beard grooming delivered directly to your home. Save time without compromising on quality."
|
||||
background={{ variant: "glowing-orb" }}
|
||||
kpis={[
|
||||
{ value: "30+", label: "Майстрів" },
|
||||
{ value: "5000+", label: "Клієнтів" },
|
||||
{ value: "4.9", label: "Рейтинг" }
|
||||
{ value: "30+", label: "Stylists" },
|
||||
{ value: "5000+", label: "Clients" },
|
||||
{ value: "4.9", label: "Rating" }
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[{ text: "Забронювати виїзд", href: "#contact" }, { text: "Переглянути ціни", href: "#pricing" }]}
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }, { text: "View Pricing", href: "#pricing" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg?_wi=2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
title="Ми змінюємо ваш підхід до догляду"
|
||||
title="Redefining Your Grooming Routine"
|
||||
metrics={[
|
||||
{ icon: Clock, label: "Час", value: "Виїзд 24/7" },
|
||||
{ icon: CheckCircle, label: "Якість", value: "Преміум інструменти" },
|
||||
{ icon: MapPin, label: "Локація", value: "Весь Київ" }
|
||||
{ icon: Clock, label: "Time", value: "Available 24/7" },
|
||||
{ icon: CheckCircle, label: "Quality", value: "Premium Tools" },
|
||||
{ icon: MapPin, label: "Coverage", value: "Kyiv Citywide" }
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
@@ -74,54 +74,54 @@ export default function LandingPage() {
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardSix
|
||||
title="Чому обирають нас"
|
||||
description="Ми робимо професійний догляд доступним у будь-який час та в будь-якому місці."
|
||||
title="Why Choose Us"
|
||||
description="We make professional grooming accessible whenever and wherever you need it."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Економія часу", description: "Ми приїжджаємо до вас у зручний час, щоб ви не стояли в заторах та чергах.", imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-hair-client_23-2147778736.jpg?_wi=2" },
|
||||
{ title: "Стерильність", description: "Кожен інструмент проходить повну дезінфекцію перед кожним клієнтом.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18491.jpg?_wi=2" },
|
||||
{ title: "Індивідуальний підхід", description: "Майстри проконсультують та підберуть стрижку, що ідеально личитиме вашому обличчю.", imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4435.jpg?_wi=2" }
|
||||
{ title: "Save Time", description: "We come to you on your schedule, so you never have to worry about traffic or waiting in lines.", imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-hair-client_23-2147778736.jpg?_wi=2" },
|
||||
{ title: "Sterile Environment", description: "Every tool is thoroughly sanitized and disinfected before every client session.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18491.jpg?_wi=2" },
|
||||
{ title: "Personalized Service", description: "Our stylists provide expert consultations to find the style that fits your face shape perfectly.", imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4435.jpg?_wi=2" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardFive
|
||||
title="Наші послуги"
|
||||
description="Оберіть пакет послуг, який найкраще відповідає вашим потребам."
|
||||
title="Our Services"
|
||||
description="Choose the service package that best suits your needs."
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{ id: "basic", tag: "Популярно", price: "600 ₴", period: "за сеанс", description: "Базова стрижка з миттям голови та укладкою.", button: { text: "Обрати" }, featuresTitle: "Що входить:", features: ["Мийка голови", "Стрижка", "Стильна укладка"] },
|
||||
{ id: "pro", tag: "Рекомендуємо", price: "950 ₴", period: "за сеанс", description: "Комплексний догляд за стрижкою та бородою.", button: { text: "Обрати" }, featuresTitle: "Що входить:", features: ["Стрижка", "Моделювання бороди", "Укладка", "Фінішні засоби"] }
|
||||
{ id: "basic", tag: "Popular", price: "600 ₴", period: "per session", description: "Basic haircut with hair wash and styling.", button: { text: "Choose" }, featuresTitle: "Includes:", features: ["Hair Wash", "Haircut", "Styling"] },
|
||||
{ id: "pro", tag: "Recommended", price: "950 ₴", period: "per session", description: "Comprehensive care for your hair and beard.", button: { text: "Choose" }, featuresTitle: "Includes:", features: ["Haircut", "Beard Modeling", "Styling", "Finishing Products"] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
cardTitle="Відгуки наших клієнтів"
|
||||
cardTag="Відгуки"
|
||||
cardTitle="What Our Clients Say"
|
||||
cardTag="Reviews"
|
||||
cardAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Андрій", imageSrc: "http://img.b2bpic.net/free-photo/young-man-smiling_23-2147624592.jpg" },
|
||||
{ id: "2", name: "Олег", imageSrc: "http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18491.jpg" },
|
||||
{ id: "3", name: "Максим", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-man-barbershop_23-2148506245.jpg" }
|
||||
{ id: "1", name: "Andriy", imageSrc: "http://img.b2bpic.net/free-photo/young-man-smiling_23-2147624592.jpg" },
|
||||
{ id: "2", name: "Oleg", imageSrc: "http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18491.jpg" },
|
||||
{ id: "3", name: "Maksym", imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-man-barbershop_23-2148506245.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
title="Довіра клієнтів"
|
||||
tag="Показники"
|
||||
title="Client Trust"
|
||||
tag="Our Success"
|
||||
metrics={[
|
||||
{ id: "1", value: "500+", description: "Позитивних відгуків" },
|
||||
{ id: "2", value: "98%", description: "Повторних звернень" },
|
||||
{ id: "3", value: "1000+", description: "Стрижок у місяць" }
|
||||
{ id: "1", value: "500+", description: "Positive Reviews" },
|
||||
{ id: "2", value: "98%", description: "Client Retention" },
|
||||
{ id: "3", value: "1000+", description: "Monthly Haircuts" }
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
@@ -130,25 +130,25 @@ export default function LandingPage() {
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
sideTitle="Часті питання"
|
||||
sideDescription="Знайдіть відповіді на найпопулярніші запитання про наші послуги виїзного барбера."
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideDescription="Find answers to common questions about our mobile barber services."
|
||||
faqsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "1", title: "Чи потрібне спеціальне місце?", content: "Ми привозимо своє крісло, світло та дзеркало. Вам потрібно лише 2 кв.м простору." },
|
||||
{ id: "2", title: "Чи виїжджаєте за межі міста?", content: "Так, обговорюємо індивідуально з кожним клієнтом." },
|
||||
{ id: "3", title: "Які методи оплати?", content: "Готівка або переказ на карту після завершення послуги." }
|
||||
{ id: "1", title: "Do I need a special place?", content: "We bring our own chair, lighting, and mirror. You only need about 2 square meters of space." },
|
||||
{ id: "2", title: "Do you travel outside the city?", content: "Yes, we discuss this individually with each client." },
|
||||
{ id: "3", title: "What are the payment methods?", content: "Cash or bank card transfer after the service is complete." }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
title="Забронюйте свій візит"
|
||||
description="Залиште свої дані, і наш менеджер зв'яжеться з вами протягом 10 хвилин для уточнення деталей."
|
||||
title="Book Your Visit"
|
||||
description="Leave your details, and our manager will contact you within 10 minutes to finalize your booking."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Ваше ім'я" },
|
||||
{ name: "phone", type: "tel", placeholder: "Номер телефону" }
|
||||
{ name: "name", type: "text", placeholder: "Your Name" },
|
||||
{ name: "phone", type: "tel", placeholder: "Phone Number" }
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18491.jpg?_wi=2"
|
||||
@@ -157,14 +157,14 @@ export default function LandingPage() {
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Барбер у дома"
|
||||
logoText="Home Barber"
|
||||
columns={[
|
||||
{ title: "Навігація", items: [{ label: "Головна", href: "#hero" }, { label: "Про нас", href: "#about" }] },
|
||||
{ title: "Контакти", items: [{ label: "Бронювання", href: "#contact" }, { label: "Telegram", href: "#" }] }
|
||||
{ title: "Navigation", items: [{ label: "Home", href: "#hero" }, { label: "About", href: "#about" }] },
|
||||
{ title: "Contacts", items: [{ label: "Booking", href: "#contact" }, { label: "Telegram", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user