From d941a592d08ee54a177281f9abb12c4101981ebb Mon Sep 17 00:00:00 2001
From: Ethan Graf <ethan@Beacon.local>
Date: Thu, 7 May 2026 22:58:30 -0400
Subject: [PATCH] Refactor bottom bar

---
 src/App.tsx                    |  2 +-
 src/tiling/WorkspaceTiling.tsx | 46 ++++++++++++++++++----------------
 2 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index ab4b580..e818cb5 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -44,7 +44,7 @@ export default function App() {
             }
           />
           <div
-            className="flex min-h-0 flex-1"
+            className="flex min-h-0 flex-1 pb-12"
             style={{
               // Reserve the window’s title bar row; custom chrome is `position: fixed` in that region.
               marginTop:
diff --git a/src/tiling/WorkspaceTiling.tsx b/src/tiling/WorkspaceTiling.tsx
index 0e92fe4..81ad66d 100644
--- a/src/tiling/WorkspaceTiling.tsx
+++ b/src/tiling/WorkspaceTiling.tsx
@@ -185,31 +185,33 @@ export function WorkspaceTiling({ initialNote }: WorkspaceTilingProps) {
   };
 
   return (
-    <div className="flex h-full min-h-0 w-full flex-col">
-      <div className="min-h-0 flex-1 overflow-hidden p-2">
+    <>
+      <div className="h-full min-h-0 w-full overflow-hidden p-2">
         {renderNode(tree)}
       </div>
-      <div className="border-border bg-background/90 flex h-10 shrink-0 items-center gap-2 border-t px-2">
-        <button
-          type="button"
-          onClick={() => applySplit('row')}
-          data-command-id={commandIds.splitRight}
-          className="border-border bg-background text-foreground hover:bg-border/30 rounded border px-2 py-1 text-xs"
-        >
-          Split Right
-        </button>
-        <button
-          type="button"
-          onClick={() => applySplit('column')}
-          data-command-id={commandIds.splitDown}
-          className="border-border bg-background text-foreground hover:bg-border/30 rounded border px-2 py-1 text-xs"
-        >
-          Split Down
-        </button>
-        <div className="text-foreground/60 ml-2 text-xs">
-          Active: {activeTileId}
+      <div className="border-border bg-background/90 fixed right-0 bottom-0 left-0 z-30 flex h-12 items-center border-t">
+        <div className="flex min-w-0 flex-1 items-center gap-2 px-2">
+          <button
+            type="button"
+            onClick={() => applySplit('row')}
+            data-command-id={commandIds.splitRight}
+            className="border-border bg-background text-foreground hover:bg-border/30 rounded border px-2 py-1 text-xs"
+          >
+            Split Right
+          </button>
+          <button
+            type="button"
+            onClick={() => applySplit('column')}
+            data-command-id={commandIds.splitDown}
+            className="border-border bg-background text-foreground hover:bg-border/30 rounded border px-2 py-1 text-xs"
+          >
+            Split Down
+          </button>
+          <div className="text-foreground/60 ml-2 text-xs">
+            Active: {activeTileId}
+          </div>
         </div>
       </div>
-    </div>
+    </>
   );
 }
-- 
2.51.2