forked from
joebasser.com/atmosphere-account
this repo has no description
1import { useT } from "../i18n/mod.ts";
2import LocaleSwitcher from "./LocaleSwitcher.tsx";
3
4interface FooterProps {
5 /**
6 * Compact footer for the explore section: drops the marketing
7 * tagline and the closing pull-quote (those belong on the homepage)
8 * but keeps the logo, link rail, locale switcher, and back-to-top
9 * affordance so the page still has a proper foot.
10 */
11 variant?: "default" | "compact";
12}
13
14export default function Footer({ variant = "default" }: FooterProps = {}) {
15 const t = useT();
16 const compact = variant === "compact";
17 return (
18 <footer class="footer reveal">
19 <div class="container text-center">
20 <img
21 src="/union.svg"
22 alt={t.footer.logoAlt}
23 width="40"
24 height="40"
25 class="footer-logo"
26 style={{
27 margin: "0 auto 1.5rem",
28 opacity: 0.55,
29 filter:
30 "brightness(0) saturate(100%) invert(12%) sepia(30%) saturate(1500%) hue-rotate(195deg) brightness(95%)",
31 }}
32 />
33 {!compact && <p class="text-subsection mb-3">{t.footer.tagline}</p>}
34 <div class="footer-links">
35 <a
36 href="https://atproto.com"
37 target="_blank"
38 rel="noopener noreferrer"
39 >
40 {t.footer.links.atProtocol}
41 </a>
42 {
43 /* Hide on the explore section — visitors are already there,
44 * so the link would just point at the page they're on. */
45 }
46 {!compact && <a href="/explore">{t.footer.links.exploreApps}</a>}
47 <a href="/developer-resources">{t.footer.links.developerResources}</a>
48 </div>
49 {!compact && <p class="footer-quote">{t.footer.quote()}</p>}
50 <a href="#page-top" class="back-to-top mt-4">
51 <svg
52 width="18"
53 height="18"
54 viewBox="0 0 24 24"
55 fill="none"
56 stroke="currentColor"
57 stroke-width="2"
58 stroke-linecap="round"
59 stroke-linejoin="round"
60 aria-hidden="true"
61 >
62 <path d="M18 15l-6-6-6 6" />
63 </svg>
64 {t.footer.backToTop}
65 </a>
66 <LocaleSwitcher />
67 </div>
68 </footer>
69 );
70}