68 lines
2.1 KiB
TypeScript
68 lines
2.1 KiB
TypeScript
import { useTranslations } from 'next-intl';
|
|
|
|
export function Footer() {
|
|
const t = useTranslations();
|
|
|
|
const footerLinks = [
|
|
{ labelKey: 'Nav.home', href: '#' },
|
|
{ labelKey: 'Nav.solutions', href: '#ecosystem' },
|
|
{ labelKey: 'Nav.industries', href: '#destinations' },
|
|
{ labelKey: 'Nav.pricing', href: '#pricing' },
|
|
{ labelKey: 'Nav.contact', href: '#contact' },
|
|
];
|
|
|
|
const socialLinks = [
|
|
{ icon: 'uil-envelope-alt', href: '#' },
|
|
{ icon: 'uil-phone', href: '#' },
|
|
{ icon: 'uil-youtube', href: '#' },
|
|
];
|
|
|
|
return (
|
|
<footer className="footer">
|
|
<div className="container">
|
|
<div className="footer-top">
|
|
<div className="footer-brand">
|
|
<div className="brand">
|
|
<a href="#">
|
|
<div className="brand-mark">
|
|
<img src="/brand/logo-primary.svg" alt="" />
|
|
</div>
|
|
</a>
|
|
<span className="brand-name" style={{ color: '#fff' }}></span>
|
|
</div>
|
|
<p>{t('Footer.desc')}</p>
|
|
<p className="address">{t('Contact.address')}</p>
|
|
</div>
|
|
<div className="footer-cols">
|
|
<div className="footer-col">
|
|
<h5>{t('Footer.links')}</h5>
|
|
{footerLinks.map((link, i) => (
|
|
<a href={link.href} key={i}>
|
|
{(t as any)(link.labelKey)}
|
|
</a>
|
|
))}
|
|
</div>
|
|
<div className="footer-col">
|
|
<h5>{t('Nav.contact')}</h5>
|
|
<a href="mailto:hello@pintumasuk.id">hello@pintumasuk.id</a>
|
|
<a href="tel:+6281234567890">+62 812-3456-7890</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="footer-bottom">
|
|
<p>
|
|
© <span>{new Date().getFullYear()}</span> {t('Footer.copyright')}
|
|
</p>
|
|
<div className="footer-social">
|
|
{socialLinks.map((social, i) => (
|
|
<a href={social.href} key={i}>
|
|
<i className={`uil ${social.icon}`}></i>
|
|
</a>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|