bender/f61be1db-087b-49aa-92e0-b316014a5f6e
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-12 15:57:09 +00:00
parent 8c0417938b
commit 151b1f46f2
1 changed files with 46 additions and 289 deletions
Download Patch File Download Diff File Expand all files Collapse all files

335
src/app/page.tsx
View File

@@ -32,22 +32,12 @@ export default function LandingPage() {
<div id="nav" data-section="nav"> <div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay <NavbarLayoutFloatingOverlay
navItems={[ navItems={[
{ { name: "Головна", id: "hero" },
name: "Головна", { name: "Про нас", id: "about" },
id: "hero", { name: "Послуги", id: "features" },
}, { name: "Ціни", id: "pricing" },
{ { name: "Відгуки", id: "testimonials" },
name: "Про нас", { name: "Контакти", id: "contact" }
id: "about",
},
{
name: "Послуги",
id: "features",
},
{
name: "Ціни",
id: "pricing",
},
]} ]}
brandName="Барбер у дома" brandName="Барбер у дома"
/> />
@@ -56,97 +46,30 @@ export default function LandingPage() {
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboardTestimonial <HeroBillboardTestimonial
useInvertedBackground={false} useInvertedBackground={false}
background={{ background={{ variant: "gradient-bars" }}
variant: "gradient-bars",
}}
title="Професійний барбер у вас вдома" title="Професійний барбер у вас вдома"
description="Отримайте ідеальну стрижку та догляд за бородою без зайвого часу на дорогу. Наш мобільний сервіс приїде до вас у зручний час." description="Отримайте ідеальну стрижку та догляд за бородою без зайвого часу на дорогу. Наш мобільний сервіс приїде до вас у зручний час."
testimonials={[ testimonials={[
{ { name: "Олександр", handle: "@alex", testimonial: "Це найкращий сервіс! Стрижуть якісно і не треба нікуди їхати.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg", imageAlt: "barber mobile grooming service" },
name: "Олександр", { name: "Дмитро", handle: "@dmitro", testimonial: "Професійно, швидко і дуже зручно. Рекомендую всім друзям.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg", imageAlt: "barber mobile grooming service" },
handle: "@alex", { name: "Іван", handle: "@ivan", testimonial: "Ідеальна стрижка у власній вітальні.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-hair-client_23-2147778736.jpg", imageAlt: "barber mobile grooming service" },
testimonial: "Це найкращий сервіс! Стрижуть якісно і не треба нікуди їхати.", { name: "Микола", handle: "@nikola", testimonial: "Сервіс на 10 з 10!", rating: 5, 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", imageAlt: "barber mobile grooming service" },
rating: 5, { name: "Тарас", handle: "@taras", testimonial: "Нарешті не треба стояти в чергах.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4435.jpg", imageAlt: "barber mobile grooming service" }
imageSrc: "http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg?_wi=1",
imageAlt: "barber mobile grooming service",
},
{
name: "Дмитро",
handle: "@dmitro",
testimonial: "Професійно, швидко і дуже зручно. Рекомендую всім друзям.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg?_wi=1",
imageAlt: "barber mobile grooming service",
},
{
name: "Іван",
handle: "@ivan",
testimonial: "Ідеальна стрижка у власній вітальні.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-hair-client_23-2147778736.jpg?_wi=1",
imageAlt: "barber mobile grooming service",
},
{
name: "Микола",
handle: "@nikola",
testimonial: "Сервіс на 10 з 10!",
rating: 5,
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=1",
imageAlt: "barber mobile grooming service",
},
{
name: "Тарас",
handle: "@taras",
testimonial: "Нарешті не треба стояти в чергах.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4435.jpg?_wi=1",
imageAlt: "barber mobile grooming service",
},
]} ]}
imageSrc="http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg?_wi=2" imageSrc="http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg"
avatars={[ avatars={[
{ { src: "http://img.b2bpic.net/free-photo/low-angle-costumer-barber-shop-looking-phone-with-copy-space_23-2148242843.jpg", alt: "Client 1" },
src: "http://img.b2bpic.net/free-photo/low-angle-costumer-barber-shop-looking-phone-with-copy-space_23-2148242843.jpg", { src: "http://img.b2bpic.net/free-photo/annoyed-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-holding-looking-straight-razor-with-shaving-cream-put-his-face-keeping-hand-air_141793-98626.jpg", alt: "Client 2" },
alt: "Client 1", { src: "http://img.b2bpic.net/free-photo/frowning-young-afro-american-male-barber-wearing-uniform-holding-barber-tools-looking-pointing-camera-with-comb_141793-117222.jpg", alt: "Client 3" },
}, { src: "http://img.b2bpic.net/free-photo/attractive-barber-shaving-hair-client_23-2147778750.jpg", alt: "Client 4" },
{ { src: "http://img.b2bpic.net/free-photo/stylist-cutting-beard-faceless-client_23-2147778868.jpg", alt: "Client 5" }
src: "http://img.b2bpic.net/free-photo/annoyed-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-holding-looking-straight-razor-with-shaving-cream-put-his-face-keeping-hand-air_141793-98626.jpg",
alt: "Client 2",
},
{
src: "http://img.b2bpic.net/free-photo/frowning-young-afro-american-male-barber-wearing-uniform-holding-barber-tools-looking-pointing-camera-with-comb_141793-117222.jpg",
alt: "Client 3",
},
{
src: "http://img.b2bpic.net/free-photo/attractive-barber-shaving-hair-client_23-2147778750.jpg",
alt: "Client 4",
},
{
src: "http://img.b2bpic.net/free-photo/stylist-cutting-beard-faceless-client_23-2147778868.jpg",
alt: "Client 5",
},
]} ]}
marqueeItems={[ marqueeItems={[
{ { type: "text", text: "Тільки професійні майстри" },
type: "text", { type: "text", text: "Стерильне обладнання" },
text: "Тільки професійні майстри", { type: "text", text: "Зручний запис онлайн" },
}, { type: "text", text: "Виїзд по всьому місту" },
{ { type: "text", text: "Якість преміум-рівня" }
type: "text",
text: "Стерильне обладнання",
},
{
type: "text",
text: "Зручний запис онлайн",
},
{
type: "text",
text: "Виїзд по всьому місту",
},
{
type: "text",
text: "Якість преміум-рівня",
},
]} ]}
/> />
</div> </div>
@@ -156,7 +79,7 @@ export default function LandingPage() {
useInvertedBackground={false} useInvertedBackground={false}
title="Хто ми?" title="Хто ми?"
description="Ми — команда професійних барберів, що цінують ваш час. Наша мета — надати якісний сервіс рівня найкращих барбершопів прямо у вашому домі, офісі чи будь-якій зручній для вас локації." description="Ми — команда професійних барберів, що цінують ваш час. Наша мета — надати якісний сервіс рівня найкращих барбершопів прямо у вашому домі, офісі чи будь-якій зручній для вас локації."
imageSrc="http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg?_wi=2" imageSrc="http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg"
/> />
</div> </div>
@@ -165,31 +88,11 @@ export default function LandingPage() {
textboxLayout="split" textboxLayout="split"
useInvertedBackground={false} useInvertedBackground={false}
features={[ features={[
{ { title: "Економія часу", description: "Ми приїжджаємо до вас у зручний час.", imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-hair-client_23-2147778736.jpg" },
title: "Економія часу", { 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" },
description: "Ми приїжджаємо до вас у зручний час.", { title: "Висока якість", description: "Досвідчені майстри з професійним підходом.", imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4435.jpg" },
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/hairdresser-styling-hair-man_23-2147778737.jpg" },
}, { title: "Індивідуальний стиль", description: "Підбір стрижки під ваші риси обличчя.", imageSrc: "http://img.b2bpic.net/free-photo/trendy-haircut-barbershop_1163-2011.jpg" }
{
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: "Зручний запис",
description: "Вибирайте зручний слот в один клік.",
imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-styling-hair-man_23-2147778737.jpg",
},
{
title: "Індивідуальний стиль",
description: "Підбір стрижки під ваші риси обличчя.",
imageSrc: "http://img.b2bpic.net/free-photo/trendy-haircut-barbershop_1163-2011.jpg",
},
]} ]}
title="Наші переваги" title="Наші переваги"
description="Комфорт та якість у кожній деталі." description="Комфорт та якість у кожній деталі."
@@ -202,54 +105,9 @@ export default function LandingPage() {
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
plans={[ plans={[
{ { id: "1", title: "Стрижка", price: "600 ₴", period: "одна процедура", features: ["Мило голови", "Стрижка", "Укладка"], button: { text: "Забронювати" }, imageSrc: "http://img.b2bpic.net/free-photo/cute-little-child-is-getting-trendy-haircut-from-barber-busy-barbershop_613910-20834.jpg" },
id: "1", { id: "2", title: "Стрижка + Борода", price: "900 ₴", period: "одна процедура", features: ["Стрижка", "Догляд за бородою", "Укладка"], button: { text: "Забронювати" }, imageSrc: "http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg" },
title: "Стрижка", { id: "3", title: "Королівське гоління", price: "500 ₴", period: "одна процедура", features: ["Гарячий рушник", "Гоління", "Догляд"], button: { text: "Забронювати" }, imageSrc: "http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg" }
price: "600 ₴",
period: "одна процедура",
features: [
"Мило голови",
"Стрижка",
"Укладка",
],
button: {
text: "Забронювати",
},
imageSrc: "http://img.b2bpic.net/free-photo/cute-little-child-is-getting-trendy-haircut-from-barber-busy-barbershop_613910-20834.jpg",
imageAlt: "Cute little child is getting trendy haircut from barber at busy barbershop.",
},
{
id: "2",
title: "Стрижка + Борода",
price: "900 ₴",
period: "одна процедура",
features: [
"Стрижка",
"Догляд за бородою",
"Укладка",
],
button: {
text: "Забронювати",
},
imageSrc: "http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg?_wi=3",
imageAlt: "Cute little child is getting trendy haircut from barber at busy barbershop.",
},
{
id: "3",
title: "Королівське гоління",
price: "500 ₴",
period: "одна процедура",
features: [
"Гарячий рушник",
"Гоління",
"Догляд",
],
button: {
text: "Забронювати",
},
imageSrc: "http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg?_wi=3",
imageAlt: "Cute little child is getting trendy haircut from barber at busy barbershop.",
},
]} ]}
title="Ціни на послуги" title="Ціни на послуги"
description="Прозорі ціни без прихованих платежів." description="Прозорі ціни без прихованих платежів."
@@ -261,56 +119,11 @@ export default function LandingPage() {
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
testimonials={[ testimonials={[
{ { id: "1", name: "Сергій", date: "12.01.2024", title: "Чудово", quote: "Дуже зручно, майстер приїхав вчасно і зробив все професійно.", tag: "Клієнт", avatarSrc: "http://img.b2bpic.net/free-photo/young-man-smiling_23-2147624592.jpg", imageSrc: "http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg", imageAlt: "happy client man haircutting" },
id: "1", { id: "2", name: "Ігор", date: "10.01.2024", title: "Клас", quote: "Стрижка на рівні, навіть краще ніж у салоні.", tag: "Клієнт", avatarSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg", imageSrc: "http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg", imageAlt: "happy client man haircutting" },
name: "Сергій", { id: "3", name: "Максим", date: "05.01.2024", title: "Супер", quote: "Дякую, буду звертатися ще!", tag: "Клієнт", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-getting-her-hair-dyed-by-hairdresser-home_23-2148817234.jpg", imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-hair-client_23-2147778736.jpg", imageAlt: "happy client man haircutting" },
date: "12.01.2024", { id: "4", name: "Олег", date: "02.01.2024", title: "Чудовий сервіс", quote: "Найкращий варіант для зайнятих людей.", tag: "Клієнт", avatarSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205928.jpg", 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", imageAlt: "happy client man haircutting" },
title: "Чудово", { id: "5", name: "Андрій", date: "28.12.2023", title: "Рекомендую", quote: "Все на висоті, щиро раджу.", tag: "Клієнт", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-view-man-barbershop_23-2148506245.jpg", imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4435.jpg", imageAlt: "happy client man haircutting" }
quote: "Дуже зручно, майстер приїхав вчасно і зробив все професійно.",
avatarSrc: "http://img.b2bpic.net/free-photo/young-man-smiling_23-2147624592.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/confused-young-handsome-male-barber-uniform-holding-hair-clippers-spread-hand_141793-81553.jpg?_wi=4",
imageAlt: "happy client man haircutting",
},
{
id: "2",
name: "Ігор",
date: "10.01.2024",
title: "Клас",
quote: "Стрижка на рівні, навіть краще ніж у салоні.",
avatarSrc: "http://img.b2bpic.net/free-photo/smiling-young-handsome-male-barber-uniform-holding-out-straight-razor-camera-isolated-blue_141793-73815.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/funny-little-boy-is-getting-trendy-haircut-from-expirienced-barber-fashionable-hairdressing-salon-firs-time_613910-21469.jpg?_wi=4",
imageAlt: "happy client man haircutting",
},
{
id: "3",
name: "Максим",
date: "05.01.2024",
title: "Супер",
quote: "Дякую, буду звертатися ще!",
avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-getting-her-hair-dyed-by-hairdresser-home_23-2148817234.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/barber-styling-hair-client_23-2147778736.jpg?_wi=3",
imageAlt: "happy client man haircutting",
},
{
id: "4",
name: "Олег",
date: "02.01.2024",
title: "Чудовий сервіс",
quote: "Найкращий варіант для зайнятих людей.",
avatarSrc: "http://img.b2bpic.net/free-photo/hairdresser-grooming-their-client_23-2149205928.jpg",
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=3",
imageAlt: "happy client man haircutting",
},
{
id: "5",
name: "Андрій",
date: "28.12.2023",
title: "Рекомендую",
quote: "Все на висоті, щиро раджу.",
avatarSrc: "http://img.b2bpic.net/free-photo/close-up-view-man-barbershop_23-2148506245.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/professional-girl-hairdresser-makes-client-haircut-girl-is-sitting-mask-beauty-salon_343596-4435.jpg?_wi=3",
imageAlt: "happy client man haircutting",
},
]} ]}
title="Відгуки клієнтів" title="Відгуки клієнтів"
description="Що кажуть про нас клієнти." description="Що кажуть про нас клієнти."
@@ -324,27 +137,9 @@ export default function LandingPage() {
gridVariant="uniform-all-items-equal" gridVariant="uniform-all-items-equal"
useInvertedBackground={false} useInvertedBackground={false}
metrics={[ metrics={[
{ { id: "1", value: "500+", title: "Задоволених клієнтів", description: "Постійних користувачів", icon: Users },
id: "1", { id: "2", value: "1000+", title: "Виконаних стрижок", description: "Професійна якість", icon: Scissors },
value: "500+", { id: "3", value: "4.9", title: "Середня оцінка", description: "Від клієнтів", icon: Star }
title: "Задоволених клієнтів",
description: "Постійних користувачів",
icon: Users,
},
{
id: "2",
value: "1000+",
title: "Виконаних стрижок",
description: "Професійна якість",
icon: Scissors,
},
{
id: "3",
value: "4.9",
title: "Середня оцінка",
description: "Від клієнтів",
icon: Star,
},
]} ]}
title="Наші показники" title="Наші показники"
description="Статистика наших досягнень." description="Статистика наших досягнень."
@@ -356,21 +151,9 @@ export default function LandingPage() {
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
faqs={[ faqs={[
{ { id: "1", title: "Які райони ви обслуговуєте?", content: "Ми обслуговуємо весь Київ та прилеглі райони." },
id: "1", { id: "2", title: "Як замовити послугу?", content: "Зателефонуйте або залиште заявку на сайті." },
title: "Які райони ви обслуговуєте?", { id: "3", title: "Чи потрібна підготовка місця?", content: "Ні, ми беремо все необхідне з собою." }
content: "Ми обслуговуємо весь Київ та прилеглі райони.",
},
{
id: "2",
title: "Як замовити послугу?",
content: "Зателефонуйте або залиште заявку на сайті.",
},
{
id: "3",
title: "Чи потрібна підготовка місця?",
content: "Ні, ми беремо все необхідне з собою.",
},
]} ]}
title="Питання та відповіді" title="Питання та відповіді"
description="Знайдіть відповіді на поширені питання." description="Знайдіть відповіді на поширені питання."
@@ -381,9 +164,7 @@ export default function LandingPage() {
<div id="contact" data-section="contact"> <div id="contact" data-section="contact">
<ContactCenter <ContactCenter
useInvertedBackground={false} useInvertedBackground={false}
background={{ background={{ variant: "plain" }}
variant: "plain",
}}
title="Залиште заявку" title="Залиште заявку"
description="Ми зв'яжемося з вами найближчим часом." description="Ми зв'яжемося з вами найближчим часом."
tag="Контакти" tag="Контакти"
@@ -395,32 +176,8 @@ export default function LandingPage() {
imageSrc="http://img.b2bpic.net/free-photo/male-hairdresser-cutting-customer-s-hair-while-wearing-face-mask-coronavirus-epidemic_637285-9037.jpg" imageSrc="http://img.b2bpic.net/free-photo/male-hairdresser-cutting-customer-s-hair-while-wearing-face-mask-coronavirus-epidemic_637285-9037.jpg"
logoText="Барбер у дома" logoText="Барбер у дома"
columns={[ columns={[
{ { title: "Про нас", items: [{ label: "Про компанію", href: "#about" }, { label: "Наші майстри", href: "#team" }] },
title: "Про нас", { title: "Послуги", items: [{ label: "Стрижка", href: "#pricing" }, { label: "Гоління", href: "#pricing" }] }
items: [
{
label: "Про компанію",
href: "#about",
},
{
label: "Наші майстри",
href: "#team",
},
],
},
{
title: "Послуги",
items: [
{
label: "Стрижка",
href: "#pricing",
},
{
label: "Гоління",
href: "#pricing",
},
],
},
]} ]}
/> />
</div> </div>