From d2189541e8459ee6598d4c924f7d72efd10b8f43 Mon Sep 17 00:00:00 2001
From: Richard Roberson <me@richardr.dev>
Date: Sat, 22 Nov 2025 16:32:03 -0700
Subject: [PATCH] fix(tailwind): fix footer layout and tailwind config

- Remove unused `isDev` variable from `Footer.tsx`.
- Add `inline` and `inline-flex` classes to footer elements for improved layout.
- Move custom `xs` breakpoint definition to `theme.extend` in `tailwind.config.ts`.
---
 src/components/Footer.tsx | 7 ++-----
 tailwind.config.ts        | 6 +++---
 2 files changed, 5 insertions(+), 8 deletions(-)

diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 8b0182b..f319e2e 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -2,9 +2,6 @@ import { Popover, PopoverButton, PopoverPanel } from '@headlessui/react'
 import { GithubIcon } from '@/components/icons/Icons'
 import { CodeBlock } from '@/components/CodeBlock'
 
-const isDev = process.env.NEXT_PUBLIC_NODE_ENV !== 'production' || process.env.NODE_ENV == null;
-
-
 export function Footer() {
   return (
     <footer className="m-8 mb-2 text-sm text-muted">
@@ -54,10 +51,10 @@ export function Footer() {
             </a>
           </span>
         </div>
-        <div className='font-medium text-center flex items-center justify-center gap-1'>
+        <div className='font-medium text-center inline-flex truncate items-center justify-center gap-1'>
           <span>This is a demo app (</span>
           <Popover className="relative">
-            <PopoverButton className="font-bold hover:text-foreground transition-colors outline-none">
+            <PopoverButton className="font-bold hover:text-foreground transition-colors outline-none inline">
               self-host
             </PopoverButton>
             <PopoverPanel anchor="top" className="bg-base p-6 rounded-xl shadow-2xl border border-offbase w-[90vw] max-w-3xl z-50 backdrop-blur-md flex flex-col gap-4">
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 5d5c60f..faf6453 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -66,9 +66,9 @@ export default {
           },
         },
       },
-    },
-    screens: {
-      xs: '410px', // custom xs breakpoint
+      screens: {
+        xs: '410px', // custom xs breakpoint
+      },
     },
   },
   plugins: [typography],