Files
geovektor/components/Footer.tsx
Arsen Akhmetzyanov fde9609f9a feat: simplify navigation and add RU/EN home and contacts
- simplify main navigation and hide extra menu items
- make home page more sales-focused with updated hero, benefits and fleet teaser
- add RU/EN handling for home and contacts, including SEO defaults
- integrate basic Strapi homepage API client (no breaking changes)
- update contacts page with messenger buttons and dynamic footer year

Made-with: Cursor
2026-03-13 19:41:07 +05:00

224 lines
10 KiB
TypeScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import React from 'react';
import { Send, MapPin, Mail, Phone } from 'lucide-react';
import { Link, useLocation } from 'react-router-dom';
const Footer: React.FC = () => {
const currentYear = new Date().getFullYear();
const location = useLocation();
const isEnglish = location.pathname.startsWith('/en');
const prefix = isEnglish ? '/en' : '';
return (
<footer className="bg-[#1a0f0f] text-white py-20 rounded-t-[3rem] mt-auto" id="contacts">
<div className="container mx-auto px-6">
<div className="flex flex-col lg:flex-row gap-20">
{/* Contacts Section with Accent */}
<div className="lg:w-1/2">
<h2 className="text-4xl font-bold mb-8 text-brand-orange">
{isEnglish ? 'Get in touch with us' : 'Свяжитесь с нами'}
</h2>
<p className="text-gray-300 text-lg mb-10 max-w-md">
{isEnglish
? 'We are ready to answer your questions and offer the best solutions for your project.'
: 'Готовы ответить на ваши вопросы и предложить лучшие решения для вашего проекта'}
</p>
<div className="space-y-6 max-w-md">
<a
href="tel:83472927370"
className="flex items-start gap-4 p-6 bg-brand-orange/10 border border-brand-orange/30 rounded-2xl hover:bg-brand-orange hover:scale-105 transition-all duration-300 group"
>
<Phone size={28} className="text-brand-orange group-hover:text-white flex-shrink-0" />
<div>
<p className="text-xs text-gray-400 mb-1 group-hover:text-white/80">
{isEnglish ? 'Phone' : 'Телефон'}
</p>
<p className="text-xl font-bold text-white">8 (347) 292 73 70</p>
<p className="text-sm text-gray-400 mt-1 group-hover:text-white/70">
{isEnglish ? 'Call us from 9:00 to 18:00' : 'Звоните с 9:00 до 18:00'}
</p>
</div>
</a>
<a
href="mailto:gw@geowektor.ru"
className="flex items-start gap-4 p-6 bg-brand-orange/10 border border-brand-orange/30 rounded-2xl hover:bg-brand-orange hover:scale-105 transition-all duration-300 group"
>
<Mail size={28} className="text-brand-orange group-hover:text-white flex-shrink-0" />
<div>
<p className="text-xs text-gray-400 mb-1 group-hover:text-white/80">Email</p>
<p className="text-xl font-bold text-white">gw@geowektor.ru</p>
<p className="text-sm text-gray-400 mt-1 group-hover:text-white/70">
{isEnglish ? 'We typically respond within one hour' : 'Ответим в течение часа'}
</p>
</div>
</a>
<div className="flex items-start gap-4 p-6 bg-brand-orange/10 border border-brand-orange/30 rounded-2xl">
<MapPin size={28} className="text-brand-orange flex-shrink-0" />
<div>
<p className="text-xs text-gray-400 mb-1">
{isEnglish ? 'Address' : 'Адрес'}
</p>
<p className="text-lg font-bold text-white">
{isEnglish ? '450001, RB, Ufa' : '450001, РБ, г. Уфа'}
</p>
<p className="text-white/90">
{isEnglish ? '19/1 Komsomolskaya St.' : 'ул. Комсомольская 19/1'}
</p>
</div>
</div>
</div>
</div>
{/* Links & Social Section */}
<div className="lg:w-1/2 grid grid-cols-1 md:grid-cols-3 gap-8">
{/* Основная навигация */}
<div>
<h4 className="font-bold mb-6 text-lg">
{isEnglish ? 'Company' : 'Компания'}
</h4>
<ul className="space-y-3 text-sm text-gray-400">
<li>
<Link to={isEnglish ? '/en' : '/'} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Home' : 'Главная'}
</Link>
</li>
<li>
<Link to={`${prefix}/about`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'About' : 'О компании'}
</Link>
</li>
<li>
<Link to={`${prefix}/projects`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Projects' : 'Проекты'}
</Link>
</li>
<li>
<Link to={`${prefix}/fleet`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Fleet' : 'Автопарк'}
</Link>
</li>
<li>
<Link to={`${prefix}/certificates`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Certificates' : 'Сертификаты'}
</Link>
</li>
<li>
<Link to={`${prefix}/contacts`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Contacts' : 'Контакты'}
</Link>
</li>
</ul>
</div>
{/* Услуги */}
<div>
<h4 className="font-bold mb-6 text-lg">
{isEnglish ? 'Services' : 'Услуги'}
</h4>
<ul className="space-y-3 text-sm text-gray-400">
<li>
<Link to={`${prefix}/services`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'All services' : 'Все услуги'}
</Link>
</li>
<li>
<Link to={`${prefix}/services/surveying`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Engineering surveys' : 'Инженерные изыскания'}
</Link>
</li>
<li>
<Link to={`${prefix}/services/design`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Design' : 'Проектирование'}
</Link>
</li>
<li>
<Link to={`${prefix}/services/construction`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Construction' : 'Строительство'}
</Link>
</li>
<li>
<Link to={`${prefix}/services/soil-survey`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Soil investigation' : 'Обследование грунтов'}
</Link>
</li>
<li>
<Link to={`${prefix}/services/building-survey`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Building survey' : 'Обследование зданий'}
</Link>
</li>
<li>
<Link to={`${prefix}/services/land-survey`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Cadastral works' : 'Кадастровые работы'}
</Link>
</li>
</ul>
</div>
{/* Лаборатории и соцсети */}
<div>
<h4 className="font-bold mb-6 text-lg">
{isEnglish ? 'Laboratories' : 'Лаборатории'}
</h4>
<ul className="space-y-3 text-sm text-gray-400 mb-8">
<li>
<Link to={`${prefix}/laboratories/soil`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Soil testing laboratory' : 'Грунтовая лаборатория'}
</Link>
</li>
<li>
<Link to={`${prefix}/laboratories/radiation`} className="hover:text-brand-orange transition-colors">
{isEnglish ? 'Radiation laboratory' : 'Радиационная лаборатория'}
</Link>
</li>
</ul>
<h4 className="font-bold mb-4 text-lg">
{isEnglish ? 'Find us online' : 'Мы в интернете'}
</h4>
<div className="flex gap-4 mb-8">
<a
href="https://t.me/ooo_geo_wektor"
target="_blank"
rel="noopener noreferrer"
className="w-12 h-12 rounded-full bg-brand-orange flex items-center justify-center text-white cursor-pointer hover:bg-white hover:text-brand-orange transition-all transform hover:scale-110"
title="Telegram"
>
<Send size={22} />
</a>
<a
href="https://vk.com/geowektor_ru"
target="_blank"
rel="noopener noreferrer"
className="w-12 h-12 rounded-full bg-brand-orange flex items-center justify-center text-white cursor-pointer hover:bg-white hover:text-brand-orange transition-all transform hover:scale-110"
title="VK"
>
<div className="font-bold text-sm">Vk</div>
</a>
</div>
<div className="space-y-3 text-sm">
<Link
to={`${prefix}/privacy-policy`}
className="text-gray-400 hover:text-brand-orange transition-colors block"
>
{isEnglish ? 'Privacy policy' : 'Политика конфиденциальности'}
</Link>
</div>
<div className="mt-8 text-xs text-gray-600">
©{currentYear} ООО «ГеоВектор».<br />
{isEnglish ? 'All rights reserved.' : 'Все права защищены.'}
</div>
</div>
</div>
</div>
</div>
</footer>
);
};
export default Footer;