71 lines
2.8 KiB
TypeScript
71 lines
2.8 KiB
TypeScript
import { Button } from '../../ui/Button';
|
||
import { Link } from 'react-router-dom';
|
||
import { MailIcon } from '../icons/MailIcon';
|
||
import { PhoneIcon } from '../icons/PhoneIcon';
|
||
import { SendIcon } from '../icons/SendIcon';
|
||
import { TelegramIcon } from '../icons/TelegramIcon';
|
||
import { VKIcon } from '../icons/VKIcon';
|
||
import { YouTubeIcon } from '../icons/YoutubeIcon';
|
||
|
||
export function Feedback() {
|
||
return (
|
||
<div className="sm:grid lg:grid-cols-12 sm:grid-cols-2 lg:grid-rows-[repeat(min-content,2)] sm:grid-rows-[repeat(min-content,3)] lg:gap-x-4 sm:gap-x-14 lg:gap-y-[68px] pb-20 pt-[70px]">
|
||
<h2 className="font-medium lg:col-span-7 sm:col-span-full h2 max-lg:mb-6">
|
||
Хотите использовать интерактивные тренажеры в обучении?
|
||
<br />
|
||
<span className="text-gradient">Давайте обсудим детали.</span>
|
||
</h2>
|
||
<Button
|
||
color="primary"
|
||
icon={<SendIcon />}
|
||
className="self-end row-start-2 px-6 py-4 lg:col-span-3 sm:max-lg:mb-20 max-sm:mb-14"
|
||
width="full"
|
||
>
|
||
Оставить заявку
|
||
</Button>
|
||
<div className="space-y-3 lg:col-start-9 lg:col-span-4 sm:col-span-1 sm:col-start-1 max-sm:mb-8">
|
||
<h4 className="mb-1 text-xl font-medium">Свяжитесь с нами</h4>
|
||
<Button
|
||
color="secondary"
|
||
className="py-4"
|
||
width="full"
|
||
icon={<MailIcon />}
|
||
>
|
||
<span className="btn-text opacity-80">Написать</span>
|
||
</Button>
|
||
<Button
|
||
color="secondary"
|
||
className="py-4"
|
||
width="full"
|
||
icon={<PhoneIcon />}
|
||
>
|
||
<span className="btn-text opacity-80">Позвонить</span>
|
||
</Button>
|
||
</div>
|
||
<div className="col-start-2 space-y-4 lg:col-start-9 lg:col-span-4 lg:row-start-2 sm:row-start-3 lg:self-end sm:flex sm:flex-col sm:justify-between">
|
||
<h4 className="font-medium h4">Социальные сети</h4>
|
||
<div className="flex gap-x-2">
|
||
<Link
|
||
to={'https://www.youtube.com/@GRAFFtech'}
|
||
className="p-4 rounded-full opacity-80 border-[#3D425C] border hover:border-[#52587A] transition-all"
|
||
>
|
||
<YouTubeIcon />
|
||
</Link>
|
||
<Link
|
||
to={'https://vk.com/graff.interactive'}
|
||
className="p-4 rounded-full opacity-80 border-[#3D425C] border hover:border-[#52587A] transition-all"
|
||
>
|
||
<VKIcon />
|
||
</Link>
|
||
<Link
|
||
to={'https://t.me/graffestate'}
|
||
className="p-4 rounded-full opacity-80 border-[#3D425C] border hover:border-[#52587A] transition-all"
|
||
>
|
||
<TelegramIcon />
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|