forked from
standard.site/standard.site
Standard.site landing page built in Next.js
1import { BlueskyLogo, PdslsLogo, StandardSiteLogo, TangledLogo } from '@/app/components'
2
3export function Footer() {
4 return (
5 <div className="relative flex gap-x-8 lg:gap-x-16 xl:gap-x-24 justify-center border-t border-border bg-base-200 px-8 pt-12 pb-24 sm:py-32">
6 <section className="hidden md:flex shrink-0 w-32"></section>
7
8 <footer className="flex gap-4 flex-col items-center text-center sm:text-left sm:flex-row sm:items-end sm:justify-between w-xl min-w-0">
9 <div className="flex items-center sm:items-start flex-col gap-4 sm:gap-6">
10 <StandardSiteLogo className="size-7 text-base-content" />
11 <div className="flex sm:flex-col gap-1 sm:gap-0">
12 <span className="font-medium text-base tracking-tight text-base-content">
13 Standard.site
14 </span>
15 <span className="font-medium sm:text-sm tracking-tight text-muted-content">
16 © {new Date().getFullYear()}
17 </span>
18 </div>
19 </div>
20
21 <div className="flex flex-col gap-4 items-center sm:items-end sm:gap-8">
22 <div className="order-last sm:order-first w-fit flex justify-end items-center gap-4">
23 <a href="https://bsky.app/profile/standard.site" target="_blank">
24 <BlueskyLogo className="h-5 w-auto text-muted-content hover:text-muted transition-colors" />
25 </a>
26 <a href="https://tangled.org/standard.site" target="_blank">
27 <TangledLogo className="h-5 w-auto text-muted-content hover:text-muted transition-colors" />
28 </a>
29 <a href="https://pdsls.dev/at://did:plc:re3ebnp5v7ffagz6rb6xfei4/com.atproto.lexicon.schema" target="_blank">
30 <PdslsLogo className="h-5 w-auto text-muted-content hover:text-muted transition-colors" />
31 </a>
32 </div>
33 <div className="flex flex-col sm:items-end">
34 <span className="font-medium text-base tracking-tight text-base-content">
35 Built by the community
36 </span>
37 <span className="text-sm tracking-tight text-muted-content">
38 Designed for the ATmosphere
39 </span>
40 </div>
41 </div>
42 </footer>
43
44 <section className="hidden md:flex shrink-0 w-32"></section>
45 </div>
46 )
47}