67 lines
2.2 KiB
TypeScript
67 lines
2.2 KiB
TypeScript
import { Link } from 'react-router-dom';
|
||
import LogoWithTextIcon from '../icons/LogoWithTextIcon';
|
||
|
||
export function Footer() {
|
||
return (
|
||
<footer className="sm:grid xl:grid-cols-[2fr_1fr_1fr] sm:grid-cols-2 sm:max-xl:grid-rows-2">
|
||
<div className="flex sm:items-center max-sm:flex-col sm:px-10 px-4 sm:py-9 py-4 border-t border-[#3D425C] gap-6 sm:max-xl:row-start-1 sm:max-xl:col-span-2">
|
||
<Link to={'/'}>
|
||
<LogoWithTextIcon className="h-[50px]" />
|
||
</Link>
|
||
<div className="flex flex-col gap-y-1">
|
||
<Link
|
||
to="https://graff.tech/privacypolicy"
|
||
className="sm:font-medium flex gap-4 m-text"
|
||
>
|
||
Политика конфиденциальности <span>graff.tech</span>
|
||
</Link>
|
||
<p className="opacity-40 sm:font-medium m-text">
|
||
© 2024 GRAFF interactive. Все права защищены
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div className="px-10 py-[30px] flex items-center border-t xl:border-l sm:border-r border-[#3D425C] flex-1 justify-between sm:max-xl:row-start-2 sm:max-xl:col-start-1">
|
||
<div>
|
||
<Contact type="email" text="info@graff.tech" />
|
||
<Contact type="phone" text="+7 800 770 00 67" />
|
||
</div>
|
||
<div className="font-medium p-[14px] border border-[#3D425C] rounded-full m-text">
|
||
RU
|
||
</div>
|
||
</div>
|
||
<div className="px-10 py-[30px] flex items-center border-t border-[#3D425C] flex-1 justify-between sm:max-xl:row-start-2 sm:max-xl:col-start-2">
|
||
<div>
|
||
<Contact type="email" text="info@graff.tech" />
|
||
<Contact type="phone" text="+971 58 506 0097" />
|
||
</div>
|
||
<div className="font-medium py-[14px] px-[10px] border border-[#3D425C] rounded-full m-text">
|
||
UAE
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
);
|
||
}
|
||
|
||
function Contact({
|
||
text,
|
||
className = '',
|
||
type,
|
||
}: {
|
||
className?: string;
|
||
text: string;
|
||
type: 'email' | 'phone';
|
||
}) {
|
||
return (
|
||
<div>
|
||
<Link
|
||
to={
|
||
type === 'email' ? `mailto:${text}` : `tel:${text.replace(' ', '')}`
|
||
}
|
||
className={'l-text ' + className}
|
||
>
|
||
{text}
|
||
</Link>
|
||
</div>
|
||
);
|
||
}
|