Arsen Akhmetzyanov
fde9609f9a
- 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
94 lines
4.0 KiB
TypeScript
94 lines
4.0 KiB
TypeScript
import React from 'react';
|
||
import { STATS } from '../constants';
|
||
import { Link, useLocation } from 'react-router-dom';
|
||
|
||
interface HeroProps {
|
||
title?: string;
|
||
subtitle?: string;
|
||
}
|
||
|
||
const Hero: React.FC<HeroProps> = ({ title, subtitle }) => {
|
||
const location = useLocation();
|
||
const isEnglish = location.pathname.startsWith('/en');
|
||
const prefix = isEnglish ? '/en' : '';
|
||
|
||
return (
|
||
<div className="relative w-full min-h-screen bg-brand-dark text-white flex flex-col">
|
||
{/* Background Image Overlay */}
|
||
<div className="absolute inset-0 z-0">
|
||
<img
|
||
src="/media/images/hero/hero-main.png"
|
||
alt="Construction Site"
|
||
className="w-full h-full object-cover opacity-40"
|
||
loading="eager"
|
||
/>
|
||
<div className="absolute inset-0 bg-gradient-to-r from-brand-dark/90 via-brand-dark/50 to-brand-dark/70 animate-gradient" />
|
||
</div>
|
||
|
||
{/* Hero Content */}
|
||
<div className="relative z-10 container mx-auto px-6 flex-grow flex flex-col justify-center py-32 md:py-20">
|
||
<div className="max-w-5xl mx-auto text-center mt-10 md:mt-0">
|
||
<h1 className="text-4xl md:text-5xl lg:text-7xl font-bold leading-tight mb-8">
|
||
{title || (
|
||
<>
|
||
Инженерные изыскания и проектирование
|
||
<br />
|
||
для сложных и ответственных объектов
|
||
</>
|
||
)}
|
||
</h1>
|
||
<p className="text-gray-300 text-lg md:text-xl mb-12 max-w-3xl mx-auto leading-relaxed">
|
||
{subtitle || (
|
||
<>
|
||
ООО «ГеоВектор» — полный комплекс инженерных изысканий и проектных решений
|
||
для девелоперов, промышленных предприятий и госзаказчиков в России и других странах.
|
||
</>
|
||
)}
|
||
</p>
|
||
<div className="flex flex-col sm:flex-row gap-4 justify-center items-center">
|
||
<Link
|
||
to={`${prefix}/contacts`}
|
||
className="inline-flex items-center justify-center bg-brand-orange text-white font-bold py-4 px-8 rounded-xl hover:bg-orange-600 transition-all duration-300 shadow-lg hover:shadow-xl hover:scale-105"
|
||
>
|
||
{isEnglish ? 'Request a project quote' : 'Рассчитать стоимость проекта'}
|
||
</Link>
|
||
<Link
|
||
to={`${prefix}/services`}
|
||
className="inline-flex items-center justify-center bg-white/10 backdrop-blur-sm text-white font-bold py-4 px-8 rounded-xl hover:bg-white/20 transition-all duration-300 border-2 border-white/30"
|
||
>
|
||
{isEnglish ? 'Our services' : 'Наши услуги'}
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Stats */}
|
||
<div className="mt-24 grid grid-cols-1 md:grid-cols-3 gap-8 border-t border-white/10 pt-12 max-w-5xl mx-auto w-full">
|
||
{STATS.map((stat, idx) => {
|
||
const label = isEnglish
|
||
? idx === 0
|
||
? 'For over 10 years we have been helping organisations deliver projects of any complexity.'
|
||
: idx === 1
|
||
? 'More than 20 major companies trust us with their projects.'
|
||
: idx === 2
|
||
? 'Over 30 successfully completed projects in the last 3 years.'
|
||
: stat.label
|
||
: stat.label;
|
||
|
||
return (
|
||
<div key={idx} className="flex flex-col items-center text-center">
|
||
<span className="text-4xl md:text-5xl font-bold text-brand-orange mb-2">
|
||
{stat.value}
|
||
</span>
|
||
<p className="text-gray-400 text-sm md:text-base leading-relaxed">
|
||
{label}
|
||
</p>
|
||
</div>
|
||
);
|
||
})}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default Hero; |