Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 08db0e7d62 | |||
| e482fb03eb | |||
| 9fa29fb6b2 | |||
| 2f7f449ed0 | |||
| 51c61b2895 | |||
| 4836b07261 | |||
| 3e45a3dcd4 | |||
| b1a895dca3 | |||
| 2542ff1f7b | |||
| 517c96b131 |
260
src/app/page.tsx
260
src/app/page.tsx
@@ -4,14 +4,13 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||||
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
||||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -25,161 +24,118 @@ export default function LandingPage() {
|
||||
cardStyle="gradient-radial"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="light"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Products", id: "products" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Perekus Plus"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Головна", id: "hero" },
|
||||
{ name: "Про нас", id: "about" },
|
||||
{ name: "Каталог", id: "products" },
|
||||
{ name: "Контакти", id: "contact" },
|
||||
]}
|
||||
brandName="Бруківка Вектор"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Свіжа їжа у вас вдома"
|
||||
description="Швидка доставка ваших улюблених страв від Perekus Plus. Смачно, гаряче та завжди вчасно."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-fresh-vegetables-lemon-bell-pepper-cauliflower-carrot-lettuce-shopping-bag-dark-background_140725-145347.jpg"
|
||||
showBlur={true}
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/label-food-near-lunchbox_23-2147866330.jpg", alt: "Label and food near lunchbox" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/flat-lay-boxes-with-salad-yellow-background_23-2148247885.jpg", alt: "Flat lay boxes with salad on yellow background" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/top-view-vegetable-composition-cabbage-carrots-greens-red-spicy-peppers-bright-desk-vegetable-food-meal-healthy-color_140725-31047.jpg", alt: "Top view vegetable composition" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/colorful-capsicum-orange-bananas-gray-concrete-background_23-2148062371.jpg", alt: "Colorful capsicum" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/medium-shot-woman-posing-outdoors_23-2150188339.jpg", alt: "Medium shot woman posing outdoors" },
|
||||
]}
|
||||
avatarText="Приєднуйтесь до 5000+ задоволених клієнтів"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitTestimonial
|
||||
title="Якісна бруківка для вашого комфорту"
|
||||
description="Створюємо ідеальне покриття для доріжок, парковок та прибудинкових територій. Надійність та естетика в кожному камені."
|
||||
background={{ variant: "downward-rays-static-grid" }}
|
||||
testimonials={[]}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/stone-paving-background-texture_140725-7036.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={false}
|
||||
title="Про нас"
|
||||
description={[
|
||||
"Ми дбаємо про те, щоб кожен ваш обід був справжнім святом смаку.", "Використовуємо лише найсвіжіші продукти та найкращі рецепти від наших шефів."]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
title="Чому обирають Вектор?"
|
||||
description="Ми використовуємо лише перевірені матеріали та сучасні технології укладання бруківки, що гарантує довговічність та стійкість до будь-яких погодних умов."
|
||||
metrics={[{ value: "15+", title: "Років досвіду" }, { value: "500+", title: "Проєктів" }]}
|
||||
useInvertedBackground={false}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/view-paved-stone-path_140725-8664.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Обирайте", description: "Оберіть улюблені страви у нашому меню.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-food-lover-taking-pictures-meal_23-2149286426.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-nutritional-counter-app-concept_23-2149880608.jpg" }
|
||||
},
|
||||
{
|
||||
title: "Замовляйте", description: "Оформіть замовлення в один клік.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-hand-holding-phone-with-online-menu_23-2149303455.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-hands-holding-smartphone_23-2149177827.jpg" }
|
||||
},
|
||||
{
|
||||
title: "Насолоджуйтесь", description: "Ми доставимо все за 30 хвилин.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/3d-smartphone-device-with-map-gps-technology_23-2150458977.jpg" },
|
||||
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/business-people-using-maps-phones_53876-15135.jpg" }
|
||||
}
|
||||
]}
|
||||
showStepNumbers={true}
|
||||
title="Як ми працюємо"
|
||||
description="Процес замовлення максимально простий та швидкий."
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Наші переваги"
|
||||
description="Ми пропонуємо повний цикл послуг — від вибору дизайну до професійного монтажу."
|
||||
features={[
|
||||
{ id: "f1", title: "Довговічність", author: "Технології", description: "Стійкість до механічних пошкоджень та вологи.", tags: ["Якість"], videoSrc: "https://example.com/video1.mp4" },
|
||||
{ id: "f2", title: "Естетика", author: "Дизайн", description: "Широкий асортимент форм та кольорів.", tags: ["Стиль"], videoSrc: "https://example.com/video2.mp4" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", brand: "Perekus", name: "Фірмовий бургер", price: "180 грн", rating: 5, reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/editorial-style-valentine-s-day-celebration_23-2151922511.jpg" },
|
||||
{ id: "p2", brand: "Perekus", name: "Піца Пепероні", price: "220 грн", rating: 4, reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/meat-pizza-with-cheese-vegetables-wooden-board_140725-1397.jpg" },
|
||||
{ id: "p3", brand: "Perekus", name: "Салат Цезар", price: "150 грн", rating: 5, reviewCount: "95", imageSrc: "http://img.b2bpic.net/free-photo/traditional-waldorf-salad-wooden-background-top-view_127032-3275.jpg" },
|
||||
{ id: "p4", brand: "Perekus", name: "Паста Карбонара", price: "190 грн", rating: 4, reviewCount: "70", imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-pasta-with-sauce-bowl-table-with-glass-red-wine_181624-31544.jpg" },
|
||||
{ id: "p5", brand: "Perekus", name: "Шоколадний торт", price: "90 грн", rating: 5, reviewCount: "60", imageSrc: "http://img.b2bpic.net/free-photo/front-view-french-macarons-inside-plate-white-table-biscuit-sweet-cake_140725-124026.jpg" },
|
||||
{ id: "p6", brand: "Perekus", name: "Сет суші", price: "350 грн", rating: 5, reviewCount: "150", imageSrc: "http://img.b2bpic.net/free-photo/different-sushi-delivery-varieties-sushi-lunch-dinner_132075-14375.jpg" },
|
||||
]}
|
||||
title="Наші страви"
|
||||
description="Спробуйте найкращі хіти від нашого шефа."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardFour
|
||||
title="Наш асортимент"
|
||||
description="Перегляньте популярні види бруківки для різних архітектурних рішень."
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Класична цеглинка", price: "від 300 грн/м²", variant: "В наявності", imageSrc: "https://img.b2bpic.net/free-photo/paving-stones-background_140725-7832.jpg" },
|
||||
{ id: "p2", name: "Фігурна плитка", price: "від 450 грн/м²", variant: "В наявності", imageSrc: "https://img.b2bpic.net/free-photo/paving-blocks_140725-8314.jpg?_wi=1" },
|
||||
{ id: "p3", name: "Бруківка Старе місто", price: "від 400 грн/м²", variant: "Під замовлення", imageSrc: "https://img.b2bpic.net/free-photo/paving-blocks_140725-8314.jpg?_wi=2" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", title: "Чудова піца", quote: "Найкраща піца в місті!", name: "Олена", role: "Клієнт", imageSrc: "http://img.b2bpic.net/free-photo/man-presents-girl-ring_1398-4220.jpg" },
|
||||
{ id: "2", title: "Швидка доставка", quote: "Привезли гарячим, супер.", name: "Андрій", role: "Клієнт", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-cheerful-businessman-eating-hamburger-while-working-cafe_1163-1643.jpg" },
|
||||
{ id: "3", title: "Смачно", quote: "Завжди свіжі інгредієнти.", name: "Марина", role: "Клієнт", imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-preparing-christmas-dinner_23-2149144965.jpg" },
|
||||
{ id: "4", title: "Рекомендую", quote: "Дуже смачно, дякую!", name: "Сергій", role: "Клієнт", imageSrc: "http://img.b2bpic.net/free-photo/roommates-sharing-meal-together_23-2149112123.jpg" },
|
||||
{ id: "5", title: "Супер сервіс", quote: "Замовляю тільки тут.", name: "Ірина", role: "Клієнт", imageSrc: "http://img.b2bpic.net/free-photo/front-view-young-attractive-girl-colorful-cape-excited-happy-black-background-cleaning-housewife_140725-16149.jpg" },
|
||||
]}
|
||||
title="Відгуки клієнтів"
|
||||
description="Що кажуть про нас наші гості."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
title="Відгуки клієнтів"
|
||||
description="Дізнайтеся, що думають наші замовники про якість роботи."
|
||||
useInvertedBackground={false}
|
||||
testimonials={[{ id: "1", name: "Олександр", role: "Клієнт", company: "Власник будинку", quote: "Дуже задоволений роботою, все зроблено вчасно та якісно.", rating: 5, imageSrc: "https://img.b2bpic.net/free-photo/smiling-man_140725-9981.jpg" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "1000+", title: "Замовлень", description: "Щомісяця", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-taking-photos_23-2149250065.jpg" },
|
||||
{ id: "m2", value: "50+", title: "Страви", description: "У меню", imageSrc: "http://img.b2bpic.net/free-photo/young-caucasian-woman-working-small-business-ecommerce-holding-take-away-food-looking-positive-happy-standing-smiling-with-confident-smile-showing-teeth_839833-9709.jpg" },
|
||||
{ id: "m3", value: "30хв", title: "Доставка", description: "Середній час", imageSrc: "http://img.b2bpic.net/free-photo/business-executives-having-meal_1170-1739.jpg" },
|
||||
]}
|
||||
title="Наші досягнення"
|
||||
description="Результати нашої щоденної роботи."
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
faqs={[
|
||||
{ id: "q1", title: "Як замовити укладання?", content: "Зв'яжіться з нами через форму на сайті або за телефоном." },
|
||||
{ id: "q2", title: "Чи виїжджаєте на об'єкт?", content: "Так, ми проводимо безкоштовний виїзд для замірів." }
|
||||
]}
|
||||
title="Часті питання"
|
||||
description="Відповіді на популярні запитання."
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/worker-measuring-pavement_140725-9982.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Як зробити замовлення?", content: "Оформіть через сайт або зателефонуйте." },
|
||||
{ id: "q2", title: "Яка вартість доставки?", content: "Безкоштовна при замовленні від 300 грн." },
|
||||
{ id: "q3", title: "Як працюєте?", content: "Щодня з 10:00 до 22:00." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-metallic-kitchen_23-2151113203.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
faqsAnimation="slide-up"
|
||||
title="Питання та відповіді"
|
||||
description="Корисна інформація для клієнтів."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
tag="Зв'язок"
|
||||
title="Почніть свій проект вже сьогодні"
|
||||
description="Залишилися питання? Залиште заявку, і ми допоможемо вам з вибором."
|
||||
background={{ variant: "animated-grid" }}
|
||||
useInvertedBackground={false}
|
||||
imageSrc="https://img.b2bpic.net/free-photo/worker-laying-stone-pathway_140725-9234.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
tag="Розсилка"
|
||||
title="Залишайтеся на зв'язку"
|
||||
description="Підпишіться на наші новини та акції."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/man-with-bag-hailing-cab_23-2147932353.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/senior-people-having-fun-party_23-2149299023.jpg"
|
||||
logoText="Perekus Plus"
|
||||
columns={[
|
||||
{ title: "Меню", items: [{ label: "Бургери", href: "#products" }, { label: "Піца", href: "#products" }] },
|
||||
{ title: "Компанія", items: [{ label: "Про нас", href: "#about" }, { label: "Контакти", href: "#contact" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
logoText="Бруківка Вектор"
|
||||
columns={[
|
||||
{ title: "Навігація", items: [{ label: "Головна", href: "#hero" }, { label: "Каталог", href: "#products" }] }
|
||||
]}
|
||||
copyrightText="© 2025 Бруківка Вектор. Усі права захищено."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user