Merge version_1 into main #2
452
src/app/page.tsx
452
src/app/page.tsx
@@ -27,359 +27,119 @@ export default function LandingPage() {
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Услуги",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Интерьер",
|
||||
id: "#interior",
|
||||
},
|
||||
{
|
||||
name: "Мастера",
|
||||
id: "#masters",
|
||||
},
|
||||
{
|
||||
name: "Отзывы",
|
||||
id: "#reviews",
|
||||
},
|
||||
{
|
||||
name: "Контакты",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="ZEF"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Услуги", id: "#services" },
|
||||
{ name: "Интерьер", id: "#interior" },
|
||||
{ name: "Мастера", id: "#masters" },
|
||||
{ name: "Отзывы", id: "#reviews" },
|
||||
{ name: "Контакты", id: "#contact" }
|
||||
]}
|
||||
brandName="ZEF"
|
||||
button={{ text: "Записаться", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="ZEF"
|
||||
description="Территория лаконичного стиля и безупречных стрижек."
|
||||
buttons={[
|
||||
{
|
||||
text: "Записаться",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/retro-logo-collection-template-concept_23-2148467763.jpg?_wi=1",
|
||||
imageAlt: "barbershop logo minimal black",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/vintage-logo-vector_53876-35041.jpg?_wi=1",
|
||||
imageAlt: "barbershop logo minimal black",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-black-background-grunge-texture-dark-wallpaper-blackboard-chalkboard-concrete_1258-82887.jpg?_wi=1",
|
||||
imageAlt: "barbershop logo minimal black",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-view-scissors-grey-background_23-2147839856.jpg?_wi=1",
|
||||
imageAlt: "barbershop logo minimal black",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-simple-textured-background-design_53876-63595.jpg",
|
||||
imageAlt: "barbershop logo minimal black",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/barber-template-design_23-2151527943.jpg",
|
||||
imageAlt: "barbershop logo minimal black",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "plain" }}
|
||||
title="ZEF"
|
||||
description="Территория лаконичного стиля и безупречных стрижек."
|
||||
buttons={[{ text: "Записаться", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/retro-logo-collection-template-concept_23-2148467763.jpg", imageAlt: "barbershop logo minimal black" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-vector/vintage-logo-vector_53876-35041.jpg", imageAlt: "barbershop logo minimal black" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/old-black-background-grunge-texture-dark-wallpaper-blackboard-chalkboard-concrete_1258-82887.jpg", imageAlt: "barbershop logo minimal black" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-view-scissors-grey-background_23-2147839856.jpg", imageAlt: "barbershop logo minimal black" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/black-simple-textured-background-design_53876-63595.jpg", imageAlt: "barbershop logo minimal black" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-psd/barber-template-design_23-2151527943.jpg", imageAlt: "barbershop logo minimal black" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "s1",
|
||||
title: "Мужская стрижка",
|
||||
price: "1500 ₽",
|
||||
period: "",
|
||||
features: [
|
||||
"Индивидуальный подбор формы",
|
||||
"Мытье головы",
|
||||
"Укладка",
|
||||
],
|
||||
button: {
|
||||
text: "Записаться",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/hipster-logos_23-2147506353.jpg",
|
||||
imageAlt: "Hipster logos",
|
||||
},
|
||||
{
|
||||
id: "s2",
|
||||
title: "Стрижка бороды",
|
||||
price: "1000 ₽",
|
||||
period: "",
|
||||
features: [
|
||||
"Коррекция формы",
|
||||
"Тримминг",
|
||||
"Уход маслами",
|
||||
],
|
||||
button: {
|
||||
text: "Записаться",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/retro-logo-collection-template-concept_23-2148467763.jpg?_wi=2",
|
||||
imageAlt: "Hipster logos",
|
||||
},
|
||||
{
|
||||
id: "s3",
|
||||
title: "Опасное бритье",
|
||||
price: "1200 ₽",
|
||||
period: "",
|
||||
features: [
|
||||
"Распаривание",
|
||||
"Традиционное бритье",
|
||||
"Успокаивающий лосьон",
|
||||
],
|
||||
button: {
|
||||
text: "Записаться",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/vintage-logo-vector_53876-35041.jpg?_wi=2",
|
||||
imageAlt: "Hipster logos",
|
||||
},
|
||||
{
|
||||
id: "s4",
|
||||
title: "Комплекс Стрижка + Борода",
|
||||
price: "2200 ₽",
|
||||
period: "",
|
||||
features: [
|
||||
"Полный уход",
|
||||
"Экономия времени",
|
||||
"Безупречный стиль",
|
||||
],
|
||||
button: {
|
||||
text: "Записаться",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-black-background-grunge-texture-dark-wallpaper-blackboard-chalkboard-concrete_1258-82887.jpg?_wi=2",
|
||||
imageAlt: "Hipster logos",
|
||||
},
|
||||
{
|
||||
id: "s5",
|
||||
title: "Детская стрижка",
|
||||
price: "1000 ₽",
|
||||
period: "",
|
||||
features: [
|
||||
"Аккуратность",
|
||||
"Комфорт",
|
||||
"Стильный образ",
|
||||
],
|
||||
button: {
|
||||
text: "Записаться",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-view-scissors-grey-background_23-2147839856.jpg?_wi=2",
|
||||
imageAlt: "Hipster logos",
|
||||
},
|
||||
]}
|
||||
title="Услуги"
|
||||
description="Профессиональный уход для мужчин, ценящих безупречность в деталях."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{ id: "s1", title: "Мужская стрижка", price: "1500 ₽", period: "", features: ["Индивидуальный подбор формы", "Мытье головы", "Укладка"], button: { text: "Записаться" }, imageSrc: "http://img.b2bpic.net/free-vector/hipster-logos_23-2147506353.jpg", imageAlt: "Hipster logos" },
|
||||
{ id: "s2", title: "Стрижка бороды", price: "1000 ₽", period: "", features: ["Коррекция формы", "Тримминг", "Уход маслами"], button: { text: "Записаться" }, imageSrc: "http://img.b2bpic.net/free-vector/retro-logo-collection-template-concept_23-2148467763.jpg", imageAlt: "Hipster logos" },
|
||||
{ id: "s3", title: "Опасное бритье", price: "1200 ₽", period: "", features: ["Распаривание", "Традиционное бритье", "Успокаивающий лосьон"], button: { text: "Записаться" }, imageSrc: "http://img.b2bpic.net/free-vector/vintage-logo-vector_53876-35041.jpg", imageAlt: "Hipster logos" }
|
||||
]}
|
||||
title="Услуги"
|
||||
description="Профессиональный уход для мужчин, ценящих безупречность в деталях."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="interior" data-section="interior">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Зона ожидания",
|
||||
description: "Комфортные кожаные кресла.",
|
||||
icon: LayoutDashboard,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/professional-hairdresser-sitting-armchair-has-rest-after-work-with-beer-bottle-his-hand_613910-18605.jpg",
|
||||
imageAlt: "barbershop leather chair interior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-stone-wall-surface_23-2151214695.jpg",
|
||||
imageAlt: "barbershop leather chair interior",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/retro-logo-collection-template-concept_23-2148467763.jpg?_wi=3",
|
||||
imageAlt: "barbershop leather chair interior",
|
||||
},
|
||||
{
|
||||
title: "Рабочая зона",
|
||||
description: "Индустриальный стиль и бетон.",
|
||||
icon: Scissors,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-barber-s-shop-getting-his-beard-trimmed_23-2149186493.jpg",
|
||||
imageAlt: "barbershop leather chair interior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/various-trimmers-dressing-table_107420-94767.jpg",
|
||||
imageAlt: "barbershop leather chair interior",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/vintage-logo-vector_53876-35041.jpg?_wi=3",
|
||||
imageAlt: "barbershop leather chair interior",
|
||||
},
|
||||
]}
|
||||
title="Атмосфера"
|
||||
description="Интерьер, созданный для профессионального стиля."
|
||||
/>
|
||||
</div>
|
||||
<div id="interior" data-section="interior">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Зона ожидания", description: "Комфортные кожаные кресла.", icon: LayoutDashboard, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/professional-hairdresser-sitting-armchair-has-rest-after-work-with-beer-bottle-his-hand_613910-18605.jpg", imageAlt: "barbershop leather chair interior" }, { imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-stone-wall-surface_23-2151214695.jpg", imageAlt: "barbershop leather chair interior" }] },
|
||||
{ title: "Рабочая зона", description: "Индустриальный стиль и бетон.", icon: Scissors, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/young-man-barber-s-shop-getting-his-beard-trimmed_23-2149186493.jpg", imageAlt: "barbershop leather chair interior" }, { imageSrc: "http://img.b2bpic.net/free-photo/various-trimmers-dressing-table_107420-94767.jpg", imageAlt: "barbershop leather chair interior" }] }
|
||||
]}
|
||||
title="Атмосфера"
|
||||
description="Интерьер, созданный для профессионального стиля."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="masters" data-section="masters">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{
|
||||
id: "m1",
|
||||
name: "Александр",
|
||||
role: "Старший барбер",
|
||||
description: "Опыт 10 лет.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-attractive-male-model-color-flash-light_158595-5103.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
name: "Максим",
|
||||
role: "Барбер",
|
||||
description: "Мастер фейда.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-having-great-time_23-2149443750.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
name: "Сергей",
|
||||
role: "Барбер",
|
||||
description: "Специалист по бороде.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67053.jpg",
|
||||
},
|
||||
{
|
||||
id: "m4",
|
||||
name: "Дмитрий",
|
||||
role: "Стажер",
|
||||
description: "Перспективный мастер.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-caucasian-woman-black-medical-uniform-standing-studio-competent-female-cosmetologist-holding-arms-crossed-grey-background_7502-9241.jpg",
|
||||
},
|
||||
]}
|
||||
title="Наши мастера"
|
||||
description="Команда профессионалов, преданных своему делу."
|
||||
/>
|
||||
</div>
|
||||
<div id="masters" data-section="masters">
|
||||
<TeamCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="four-items-2x2-equal-grid"
|
||||
useInvertedBackground={false}
|
||||
members={[
|
||||
{ id: "m1", name: "Александр", role: "Старший барбер", description: "Опыт 10 лет.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-attractive-male-model-color-flash-light_158595-5103.jpg" },
|
||||
{ id: "m2", name: "Максим", role: "Барбер", description: "Мастер фейда.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-having-great-time_23-2149443750.jpg" },
|
||||
{ id: "m3", name: "Сергей", role: "Барбер", description: "Специалист по бороде.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-female-dentist-dentistry-concept-dental-treatment_169016-67053.jpg" },
|
||||
{ id: "m4", name: "Дмитрий", role: "Стажер", description: "Перспективный мастер.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-beautiful-caucasian-woman-black-medical-uniform-standing-studio-competent-female-cosmetologist-holding-arms-crossed-grey-background_7502-9241.jpg" }
|
||||
]}
|
||||
title="Наши мастера"
|
||||
description="Команда профессионалов, преданных своему делу."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="reviews" data-section="reviews">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
title: "Отлично",
|
||||
quote: "Лучшая стрижка в городе.",
|
||||
name: "Иван",
|
||||
role: "Клиент",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/barber-template-design_23-2151527922.jpg",
|
||||
imageAlt: "Barber template design",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
title: "Профи",
|
||||
quote: "Стиль, качество, комфорт.",
|
||||
name: "Павел",
|
||||
role: "Клиент",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/retro-logo-collection-template-concept_23-2148467763.jpg?_wi=4",
|
||||
imageAlt: "Barber template design",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
title: "Рекомендую",
|
||||
quote: "Прихожу сюда постоянно.",
|
||||
name: "Николай",
|
||||
role: "Клиент",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/vintage-logo-vector_53876-35041.jpg?_wi=4",
|
||||
imageAlt: "Barber template design",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
title: "Уровень",
|
||||
quote: "Безупречно.",
|
||||
name: "Денис",
|
||||
role: "Клиент",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-black-background-grunge-texture-dark-wallpaper-blackboard-chalkboard-concrete_1258-82887.jpg?_wi=3",
|
||||
imageAlt: "Barber template design",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
title: "Класс",
|
||||
quote: "Спасибо за сервис.",
|
||||
name: "Артем",
|
||||
role: "Клиент",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-view-scissors-grey-background_23-2147839856.jpg?_wi=3",
|
||||
imageAlt: "Barber template design",
|
||||
},
|
||||
]}
|
||||
title="Отзывы"
|
||||
description="Что говорят наши клиенты."
|
||||
/>
|
||||
</div>
|
||||
<div id="reviews" data-section="reviews">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", title: "Отлично", quote: "Лучшая стрижка в городе.", name: "Иван", role: "Клиент", imageSrc: "http://img.b2bpic.net/free-psd/barber-template-design_23-2151527922.jpg", imageAlt: "Barber template design" },
|
||||
{ id: "t2", title: "Профи", quote: "Стиль, качество, комфорт.", name: "Павел", role: "Клиент", imageSrc: "http://img.b2bpic.net/free-vector/retro-logo-collection-template-concept_23-2148467763.jpg", imageAlt: "Barber template design" },
|
||||
{ id: "t3", title: "Рекомендую", quote: "Прихожу сюда постоянно.", name: "Николай", role: "Клиент", imageSrc: "http://img.b2bpic.net/free-vector/vintage-logo-vector_53876-35041.jpg", imageAlt: "Barber template design" }
|
||||
]}
|
||||
title="Отзывы"
|
||||
description="Что говорят наши клиенты."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Контакты"
|
||||
title="Записаться"
|
||||
description="Свяжитесь с нами для записи. Выберите удобное время."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283234.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Контакты"
|
||||
title="Записаться"
|
||||
description="Свяжитесь с нами для записи. Выберите удобное время."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283234.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Контакты",
|
||||
items: [
|
||||
{
|
||||
label: "Адрес: Улица Стрижек, 1",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Тел: +7 (999) 000-00-00",
|
||||
href: "tel:+79990000000",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Соцсети",
|
||||
items: [
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "VK",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 ZEF Barbershop."
|
||||
bottomRightText="Режим работы: 10:00 - 22:00"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{ title: "Контакты", items: [{ label: "Адрес: Улица Стрижек, 1", href: "#" }, { label: "Тел: +7 (999) 000-00-00", href: "tel:+79990000000" }] },
|
||||
{ title: "Соцсети", items: [{ label: "Instagram", href: "#" }, { label: "VK", href: "#" }] }
|
||||
]}
|
||||
bottomLeftText="© 2024 ZEF Barbershop."
|
||||
bottomRightText="Режим работы: 10:00 - 22:00"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user