feat: remove nav and simplify footer

apps/web/app/[domain]/layout.tsx

@@ -1,9 +1,8 @@
-import { Footer, Nav, NavMobile } from "@dub/ui";
+import { Footer, Nav } from "@dub/ui";
 
 export default function CustomDomainLayout(props) {
   return (
     <div className="flex min-h-screen flex-col justify-between bg-gray-50">
-      <NavMobile />
       <Nav />
       {props.children}
       <Footer />

apps/web/app/[domain]/page.tsx

@@ -45,7 +45,6 @@ export async function generateStaticParams() {
 export default function CustomDomainPage() {
   return (
     <>
-      <Background />
       <PlaceholderContent />
     </>
   );

apps/web/app/[domain]/placeholder.tsx

@@ -1,93 +1,52 @@
 "use client";
 
-import { InlineSnippet } from "@dub/ui";
-import { STAGGER_CHILD_VARIANTS } from "@dub/utils";
-import Spline from "@splinetool/react-spline";
+import { Logo, InlineSnippet } from "@dub/ui";
+import { Button } from "@react-email/components";
 import va from "@vercel/analytics";
-import { motion } from "framer-motion";
+import Link from "next/link";
 import { useParams } from "next/navigation";
-import { useState } from "react";
-import { useDebounce } from "use-debounce";
 
 export default function PlaceholderContent() {
   const { domain } = useParams() as { domain: string };
-  const [loading, setLoading] = useState(true);
-  const onLoad = () => {
-    setLoading(false);
-  };
-  // workarouond to avoid the blinking effect when Spline loads
-  const [opacity] = useDebounce(loading ? 0 : 1, 200);
-
-  const [showText] = useDebounce(loading ? false : true, 800);
 
   return (
-    <motion.div
-      className="z-10 mb-20"
-      exit={{ opacity: 0, scale: 0.95 }}
-      transition={{ duration: 0.5, type: "spring" }}
-    >
-      <div
-        className={`${
-          loading ? "scale-[25%] blur-md" : "scale-100 blur-0"
-        } mt-[7vh] h-[50vh] w-screen object-cover transition-all duration-1000`}
-      >
-        <Spline
-          onLoad={onLoad}
-          style={{ opacity: opacity }}
-          scene="https://prod.spline.design/cJkq6hsiUPNRHeMf/scene.splinecode"
-        />
+      <div className="flex flex-col justify-center">
+        <div className="mx-auto flex max-w-xs flex-col space-y-10 sm:max-w-lg">
+          <h1 className="font-display text-2xl font-bold">
+            Hey there, this is a Custom Domain from 7QR
+          </h1>
+          <p className="text-sm">
+            The link you clicked may not be working. Please make sure the link
+            you clicked on or typed contains letters or numbers after the
+            forward-slash (“/”).
+          </p>
+          <p className="text-sm">
+            <InlineSnippet>{domain}</InlineSnippet> is a custom domain on{" "}
+            <a
+              className="bg-clip-text font-semibold hover:underline"
+              href="https://7qr.codes"
+              onClick={() =>
+                va.track("Referred from custom domain", {
+                  domain,
+                  medium: "text",
+                })
+              }
+            >
+              7QR
+            </a>{" "}
+            - a great platform to boost your businesses with QR Codes.
+          </p>
+          <p className="text-sm">
+            Want to create your own QR Codes with 7QR?{" "}
+            <a
+              href="https://7qr.codes"
+              className="text-pink-medium font-medium hover:underline"
+            >
+              Click here
+            </a>{" "}
+            to discover how it can help you grow!
+          </p>
+        </div>
       </div>
-      <motion.div
-        variants={{
-          show: {
-            transition: {
-              staggerChildren: 0.3,
-            },
-          },
-        }}
-        initial="hidden"
-        animate={showText ? "show" : "hidden"}
-        className="mx-5 flex flex-col items-center space-y-10 text-center sm:mx-auto"
-      >
-        <motion.h1
-          className="font-display text-4xl font-bold text-gray-800 transition-colors sm:text-5xl"
-          variants={STAGGER_CHILD_VARIANTS}
-        >
-          Welcome to {process.env.NEXT_PUBLIC_APP_NAME}
-        </motion.h1>
-        <motion.p
-          className="max-w-xl text-gray-600 transition-colors sm:text-lg"
-          variants={STAGGER_CHILD_VARIANTS}
-        >
-          <InlineSnippet>{domain}</InlineSnippet> is a custom domain on{" "}
-          <a
-            className="bg-gradient-to-r from-purple-400 to-pink-600 bg-clip-text font-semibold text-transparent decoration-rose-600 hover:underline"
-            href="https://7qr.codes"
-            onClick={() =>
-              va.track("Referred from custom domain", {
-                domain,
-                medium: "text",
-              })
-            }
-          >
-            {process.env.NEXT_PUBLIC_APP_NAME}
-          </a>{" "}
-          - the link management infrastructure for modern marketing teams.
-        </motion.p>
-        <motion.a
-          variants={STAGGER_CHILD_VARIANTS}
-          href="https://7qr.codes"
-          onClick={() =>
-            va.track("Referred from custom domain", {
-              domain,
-              medium: "button",
-            })
-          }
-          className="rounded-full bg-gray-800 px-10 py-2 font-medium text-white transition-colors hover:bg-black"
-        >
-          Create Your Free Branded Link
-        </motion.a>
-      </motion.div>
-    </motion.div>
   );
 }

apps/web/app/admin.dub.co/layout.tsx

@@ -8,7 +8,7 @@ export default async function AdminLayout({
 }) {
   return (
     <>
-      <Background />
+
       <div className="relative z-10 flex h-screen w-screen justify-center">
         {children}
       </div>

apps/web/app/app.dub.co/(auth)/layout.tsx

@@ -6,7 +6,7 @@ export const runtime = "edge";
 export default function AuthLayout({ children }: { children: ReactNode }) {
   return (
     <>
-      <Background />
+
       <div className="relative z-10 flex h-screen w-screen justify-center">
         {children}
       </div>

apps/web/app/app.dub.co/(auth)/welcome/page.tsx

@@ -12,7 +12,7 @@ export const metadata = constructMetadata({
 export default function WelcomePage() {
   return (
     <>
-      <Background />
+
       <Suspense>
         <WelcomePageClient />
       </Suspense>

apps/web/app/banned/page.tsx

@@ -30,7 +30,7 @@ export default async function BannedPage() {
         </a>
       </div>
       <Footer />
-      <Background />
+
     </main>
   );
 }

apps/web/app/expired/page.tsx

@@ -32,7 +32,7 @@ export default async function ExpiredPage() {
         </a>
       </div>
       <Footer />
-      <Background />
+
     </main>
   );
 }

apps/web/app/inspect/[domain]/[key]/page.tsx

@@ -86,7 +86,7 @@ export default async function InspectPage({
           </a>
         </div>
         <Footer />
-        <Background />
+
       </main>
     </>
   );

apps/web/app/password/[domain]/[key]/loading.tsx

@@ -4,7 +4,7 @@ export default function Loading() {
   return (
     <main className="flex h-screen w-screen items-center justify-center">
       <LoadingSpinner />
-      <Background />
+
     </main>
   );
 }

apps/web/app/password/[domain]/[key]/page.tsx

@@ -113,7 +113,7 @@ export default async function PasswordProtectedLinkPage({
 
   return (
     <main className="flex h-screen w-screen items-center justify-center">
-      <Background />
+
       <div className="z-10 w-full max-w-md overflow-hidden rounded-2xl border border-gray-100 shadow-xl">
         <div className="flex flex-col items-center justify-center space-y-3 border-b border-gray-200 bg-white px-4 py-6 pt-8 text-center sm:px-16">
           {!isDubDomain(domain) &&