From e08e118e00fa0cd0c878ef151abf58afca4f1a76 Mon Sep 17 00:00:00 2001
From: Jake <jake@corbel.consulting>
Date: Fri, 3 Apr 2026 18:42:06 +0100
Subject: [PATCH] =?UTF-8?q?agent:=20fix=20=E2=80=94=20task=20sidebar=20ove?=
 =?UTF-8?q?rlay=20no=20longer=20blocks=20entire=20app?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The full-screen backdrop (fixed inset-0 z-40) was eating all pointer
events, making the app unusable when the task sidebar was open. Replace
with a backdrop that only covers the content area (not titlebar) and
sits beside the sidebar rather than wrapping it.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/routes/+layout.svelte | 23 +++++++----------------
 1 file changed, 7 insertions(+), 16 deletions(-)

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 9f877fa..99d6076 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -216,25 +216,16 @@
 
   <!-- Task sidebar as overlay — doesn't shrink main content -->
   {#if page.taskSidebarOpen && page.current !== "first-run" && !isSecondaryWindow}
+    <!-- Backdrop — below titlebar only, closes sidebar on click -->
     <!-- svelte-ignore a11y_click_events_have_key_events -->
     <!-- svelte-ignore a11y_no_static_element_interactions -->
     <div
-      class="fixed inset-0 z-40"
-      onclick={(e) => { if (e.target === e.currentTarget) page.taskSidebarOpen = false; }}
-    >
-      <!-- Backdrop tint (click this area to close) -->
-      <!-- svelte-ignore a11y_no_static_element_interactions -->
-      <div
-        class="absolute inset-0 bg-black/10"
-        onclick={() => { page.taskSidebarOpen = false; }}
-      ></div>
-      <!-- Sidebar panel (clicks here stay in the sidebar) -->
-      <div
-        class="absolute top-[36px] right-0 bottom-0 w-[280px] z-50 shadow-xl"
-        onclick={(e) => e.stopPropagation()}
-      >
-        <TaskSidebar />
-      </div>
+      class="fixed top-[36px] left-0 right-[280px] bottom-0 z-40"
+      onclick={() => { page.taskSidebarOpen = false; }}
+    ></div>
+    <!-- Sidebar panel -->
+    <div class="fixed top-[36px] right-0 bottom-0 w-[280px] z-50 shadow-xl">
+      <TaskSidebar />
     </div>
   {/if}
 {/if}