233 lines
15 KiB
TypeScript
233 lines
15 KiB
TypeScript
"use client";
|
||
|
||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||
|
||
export default function LandingPage() {
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant="elastic-effect"
|
||
defaultTextAnimation="background-highlight"
|
||
borderRadius="soft"
|
||
contentWidth="mediumLarge"
|
||
sizing="mediumLargeSizeMediumTitles"
|
||
background="circleGradient"
|
||
cardStyle="glass-elevated"
|
||
primaryButtonStyle="double-inset"
|
||
secondaryButtonStyle="glass"
|
||
headingFontWeight="bold"
|
||
>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingInline
|
||
navItems={[
|
||
{ name: "Легковые", id: "cars" },
|
||
{ name: "Запчасти", id: "parts" },
|
||
{ name: "Услуги", id: "services" },
|
||
{ name: "Новости", id: "news" }
|
||
]}
|
||
brandName="AUTO.RIA"
|
||
button={{
|
||
text: "Продать авто", href: "#contact"
|
||
}}
|
||
/>
|
||
</div>
|
||
|
||
<div id="hero" data-section="hero">
|
||
<HeroCarouselLogo
|
||
logoText="AUTO.RIA"
|
||
description="Продажа автомобилей в Украине. Большой выбор новых и подержанных автомобилей. Все для авто в одном месте."
|
||
buttons={[
|
||
{ text: "Найти авто", href: "#cars" },
|
||
{ text: "Продать авто", href: "#contact" }
|
||
]}
|
||
slides={[
|
||
{ imageSrc: "https://cdn0.riastatic.com/photosnew/auto/photo/skoda_octavia__257817970fx.jpg", imageAlt: "Skoda Octavia 2002" },
|
||
{ imageSrc: "https://cdn4.riastatic.com/photosnew/auto/photo/skoda_octavia__257817984fx.jpg", imageAlt: "Skoda Octavia внешний вид" },
|
||
{ imageSrc: "https://cdn1.riastatic.com/photosnew/auto/photo/skoda_octavia__257817986fx.jpg", imageAlt: "Skoda Octavia салон" },
|
||
{ imageSrc: "https://cdn2.riastatic.com/photosnew/auto/photo/skoda_octavia__257817987fx.jpg", imageAlt: "Skoda Octavia детали" }
|
||
]}
|
||
autoplayDelay={4000}
|
||
/>
|
||
</div>
|
||
|
||
<div id="cars" data-section="cars">
|
||
<ProductCardTwo
|
||
products={[
|
||
{
|
||
id: "1", brand: "Skoda", name: "Octavia 2002", price: "$1,600", rating: 4,
|
||
reviewCount: "43", imageSrc: "https://cdn0.riastatic.com/photosnew/auto/photo/skoda_octavia__257817970fx.jpg", imageAlt: "Skoda Octavia 2002"
|
||
},
|
||
{
|
||
id: "2", brand: "Skoda", name: "Octavia 2003", price: "$5,800", rating: 5,
|
||
reviewCount: "28", imageSrc: "https://cdn3.riastatic.com/photosnew/auto/photo/skoda_octavia__610767883fx.jpg", imageAlt: "Skoda Octavia 2003"
|
||
},
|
||
{
|
||
id: "3", brand: "Skoda", name: "Octavia 2002 FL", price: "$4,500", rating: 4,
|
||
reviewCount: "35", imageSrc: "https://cdn4.riastatic.com/photosnew/auto/photo/skoda_octavia__465178559fx.jpg", imageAlt: "Skoda Octavia 2002 FL"
|
||
},
|
||
{
|
||
id: "4", brand: "Skoda", name: "Octavia 2001", price: "$5,000", rating: 4,
|
||
reviewCount: "22", imageSrc: "https://cdn0.riastatic.com/photosnew/auto/photo/skoda_octavia__619565065fx.jpg", imageAlt: "Skoda Octavia 2001"
|
||
}
|
||
]}
|
||
title="Популярные автомобили"
|
||
description="Найдите идеальный автомобиль из нашей коллекции проверенных предложений"
|
||
textboxLayout="default"
|
||
gridVariant="uniform-all-items-equal"
|
||
animationType="slide-up"
|
||
useInvertedBackground="invertDefault"
|
||
/>
|
||
</div>
|
||
|
||
<div id="features" data-section="features">
|
||
<FeatureCardOne
|
||
features={[
|
||
{
|
||
title: "Проверенные объявления", description: "Все автомобили проходят проверку на подлинность данных", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/reviews_photo/skoda-octavia__45618-460x345.jpg", imageAlt: "Проверка автомобиля", button: { text: "Узнать больше", href: "#about" }
|
||
},
|
||
{
|
||
title: "Широкий выбор", description: "Тысячи автомобилей различных марок и моделей", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/photo/skoda-octavia__489319107-460x345.jpg", imageAlt: "Выбор автомобилей", button: { text: "Смотреть каталог", href: "#cars" }
|
||
},
|
||
{
|
||
title: "Удобный поиск", description: "Найдите подходящий автомобиль с помощью удобных фильтров", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/photo/skoda-octavia__483270836-460x345.jpg", imageAlt: "Поиск автомобиля", button: { text: "Начать поиск", href: "#search" }
|
||
}
|
||
]}
|
||
title="Почему выбирают AUTO.RIA"
|
||
description: "Мы предоставляем лучшие условия для покупки и продажи автомобилей"
|
||
textboxLayout="default"
|
||
gridVariant="three-columns-all-equal-width"
|
||
animationType="blur-reveal"
|
||
useInvertedBackground="noInvert"
|
||
/>
|
||
</div>
|
||
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardSix
|
||
testimonials={[
|
||
{
|
||
id: "1", name: "Алексей М.", handle: "@alexm", testimonial: "Купил отличный автомобиль через AUTO.RIA. Все честно, без скрытых платежей. Рекомендую!", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/reviews_photo/skoda-octavia__2683-460x345.jpg", imageAlt: "Алексей М."
|
||
},
|
||
{
|
||
id: "2", name: "Елена К.", handle: "@elenak", testimonial: "Продала свой автомобиль быстро и выгодно. Очень довольна сервисом AUTO.RIA.", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/photo/skoda-octavia__408558918-460x345.jpg", imageAlt: "Елена К."
|
||
},
|
||
{
|
||
id: "3", name: "Дмитрий В.", handle: "@dmitryv", testimonial: "Широкий выбор и честные цены. Нашел именно то, что искал. Спасибо AUTO.RIA!", imageSrc: "https://cdn.riastatic.com/photosnew/general/rubrics/img__1096b.jpg", imageAlt: "Дмитрий В."
|
||
},
|
||
{
|
||
id: "4", name: "Анна С.", handle: "@annas", testimonial: "Удобная платформа, качественные фото, подробные описания. Все на высшем уровне."
|
||
},
|
||
{
|
||
id: "5", name: "Сергей П.", handle: "@sergeyp", testimonial: "Пользуюсь AUTO.RIA уже несколько лет. Надежно и удобно для покупки авто."
|
||
},
|
||
{
|
||
id: "6", name: "Марина Л.", handle: "@marinal", testimonial: "Отличный сервис поддержки. Помогли решить все вопросы быстро и профессионально."
|
||
}
|
||
]}
|
||
animationType="slide-up"
|
||
title="Отзывы наших клиентов"
|
||
description: "Узнайте, что говорят о нас тысячи довольных клиентов"
|
||
textboxLayout="default"
|
||
useInvertedBackground="invertDefault"
|
||
speed={35}
|
||
/>
|
||
</div>
|
||
|
||
<div id="metrics" data-section="metrics">
|
||
<MetricCardTwo
|
||
metrics={[
|
||
{
|
||
id: "1", value: "150K+", description: "Активных объявлений"
|
||
},
|
||
{
|
||
id: "2", value: "2M+", description: "Довольных покупателей"
|
||
},
|
||
{
|
||
id: "3", value: "24/7", description: "Поддержка клиентов"
|
||
},
|
||
{
|
||
id: "4", value: "99.8%", description: "Точность объявлений"
|
||
}
|
||
]}
|
||
title="AUTO.RIA в цифрах"
|
||
description: "Статистика, которая говорит о нашей надежности"
|
||
textboxLayout="default"
|
||
gridVariant="uniform-all-items-equal"
|
||
animationType="scale-rotate"
|
||
useInvertedBackground="noInvert"
|
||
/>
|
||
</div>
|
||
|
||
<div id="news" data-section="news">
|
||
<BlogCardOne
|
||
blogs={[
|
||
{
|
||
id: "1", category: "Тест-драйв", title: "Тест-драйв Skoda Kodiaq", excerpt: "Не зраджуй своїх звичок", imageSrc: "https://cdn.riastatic.com/photosnewr/ria/news_common/__260315-448x280.jpg", authorName: "Редакция AUTO.RIA", authorAvatar: "https://cdn.riastatic.com/docs/pictures/common/2/216/21655/21655.png", date: "11 июля 2025"
|
||
},
|
||
{
|
||
id: "2", category: "Тест-драйв", title: "Тест-драйв Skoda Kamiq", excerpt: "Пропонує більше, ніж ви очікували", imageSrc: "https://cdn.riastatic.com/photosnewr/ria/news_common/__260162-448x280.jpg", authorName: "Редакция AUTO.RIA", authorAvatar: "https://cdn.riastatic.com/docs/pictures/common/2/216/21655/21655.png", date: "9 мая 2025"
|
||
},
|
||
{
|
||
id: "3", category: "Тест-драйв", title: "Тест-драйв Skoda Octavia", excerpt: "М'яка допомога чеському бестселеру", imageSrc: "https://cdn.riastatic.com/photosnewr/ria/news_common/__259946-448x280.jpg", authorName: "Редакция AUTO.RIA", authorAvatar: "https://cdn.riastatic.com/docs/pictures/common/2/216/21655/21655.png", date: "27 февраля 2025"
|
||
},
|
||
{
|
||
id: "4", category: "Обзор", title: "Тест-драйв Skoda Fabia NEW", excerpt: "прощай, бюджет!", imageSrc: "https://cdn.riastatic.com/photosnewr/ria/news_common/__255574-448x280.jpg", authorName: "Редакция AUTO.RIA", authorAvatar: "https://cdn.riastatic.com/docs/pictures/common/2/216/21655/21655.png", date: "8 февраля 2022"
|
||
}
|
||
]}
|
||
title: "Новости автомира", description: "Свежие новости, тест-драйвы и обзоры от экспертов AUTO.RIA", textboxLayout: "default", animationType: "opacity", useInvertedBackground: "invertDefault", carouselMode: "buttons"
|
||
/>
|
||
</div>
|
||
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplit
|
||
tag="Связь"
|
||
title="Продать автомобиль выгодно"
|
||
description="Разместите объявление на AUTO.RIA и найдите покупателя быстро. Миллионы пользователей ежедневно ищут автомобили на нашей платформе."
|
||
imageSrc="https://cdn3.riastatic.com/photosnew/auto/photo/skoda_octavia__257817988fx.jpg"
|
||
imageAlt="Продажа автомобиля"
|
||
inputPlaceholder="Введите ваш email"
|
||
buttonText="Разместить объявление"
|
||
termsText="Нажимая кнопку, вы соглашаетесь с условиями использования сервиса AUTO.RIA"
|
||
useInvertedBackground="noInvert"
|
||
/>
|
||
</div>
|
||
|
||
<div id="footer" data-section="footer">
|
||
<FooterBase
|
||
logoText="AUTO.RIA"
|
||
columns={[
|
||
{
|
||
title: "Автомобили", items: [
|
||
{ label: "Легковые", href: "#cars" },
|
||
{ label: "Новые авто", href: "#new-cars" },
|
||
{ label: "Все для авто", href: "#auto-parts" }
|
||
]
|
||
},
|
||
{
|
||
title: "Сервисы", items: [
|
||
{ label: "Поддержка 24/7", href: "#support" },
|
||
{ label: "Продать авто", href: "#sell" },
|
||
{ label: "GARAGE AUTO.RIA", href: "#garage" }
|
||
]
|
||
},
|
||
{
|
||
title: "Информация", items: [
|
||
{ label: "О компании", href: "#about" },
|
||
{ label: "Новости", href: "#news" },
|
||
{ label: "Контакты", href: "#contact" }
|
||
]
|
||
}
|
||
]}
|
||
copyrightText="© 2025 | AUTO.RIA"
|
||
/>
|
||
</div>
|
||
</ThemeProvider>
|
||
);
|
||
} |