47 lines
1.7 KiB
TypeScript
47 lines
1.7 KiB
TypeScript
import { MapPin } from 'lucide-react';
|
||
import Image from 'next/image';
|
||
import '../../src/app/globals.css'
|
||
|
||
import { Button } from '@/shared/shadcn-ui/button';
|
||
|
||
export const HeroSection = () => {
|
||
return (
|
||
<section className='relative'>
|
||
<div className='relative h-[500px] w-full overflow-hidden'>
|
||
<Image
|
||
src='/placeholder.svg?height=500&width=1920'
|
||
alt='Gas Station Network'
|
||
width={1920}
|
||
height={500}
|
||
className='object-cover'
|
||
priority
|
||
/>
|
||
<div className='absolute inset-0 flex items-center bg-gradient-to-r from-black/70 to-black/30'>
|
||
<div className='container mx-auto'>
|
||
<div className='max-w-lg space-y-4 text-white'>
|
||
<div className='flex tracking-in-expand'>
|
||
<h1 className='text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl '>
|
||
Сеть современных заправок в Таджикистане
|
||
</h1>
|
||
</div>
|
||
<p className='text-lg text-gray-200'>
|
||
Качественное топливо, удобное расположение и отличный сервис для
|
||
наших клиентов
|
||
</p>
|
||
<div className='flex gap-4'>
|
||
<Button className='bg-red-600 hover:bg-red-700'>
|
||
Найти заправку <MapPin className='ml-2 h-4 w-4' />
|
||
</Button>
|
||
<Button variant='outline' className='animate-pulse'
|
||
>
|
||
Узнать больше
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
);
|
||
};
|