From 1eaef8b6abdf6ff30ad5b2e7772e008112719f15 Mon Sep 17 00:00:00 2001
From: hobokenchicken <dustin@dustin.coffee>
Date: Sat, 6 Jun 2026 11:41:19 -0400
Subject: [PATCH] ui: remove bottom bar, make date/time more prominent

Date/time: text-sm, font-semibold, full opacity plum color.
Removed status bar (kira's here for you, reconnecting, etc).
Grid rows: auto_1fr (no bottom row).
---
 frontend/src/App.tsx | 20 +++-----------------
 1 file changed, 3 insertions(+), 17 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 4a3487e..1e8d34a 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -116,7 +116,7 @@ export default function App() {
 
       <Particles type={currentScene.particles ?? 'none'} />
       <div className="relative z-20 h-full p-4">
-        <div className="h-full grid grid-rows-[auto_1fr_auto] grid-cols-[288px_1fr_256px] rounded-2xl overflow-hidden">
+        <div className="h-full grid grid-rows-[auto_1fr] grid-cols-[288px_1fr_256px] rounded-2xl overflow-hidden">
 
           {/* ── Top bar: scene selector + clock ── */}
           <div className="col-span-3 flex items-center justify-between px-5 py-3 shrink-0 bg-white/40 backdrop-blur-xl">
@@ -130,7 +130,7 @@ export default function App() {
               ))}
             </div>
             <div className="flex items-center gap-4">
-              <span className="text-kira-plum/30 text-xs font-medium">
+              <span className="text-kira-plum text-sm font-semibold tracking-wide">
                 {new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })} &middot; {new Date().toLocaleDateString([], { weekday: 'short', month: 'short', day: 'numeric' })}
               </span>
               <span className="text-xs text-kira-plum/20">🌸 body double</span>
@@ -170,21 +170,7 @@ export default function App() {
             </div>
           </div>
 
-          {/* ── Bottom status bar ── */}
-          <div className="col-span-3 shrink-0 px-5 py-2 flex items-center justify-between text-[11px] text-kira-plum/30 bg-white/40 backdrop-blur-xl">
-            <div className="flex items-center gap-2">
-              <span className={`w-1.5 h-1.5 rounded-full ${
-                isRecording ? 'bg-red-400 animate-pulse'
-                : isKiraSpeaking ? 'bg-kira-pink animate-pulse'
-                : 'bg-kira-mint'
-              }`} />
-              {isRecording ? 'listening...' : isKiraSpeaking ? 'kira speaking...' : `kira's here for you, ${userName}`}
-            </div>
-            <div className="flex items-center gap-2">
-              <span className={isConnected ? '' : 'text-red-300'}>{isConnected ? '' : 'reconnecting...'}</span>
-              <span>💖</span>
-            </div>
-          </div>
+          {/* ── Bottom bar (removed) ── */}
 
         </div>
       </div>