Initial commit: fristy.net personal site

app/page.tsx

@@ -0,0 +1,68 @@
+import { ContactSection } from "@/components/contact-section";
+import { DiscordCard } from "@/components/discord-card";
+import { ProjectsSection } from "@/components/projects-section";
+import { SectionHeading } from "@/components/section-heading";
+import { SiteFooter } from "@/components/site-footer";
+import { SiteHeader } from "@/components/site-header";
+import { getRepos } from "@/lib/gitea";
+import { getDictionary } from "@/lib/i18n/get-dictionary";
+import { getLocale } from "@/lib/i18n/get-locale";
+import { DISCORD_ID, discordProfileUrl, getLanyard } from "@/lib/lanyard";
+
+export default async function Home() {
+    const locale = await getLocale();
+    const dict = getDictionary(locale);
+    const [repos, presence] = await Promise.all([getRepos(), getLanyard()]);
+
+    return (
+        <div id="top" className="flex min-h-full flex-1 flex-col">
+            <SiteHeader dict={dict.nav} locale={locale} />
+            <main className="mx-auto flex w-full max-w-4xl flex-1 flex-col gap-20 px-5 py-14">
+                <section className="pt-6 text-center sm:pt-10">
+                    <p className="font-mono text-sm text-blurple-soft">{dict.hero.greeting}</p>
+                    <h1 className="mt-2 bg-[linear-gradient(to_right,#7ee7d8,#7ccbff,#7f8cff,#b56dff,#f38ad8)] bg-clip-text text-6xl font-black tracking-tight text-transparent sm:text-7xl">
+                        fristy
+                    </h1>
+                    <p className="mx-auto mt-5 max-w-xl text-zinc-400">{dict.hero.tagline}</p>
+                    <div className="mt-8 flex flex-wrap items-center justify-center gap-3">
+                        <a
+                            href="#projects"
+                            className="rounded-full bg-blurple px-6 py-3 text-sm font-semibold text-white transition-colors hover:bg-blurple-soft hover:text-void"
+                        >
+                            {dict.hero.ctaProjects}
+                        </a>
+                        <a
+                            href="#contact"
+                            className="rounded-full border border-white/15 px-6 py-3 text-sm text-zinc-300 transition-colors hover:border-blurple hover:text-white"
+                        >
+                            {dict.hero.ctaContact}
+                        </a>
+                    </div>
+                </section>
+
+                <section id="discord" className="scroll-mt-24">
+                    <SectionHeading
+                        kicker="lanyard"
+                        title={dict.discord.title}
+                        action={
+                            <a
+                                href={discordProfileUrl(DISCORD_ID)}
+                                target="_blank"
+                                rel="noopener noreferrer"
+                                className="text-sm font-medium text-blurple-soft transition-colors hover:text-white"
+                            >
+                                {dict.discord.profile} →
+                            </a>
+                        }
+                    />
+                    <DiscordCard initial={presence} dict={dict.discord} />
+                </section>
+
+                <ProjectsSection repos={repos} dict={dict.projects} locale={locale} />
+
+                <ContactSection dict={dict.contact} />
+            </main>
+            <SiteFooter dict={dict.footer} />
+        </div>
+    );
+}