Initial commit: coming soon one-pager

app/globals.css

@@ -0,0 +1,79 @@
+:root {
+    --color-void: #060913;
+    --color-panel: #0c1222;
+    --color-blurple: #5865f2;
+    --color-blurple-soft: #8891ff;
+}
+
+* {
+    box-sizing: border-box;
+}
+
+html,
+body {
+    margin: 0;
+    padding: 0;
+}
+
+body {
+    background: var(--color-void);
+    color: #e8ecf6;
+    font-family: var(--font-cascadia), ui-monospace, SFMono-Regular, Menlo, monospace;
+    min-height: 100vh;
+}
+
+.stage {
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 2rem;
+}
+
+.hero {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 1rem;
+    text-align: center;
+}
+
+.kicker {
+    margin: 0;
+    font-size: 0.875rem;
+    color: var(--color-blurple-soft);
+}
+
+.title {
+    margin: 0;
+    font-size: clamp(3rem, 10vw, 5rem);
+    font-weight: 700;
+    letter-spacing: -0.05em;
+}
+
+.accent {
+    color: var(--color-blurple);
+}
+
+.sub {
+    margin: 0;
+    color: #a1a1aa;
+}
+
+.foot {
+    margin: 0;
+    padding-bottom: 1rem;
+    font-size: 0.875rem;
+    color: #71717a;
+}
+
+.foot a {
+    color: var(--color-blurple-soft);
+    text-decoration: none;
+}
+
+.foot a:hover {
+    color: #fff;
+}

app/layout.tsx

@@ -0,0 +1,22 @@
+import type { Metadata } from "next";
+import { Cascadia_Mono } from "next/font/google";
+import "./globals.css";
+
+const cascadiaCode = Cascadia_Mono({
+    variable: "--font-cascadia",
+    subsets: ["latin"],
+});
+
+export const metadata: Metadata = {
+    metadataBase: new URL("https://fristy.net"),
+    title: "fristy.net — coming soon",
+    description: "Something is brewing at fristy.net.",
+};
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+    return (
+        <html lang="en">
+            <body className={cascadiaCode.variable}>{children}</body>
+        </html>
+    );
+}

app/page.tsx

@@ -0,0 +1,20 @@
+export default function Home() {
+    const siteName = process.env.SITE_NAME ?? "fristy.net";
+    return (
+        <main className="stage">
+            <div className="hero">
+                <p className="kicker">{`// ${siteName}`}</p>
+                <h1 className="title">
+                    coming <span className="accent">soon</span>
+                </h1>
+                <p className="sub">Something is brewing. Check back later.</p>
+            </div>
+            <footer className="foot">
+                made by{" "}
+                <a href="https://fristy.dev" target="_blank" rel="noopener noreferrer">
+                    fristy
+                </a>
+            </footer>
+        </main>
+    );
+}