feat: add product section components and integrate them into the homepage landing page

2026-07-29 15:50:27 +07:00
parent b43df8f35b
commit db57a22a09
10 changed files with 796 additions and 772 deletions
@@ -0,0 +1,67 @@
+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>
+  );
+}