add window mode

src/app/globals.css

@@ -4,7 +4,7 @@
 
 :root {
   --background: #0F0A1F;
-  --primary: #FFA826;
+  --primary: #F48120;
 }
 
 @keyframes silly-bounce {
@@ -24,4 +24,8 @@ h2 {
 
 ul {
   @apply list-disc ms-8 space-y-4
+}
+
+.border-outset {
+  border-style: outset;
 }

src/app/page.tsx

@@ -2,35 +2,34 @@ import { LandingImage } from "@/components/landing-image";
 import { NolaGlitchClientOnly } from "@/components/nola-glitch";
 import { Sosmed } from "@/components/sosmed";
 import HomeText from "@/components/home-text.mdx"
-import Image from "next/image";
 
 import Link from "next/link";
-import { FloatingLabel } from "@/components/floating-label";
+import { FakeWindow } from "@/components/windows";
 
 export default function Home() {
   return (
     <main className="flex items-center pt-16 md:pt-24 pb-12 px-8 md:px-0">
-      <div className="mx-auto w-[480px]">
-        <header className="text-center mb-8">
-          <h1 className="font-bold text-3xl leading-normal">
-            Nonszy Work<span className="text-[#F48120]">space</span>
-          </h1>
-        </header>
-        <noscript>
-          <LandingImage />
-        </noscript>
-        <NolaGlitchClientOnly />
-        <Sosmed />
-        <article className="space-y-6 leading-relaxed relative">
-          <HomeText />
-        </article>
-        <section className="my-8">
-          <p>⚡ Powered with <Link href="https://www.cloudflare.com/" target="_blank" className="text-[#F48120] underline">Cloudflare</Link> ☁️</p>
-        </section>
-        <footer className="mt-20 text-center">
-          <p>&copy; <span className="text-sm">2024-2025 Nomi Nonsense</span></p>
-        </footer>
-      </div>
+      <FakeWindow windowText="Homepage">
+          <header className="text-center mb-8">
+            <h1 className="font-bold text-3xl leading-normal">
+              Nonszy Work<span className="text-primary">space</span>
+            </h1>
+          </header>
+          <noscript>
+            <LandingImage />
+          </noscript>
+          <NolaGlitchClientOnly />
+          <Sosmed />
+          <article className="space-y-6 leading-relaxed relative">
+            <HomeText />
+          </article>
+          <section className="my-8">
+            <p>⚡ Powered with <Link href="https://www.cloudflare.com/" target="_blank" className="text-primary underline">Cloudflare</Link> ☁️</p>
+          </section>
+          <footer className="mt-20 text-center">
+            <p>&copy; <span className="text-sm">2024-2025 Nomi Nonsense</span></p>
+          </footer>
+      </FakeWindow>
     </main>
   );
 }