fix: root /downloads button fix, subdomain footer fix

src/app.tsx

@@ -200,21 +200,23 @@ function AppLayout(props: { children: any }) {
       </Show>
 
       <Show when={!isMainSite()}>
-        <div class="bg-base min-h-screen w-full overflow-x-hidden">
+        <div class="bg-base flex min-h-screen w-full flex-col overflow-x-hidden">
           <noscript>
             <div class="bg-yellow text-crust border-text fixed top-0 z-150 w-full border-b-2 p-4 text-center font-semibold">
               JavaScript is disabled. Features will be limited.
             </div>
           </noscript>
-          <ErrorBoundary
-            fallback={(error, reset) => (
-              <ErrorBoundaryFallback error={error} reset={reset} />
-            )}
-          >
-            <Suspense fallback={<TerminalSplash inverse />}>
-              {props.children}
-            </Suspense>
-          </ErrorBoundary>
+          <div class="flex-1">
+            <ErrorBoundary
+              fallback={(error, reset) => (
+                <ErrorBoundaryFallback error={error} reset={reset} />
+              )}
+            >
+              <Suspense fallback={<TerminalSplash inverse />}>
+                {props.children}
+              </Suspense>
+            </ErrorBoundary>
+          </div>
           <SubdomainFooter />
         </div>
       </Show>

src/components/SubdomainFooter.tsx

@@ -1,31 +1,19 @@
-/**
- * Minimal footer for product subdomains — "made with <3 by Mike Freno"
- * linking back to the root domain.
- *
- * Placed in the shared subdomain layout (app.tsx) so every subdomain page
- * gets it automatically. Uses `buildMainSiteUrl()` so the cross-domain link
- * resolves correctly in both dev (path-based localhost) and prod (host-based
- * freno.me).
- */
 import { A } from "@solidjs/router";
 import { buildMainSiteUrl } from "~/lib/site-context";
 
 export default function SubdomainFooter() {
   return (
-    <footer class="border-surface0 border-t py-8">
-      <div class="flex items-center justify-between text-sm">
-        <span class="text-text/60">
-          made with <span class="text-red-400">&lt;3</span> by{" "}
-          <A
-            href={buildMainSiteUrl()}
-            class="text-text/80 hover:text-text underline underline-offset-4 transition-colors"
-          >
-            Mike Freno
-          </A>
-        </span>
+    <footer class="border-surface0 bg-surface0 relative z-10 border-t py-8">
+      <div class="relative flex items-center text-sm">
+        <A
+          href={buildMainSiteUrl()}
+          class="text-text/60 hover:text-text/80 mx-auto text-center underline underline-offset-4 transition-colors"
+        >
+          made with <span class="text-red-400">&lt;3</span>
+        </A>
         <A
           href={buildMainSiteUrl("/downloads")}
-          class="text-text/80 hover:text-text underline underline-offset-4 transition-colors"
+          class="text-text/80 hover:text-text absolute right-4 underline underline-offset-4 transition-colors"
         >
           see more products
         </A>

src/components/ui/Button.tsx

@@ -177,7 +177,12 @@ export default function Button(props: ButtonProps) {
     if (isDisabledOrLoading) {
       return { bg: "var(--color-base)", text: "#ffffff" };
     }
-    return adjustForContrast(local.color || "var(--color-blue)");
+    // When no explicit color is given, fall back to the theme blue
+    // (a dark color whose contrast with white is already fine).  Only
+    // pass a hex string to adjustForContrast — CSS variable values can't
+    // be parsed numerically.
+    if (!local.color) return { bg: "var(--color-blue)", text: "#ffffff" };
+    return adjustForContrast(local.color);
   };
 
   const sizeClasses = () => {

src/routes/downloads.tsx

@@ -107,7 +107,7 @@ function MainDownloadsPage() {
                 </A>
               </h2>
 
-              <div class="flex flex-col gap-8 lg:flex-row lg:justify-around">
+              <div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
                 <div class="flex flex-col items-center gap-3">
                   <span class="text-subtext0 font-mono text-sm">
                     platform: macOS (14.6+)
@@ -159,7 +159,7 @@ function MainDownloadsPage() {
                 </A>
               </h2>
 
-              <div class="flex flex-col gap-8 lg:flex-row lg:justify-around">
+              <div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
                 <div class="flex flex-col items-center gap-3">
                   <span class="text-subtext0 font-mono text-sm">
                     platform: macOS (14.6+)
@@ -209,7 +209,7 @@ function MainDownloadsPage() {
                 </A>
               </h2>
 
-              <div class="flex flex-col gap-8 lg:flex-row lg:justify-around">
+              <div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
                 <div class="flex flex-col items-center gap-3">
                   <span class="text-subtext0 font-mono text-sm">
                     platform: android
@@ -270,7 +270,7 @@ function MainDownloadsPage() {
                 <span class="text-yellow">{">"}</span> {SwAText()}
               </h2>
 
-              <div class="flex flex-col gap-8 lg:flex-row lg:justify-around">
+              <div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
                 <div class="flex flex-col items-center gap-3">
                   <span class="text-subtext0 font-mono text-sm">
                     platform: android