Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #1.
This commit is contained in:
459
src/app/page.tsx
459
src/app/page.tsx
@@ -1,233 +1,254 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import React, { useState, useEffect } from 'react';
|
||||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
import { ChevronRight, Sparkles, Zap, Shield, Rocket, ArrowRight, Star, CheckCircle2, Globe, Users, TrendingUp, Award } from 'lucide-react';
|
||||||
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
|
||||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
export default function HomePage() {
|
||||||
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
|
const [isLoaded, setIsLoaded] = useState(false);
|
||||||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
const [activeFeature, setActiveFeature] = useState(0);
|
||||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
|
||||||
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
useEffect(() => {
|
||||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
setIsLoaded(true);
|
||||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
}, []);
|
||||||
|
|
||||||
|
const features = [
|
||||||
|
{
|
||||||
|
icon: Zap,
|
||||||
|
title: "Lightning Fast", description: "Optimized performance with cutting-edge technology"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Shield,
|
||||||
|
title: "Enterprise Security", description: "Bank-level security protocols to protect your data"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Rocket,
|
||||||
|
title: "Scalable Growth", description: "Built to scale with your business needs"
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const testimonials = [
|
||||||
|
{
|
||||||
|
name: "Sarah Chen", role: "CTO at TechCorp", content: "This platform transformed our workflow completely. The efficiency gains are incredible.", rating: 5
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Michael Rodriguez", role: "Product Manager", content: "Best decision we made this year. The ROI was immediate and substantial.", rating: 5
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Emily Johnson", role: "Startup Founder", content: "Simple, powerful, and exactly what we needed to scale our operations.", rating: 5
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
const stats = [
|
||||||
|
{ label: "Active Users", value: "10M+" },
|
||||||
|
{ label: "Success Rate", value: "99.9%" },
|
||||||
|
{ label: "Countries", value: "150+" },
|
||||||
|
{ label: "Uptime", value: "99.99%" }
|
||||||
|
];
|
||||||
|
|
||||||
export default function LandingPage() {
|
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<div className="min-h-screen bg-gradient-to-br from-slate-50 to-blue-50">
|
||||||
defaultButtonVariant="elastic-effect"
|
{/* Navigation */}
|
||||||
defaultTextAnimation="background-highlight"
|
<nav className="fixed top-0 w-full bg-white/80 backdrop-blur-md border-b border-gray-200 z-50">
|
||||||
borderRadius="soft"
|
<div className="max-w-7xl mx-auto px-6 py-4">
|
||||||
contentWidth="mediumLarge"
|
<div className="flex items-center justify-between">
|
||||||
sizing="mediumLargeSizeMediumTitles"
|
<div className="flex items-center space-x-2">
|
||||||
background="circleGradient"
|
<Sparkles className="w-8 h-8 text-blue-600" />
|
||||||
cardStyle="glass-elevated"
|
<span className="text-2xl font-bold text-gray-900">WebApp</span>
|
||||||
primaryButtonStyle="double-inset"
|
</div>
|
||||||
secondaryButtonStyle="glass"
|
<div className="hidden md:flex items-center space-x-8">
|
||||||
headingFontWeight="bold"
|
<a href="#features" className="text-gray-700 hover:text-blue-600 transition-colors">Features</a>
|
||||||
>
|
<a href="#pricing" className="text-gray-700 hover:text-blue-600 transition-colors">Pricing</a>
|
||||||
<div id="nav" data-section="nav">
|
<a href="#about" className="text-gray-700 hover:text-blue-600 transition-colors">About</a>
|
||||||
<NavbarLayoutFloatingInline
|
<button className="bg-blue-600 text-white px-6 py-2 rounded-full hover:bg-blue-700 transition-colors">
|
||||||
navItems={[
|
Get Started
|
||||||
{ name: "Легковые", id: "cars" },
|
</button>
|
||||||
{ name: "Запчасти", id: "parts" },
|
</div>
|
||||||
{ name: "Услуги", id: "services" },
|
</div>
|
||||||
{ name: "Новости", id: "news" }
|
</div>
|
||||||
]}
|
</nav>
|
||||||
brandName="AUTO.RIA"
|
|
||||||
button={{
|
|
||||||
text: "Продать авто", href: "#contact"
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
{/* Hero Section */}
|
||||||
<HeroCarouselLogo
|
<section className={`pt-32 pb-20 px-6 transition-all duration-1000 ${isLoaded ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-10'}`}>
|
||||||
logoText="AUTO.RIA"
|
<div className="max-w-7xl mx-auto text-center">
|
||||||
description="Продажа автомобилей в Украине. Большой выбор новых и подержанных автомобилей. Все для авто в одном месте."
|
<div className="inline-flex items-center bg-blue-100 text-blue-800 px-4 py-2 rounded-full text-sm font-medium mb-8">
|
||||||
buttons={[
|
<Sparkles className="w-4 h-4 mr-2" />
|
||||||
{ text: "Найти авто", href: "#cars" },
|
New: AI-Powered Analytics Now Available
|
||||||
{ text: "Продать авто", href: "#contact" }
|
</div>
|
||||||
]}
|
<h1 className="text-5xl md:text-7xl font-bold text-gray-900 mb-6 leading-tight">
|
||||||
slides={[
|
Build the Future
|
||||||
{ imageSrc: "https://cdn0.riastatic.com/photosnew/auto/photo/skoda_octavia__257817970fx.jpg", imageAlt: "Skoda Octavia 2002" },
|
<span className="block bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent">
|
||||||
{ imageSrc: "https://cdn4.riastatic.com/photosnew/auto/photo/skoda_octavia__257817984fx.jpg", imageAlt: "Skoda Octavia внешний вид" },
|
Today
|
||||||
{ imageSrc: "https://cdn1.riastatic.com/photosnew/auto/photo/skoda_octavia__257817986fx.jpg", imageAlt: "Skoda Octavia салон" },
|
</span>
|
||||||
{ imageSrc: "https://cdn2.riastatic.com/photosnew/auto/photo/skoda_octavia__257817987fx.jpg", imageAlt: "Skoda Octavia детали" }
|
</h1>
|
||||||
]}
|
<p className="text-xl text-gray-600 mb-10 max-w-3xl mx-auto leading-relaxed">
|
||||||
autoplayDelay={4000}
|
Transform your business with our cutting-edge platform. Streamline operations,
|
||||||
/>
|
boost productivity, and unlock unprecedented growth opportunities.
|
||||||
</div>
|
</p>
|
||||||
|
<div className="flex flex-col sm:flex-row gap-4 justify-center mb-16">
|
||||||
|
<button className="bg-blue-600 text-white px-8 py-4 rounded-full hover:bg-blue-700 transition-all duration-300 transform hover:scale-105 flex items-center justify-center">
|
||||||
|
Start Free Trial
|
||||||
|
<ArrowRight className="ml-2 w-5 h-5" />
|
||||||
|
</button>
|
||||||
|
<button className="border-2 border-gray-300 text-gray-700 px-8 py-4 rounded-full hover:border-blue-600 hover:text-blue-600 transition-colors">
|
||||||
|
Watch Demo
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="cars" data-section="cars">
|
{/* Stats */}
|
||||||
<ProductCardTwo
|
<div className="grid grid-cols-2 md:grid-cols-4 gap-8 max-w-4xl mx-auto">
|
||||||
products={[
|
{stats.map((stat, index) => (
|
||||||
{
|
<div key={index} className="text-center">
|
||||||
id: "1", brand: "Skoda", name: "Octavia 2002", price: "$1,600", rating: 4,
|
<div className="text-3xl md:text-4xl font-bold text-blue-600 mb-2">{stat.value}</div>
|
||||||
reviewCount: "43", imageSrc: "https://cdn0.riastatic.com/photosnew/auto/photo/skoda_octavia__257817970fx.jpg", imageAlt: "Skoda Octavia 2002"
|
<div className="text-gray-600">{stat.label}</div>
|
||||||
},
|
</div>
|
||||||
{
|
))}
|
||||||
id: "2", brand: "Skoda", name: "Octavia 2003", price: "$5,800", rating: 5,
|
</div>
|
||||||
reviewCount: "28", imageSrc: "https://cdn3.riastatic.com/photosnew/auto/photo/skoda_octavia__610767883fx.jpg", imageAlt: "Skoda Octavia 2003"
|
</div>
|
||||||
},
|
</section>
|
||||||
{
|
|
||||||
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">
|
{/* Features Section */}
|
||||||
<FeatureCardOne
|
<section id="features" className="py-20 px-6 bg-white">
|
||||||
features={[
|
<div className="max-w-7xl mx-auto">
|
||||||
{
|
<div className="text-center mb-16">
|
||||||
title: "Проверенные объявления", description: "Все автомобили проходят проверку на подлинность данных", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/reviews_photo/skoda-octavia__45618-460x345.jpg", imageAlt: "Проверка автомобиля", button: { text: "Узнать больше", href: "#about" }
|
<h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-6">
|
||||||
},
|
Powerful Features
|
||||||
{
|
</h2>
|
||||||
title: "Широкий выбор", description: "Тысячи автомобилей различных марок и моделей", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/photo/skoda-octavia__489319107-460x345.jpg", imageAlt: "Выбор автомобилей", button: { text: "Смотреть каталог", href: "#cars" }
|
<p className="text-xl text-gray-600 max-w-3xl mx-auto">
|
||||||
},
|
Everything you need to succeed, built with modern technology and designed for scale.
|
||||||
{
|
</p>
|
||||||
title: "Удобный поиск", description: "Найдите подходящий автомобиль с помощью удобных фильтров", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/photo/skoda-octavia__483270836-460x345.jpg", imageAlt: "Поиск автомобиля", button: { text: "Начать поиск", href: "#search" }
|
</div>
|
||||||
}
|
|
||||||
]}
|
|
||||||
title="Почему выбирают AUTO.RIA"
|
|
||||||
description: "Мы предоставляем лучшие условия для покупки и продажи автомобилей"
|
|
||||||
textboxLayout="default"
|
|
||||||
gridVariant="three-columns-all-equal-width"
|
|
||||||
animationType="blur-reveal"
|
|
||||||
useInvertedBackground="noInvert"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
<div className="grid md:grid-cols-3 gap-8">
|
||||||
<TestimonialCardSix
|
{features.map((feature, index) => {
|
||||||
testimonials={[
|
const IconComponent = feature.icon;
|
||||||
{
|
return (
|
||||||
id: "1", name: "Алексей М.", handle: "@alexm", testimonial: "Купил отличный автомобиль через AUTO.RIA. Все честно, без скрытых платежей. Рекомендую!", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/reviews_photo/skoda-octavia__2683-460x345.jpg", imageAlt: "Алексей М."
|
<div
|
||||||
},
|
key={index}
|
||||||
{
|
className={`p-8 rounded-2xl border-2 transition-all duration-300 cursor-pointer transform hover:scale-105 ${
|
||||||
id: "2", name: "Елена К.", handle: "@elenak", testimonial: "Продала свой автомобиль быстро и выгодно. Очень довольна сервисом AUTO.RIA.", imageSrc: "https://cdn.riastatic.com/photosnewr/auto/photo/skoda-octavia__408558918-460x345.jpg", imageAlt: "Елена К."
|
activeFeature === index
|
||||||
},
|
? 'border-blue-500 bg-blue-50 shadow-lg'
|
||||||
{
|
: 'border-gray-200 bg-white hover:border-blue-300'
|
||||||
id: "3", name: "Дмитрий В.", handle: "@dmitryv", testimonial: "Широкий выбор и честные цены. Нашел именно то, что искал. Спасибо AUTO.RIA!", imageSrc: "https://cdn.riastatic.com/photosnew/general/rubrics/img__1096b.jpg", imageAlt: "Дмитрий В."
|
}`}
|
||||||
},
|
onMouseEnter={() => setActiveFeature(index)}
|
||||||
{
|
>
|
||||||
id: "4", name: "Анна С.", handle: "@annas", testimonial: "Удобная платформа, качественные фото, подробные описания. Все на высшем уровне."
|
<IconComponent className="w-12 h-12 text-blue-600 mb-4" />
|
||||||
},
|
<h3 className="text-2xl font-bold text-gray-900 mb-4">{feature.title}</h3>
|
||||||
{
|
<p className="text-gray-600 leading-relaxed">{feature.description}</p>
|
||||||
id: "5", name: "Сергей П.", handle: "@sergeyp", testimonial: "Пользуюсь AUTO.RIA уже несколько лет. Надежно и удобно для покупки авто."
|
</div>
|
||||||
},
|
);
|
||||||
{
|
})}
|
||||||
id: "6", name: "Марина Л.", handle: "@marinal", testimonial: "Отличный сервис поддержки. Помогли решить все вопросы быстро и профессионально."
|
</div>
|
||||||
}
|
</div>
|
||||||
]}
|
</section>
|
||||||
animationType="slide-up"
|
|
||||||
title="Отзывы наших клиентов"
|
|
||||||
description: "Узнайте, что говорят о нас тысячи довольных клиентов"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground="invertDefault"
|
|
||||||
speed={35}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="metrics" data-section="metrics">
|
{/* Testimonials Section */}
|
||||||
<MetricCardTwo
|
<section className="py-20 px-6 bg-gray-50">
|
||||||
metrics={[
|
<div className="max-w-7xl mx-auto">
|
||||||
{
|
<div className="text-center mb-16">
|
||||||
id: "1", value: "150K+", description: "Активных объявлений"
|
<h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-6">
|
||||||
},
|
Loved by Thousands
|
||||||
{
|
</h2>
|
||||||
id: "2", value: "2M+", description: "Довольных покупателей"
|
<p className="text-xl text-gray-600">
|
||||||
},
|
See what our customers are saying about their experience.
|
||||||
{
|
</p>
|
||||||
id: "3", value: "24/7", description: "Поддержка клиентов"
|
</div>
|
||||||
},
|
|
||||||
{
|
|
||||||
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">
|
<div className="grid md:grid-cols-3 gap-8">
|
||||||
<BlogCardOne
|
{testimonials.map((testimonial, index) => (
|
||||||
blogs={[
|
<div key={index} className="bg-white p-8 rounded-2xl shadow-sm hover:shadow-md transition-shadow">
|
||||||
{
|
<div className="flex items-center mb-4">
|
||||||
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"
|
{[...Array(testimonial.rating)].map((_, i) => (
|
||||||
},
|
<Star key={i} className="w-5 h-5 text-yellow-400 fill-current" />
|
||||||
{
|
))}
|
||||||
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"
|
</div>
|
||||||
},
|
<p className="text-gray-700 mb-6 italic">"{testimonial.content}"</p>
|
||||||
{
|
<div className="flex items-center">
|
||||||
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"
|
<div className="w-12 h-12 bg-gradient-to-r from-blue-400 to-purple-500 rounded-full flex items-center justify-center text-white font-bold mr-4">
|
||||||
},
|
{testimonial.name.charAt(0)}
|
||||||
{
|
</div>
|
||||||
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"
|
<div>
|
||||||
}
|
<div className="font-semibold text-gray-900">{testimonial.name}</div>
|
||||||
]}
|
<div className="text-gray-600 text-sm">{testimonial.role}</div>
|
||||||
title: "Новости автомира", description: "Свежие новости, тест-драйвы и обзоры от экспертов AUTO.RIA", textboxLayout: "default", animationType: "opacity", useInvertedBackground: "invertDefault", carouselMode: "buttons"
|
</div>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div id="contact" data-section="contact">
|
{/* CTA Section */}
|
||||||
<ContactSplit
|
<section className="py-20 px-6 bg-gradient-to-r from-blue-600 to-purple-600">
|
||||||
tag="Связь"
|
<div className="max-w-4xl mx-auto text-center">
|
||||||
title="Продать автомобиль выгодно"
|
<h2 className="text-4xl md:text-5xl font-bold text-white mb-6">
|
||||||
description="Разместите объявление на AUTO.RIA и найдите покупателя быстро. Миллионы пользователей ежедневно ищут автомобили на нашей платформе."
|
Ready to Get Started?
|
||||||
imageSrc="https://cdn3.riastatic.com/photosnew/auto/photo/skoda_octavia__257817988fx.jpg"
|
</h2>
|
||||||
imageAlt="Продажа автомобиля"
|
<p className="text-xl text-blue-100 mb-10 max-w-2xl mx-auto">
|
||||||
inputPlaceholder="Введите ваш email"
|
Join thousands of satisfied customers and transform your business today.
|
||||||
buttonText="Разместить объявление"
|
</p>
|
||||||
termsText="Нажимая кнопку, вы соглашаетесь с условиями использования сервиса AUTO.RIA"
|
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||||
useInvertedBackground="noInvert"
|
<button className="bg-white text-blue-600 px-8 py-4 rounded-full hover:bg-gray-50 transition-colors font-semibold flex items-center justify-center">
|
||||||
/>
|
Start Your Free Trial
|
||||||
</div>
|
<ChevronRight className="ml-2 w-5 h-5" />
|
||||||
|
</button>
|
||||||
|
<button className="border-2 border-white text-white px-8 py-4 rounded-full hover:bg-white hover:text-blue-600 transition-colors">
|
||||||
|
Contact Sales
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
{/* Footer */}
|
||||||
<FooterBase
|
<footer className="bg-gray-900 text-white py-16 px-6">
|
||||||
logoText="AUTO.RIA"
|
<div className="max-w-7xl mx-auto">
|
||||||
columns={[
|
<div className="grid md:grid-cols-4 gap-8 mb-12">
|
||||||
{
|
<div>
|
||||||
title: "Автомобили", items: [
|
<div className="flex items-center space-x-2 mb-6">
|
||||||
{ label: "Легковые", href: "#cars" },
|
<Sparkles className="w-8 h-8 text-blue-400" />
|
||||||
{ label: "Новые авто", href: "#new-cars" },
|
<span className="text-2xl font-bold">WebApp</span>
|
||||||
{ label: "Все для авто", href: "#auto-parts" }
|
</div>
|
||||||
]
|
<p className="text-gray-400 leading-relaxed">
|
||||||
},
|
Building the future of digital experiences with cutting-edge technology.
|
||||||
{
|
</p>
|
||||||
title: "Сервисы", items: [
|
</div>
|
||||||
{ label: "Поддержка 24/7", href: "#support" },
|
<div>
|
||||||
{ label: "Продать авто", href: "#sell" },
|
<h3 className="text-lg font-semibold mb-4">Product</h3>
|
||||||
{ label: "GARAGE AUTO.RIA", href: "#garage" }
|
<ul className="space-y-2 text-gray-400">
|
||||||
]
|
<li><a href="#" className="hover:text-white transition-colors">Features</a></li>
|
||||||
},
|
<li><a href="#" className="hover:text-white transition-colors">Pricing</a></li>
|
||||||
{
|
<li><a href="#" className="hover:text-white transition-colors">Integrations</a></li>
|
||||||
title: "Информация", items: [
|
<li><a href="#" className="hover:text-white transition-colors">API</a></li>
|
||||||
{ label: "О компании", href: "#about" },
|
</ul>
|
||||||
{ label: "Новости", href: "#news" },
|
</div>
|
||||||
{ label: "Контакты", href: "#contact" }
|
<div>
|
||||||
]
|
<h3 className="text-lg font-semibold mb-4">Company</h3>
|
||||||
}
|
<ul className="space-y-2 text-gray-400">
|
||||||
]}
|
<li><a href="#" className="hover:text-white transition-colors">About</a></li>
|
||||||
copyrightText="© 2025 | AUTO.RIA"
|
<li><a href="#" className="hover:text-white transition-colors">Careers</a></li>
|
||||||
/>
|
<li><a href="#" className="hover:text-white transition-colors">Blog</a></li>
|
||||||
</div>
|
<li><a href="#" className="hover:text-white transition-colors">Contact</a></li>
|
||||||
</ThemeProvider>
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 className="text-lg font-semibold mb-4">Support</h3>
|
||||||
|
<ul className="space-y-2 text-gray-400">
|
||||||
|
<li><a href="#" className="hover:text-white transition-colors">Help Center</a></li>
|
||||||
|
<li><a href="#" className="hover:text-white transition-colors">Documentation</a></li>
|
||||||
|
<li><a href="#" className="hover:text-white transition-colors">Status</a></li>
|
||||||
|
<li><a href="#" className="hover:text-white transition-colors">Security</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="border-t border-gray-800 pt-8 flex flex-col md:flex-row items-center justify-between">
|
||||||
|
<p className="text-gray-400">© 2024 WebApp. All rights reserved.</p>
|
||||||
|
<div className="flex space-x-6 mt-4 md:mt-0">
|
||||||
|
<a href="#" className="text-gray-400 hover:text-white transition-colors">Privacy</a>
|
||||||
|
<a href="#" className="text-gray-400 hover:text-white transition-colors">Terms</a>
|
||||||
|
<a href="#" className="text-gray-400 hover:text-white transition-colors">Cookies</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user