first commit

2026-05-22 18:44:46 -03:00
parent eaea57b7e9
commit 0fb351a3e2
40 changed files with 4746 additions and 71 deletions
@@ -0,0 +1,99 @@
+import { Github, Linkedin, Mail } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
+
+import { rivusLogoSrc } from '../lib/logos';
+import { NAV_SECTIONS } from '../lib/sections';
+
+const SOCIALS = [
+  { Icon: Linkedin, href: 'https://www.linkedin.com', label: 'LinkedIn' },
+  { Icon: Github, href: 'https://github.com', label: 'GitHub' },
+  { Icon: Mail, href: 'mailto:contato@rivuslab.com', label: 'Email' },
+] as const;
+
+export function Footer({ isDark }: { isDark: boolean }) {
+  const { t } = useTranslation();
+  const year = new Date().getFullYear();
+
+  return (
+    <footer className="border-t border-border bg-bg-muted">
+      <div className="container-rl py-14">
+        <div className="grid gap-10 md:grid-cols-[1.4fr_1fr_1fr]">
+          <div>
+            <img
+              src={rivusLogoSrc(isDark)}
+              alt="RivusLab"
+              className="h-9 w-auto"
+              width={160}
+              height={36}
+            />
+            <p className="mt-4 max-w-sm text-sm text-fg-muted leading-relaxed">
+              {t('footer.tagline')}
+            </p>
+
+            <div className="mt-6 flex items-center gap-2">
+              {SOCIALS.map(({ Icon, href, label }) => (
+                <a
+                  key={label}
+                  href={href}
+                  target="_blank"
+                  rel="noreferrer"
+                  aria-label={label}
+                  className="inline-flex h-9 w-9 items-center justify-center rounded-full border border-border bg-bg text-fg-muted transition-colors hover:border-primary hover:text-primary"
+                >
+                  <Icon className="h-4 w-4" />
+                </a>
+              ))}
+            </div>
+          </div>
+
+          <FooterColumn title={t('footer.navigation')}>
+            {NAV_SECTIONS.map((section) => (
+              <li key={section.id}>
+                <a
+                  href={`#${section.id}`}
+                  className="text-sm text-fg-muted transition-colors hover:text-fg"
+                >
+                  {t(section.labelKey)}
+                </a>
+              </li>
+            ))}
+          </FooterColumn>
+
+          <FooterColumn title={t('footer.contact')}>
+            <li>
+              <a
+                href="mailto:contato@rivuslab.com"
+                className="text-sm text-fg-muted transition-colors hover:text-fg"
+              >
+                contato@rivuslab.com
+              </a>
+            </li>
+            <li className="text-sm text-fg-muted">+55 (00) 00000-0000</li>
+          </FooterColumn>
+        </div>
+
+        <div className="mt-12 flex flex-col items-start justify-between gap-3 border-t border-border pt-6 text-xs text-fg-muted md:flex-row md:items-center">
+          <span>© {year} RivusLab. {t('footer.rights')}</span>
+          <span className="font-mono">v0.1.0</span>
+        </div>
+      </div>
+    </footer>
+  );
+}
+
+function FooterColumn({
+  title,
+  children,
+}: {
+  title: string;
+  children: React.ReactNode;
+}) {
+  return (
+    <div>
+      <h4 className="text-xs font-bold uppercase tracking-[0.18em] text-fg">
+        {title}
+      </h4>
+      <ul className="mt-4 space-y-2.5">{children}</ul>
+    </div>
+  );
+}