From 9eec855f5717cbe712d383b1d1729a853405669f Mon Sep 17 00:00:00 2001
From: DeeCee03 <dejan@tool-ctrl.de>
Date: Sat, 29 Aug 2026 21:02:47 +0200
Subject: [PATCH] =?UTF-8?q?fix(shell):=20Einklapp-Knopf=20wurde=20von=20de?=
 =?UTF-8?q?r=20Inhaltsspalte=20=C3=BCberdeckt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Der Knopf ragt bauartbedingt 17 px aus der Seitenleiste in die Inhaltsfläche
hinein. Dort wurde seine rechte Hälfte verdeckt — er sah abgeschnitten aus und
war auf diesem Teil nicht anklickbar.

Nicht abgeschnitten, sondern überdeckt: Gemessen war overflow überall visible,
aber das oberste Element an der Knopfmitte war die Inhaltsspalte. Ursache ist
ein Stapelkontext — 'position: sticky' erzeugt einen eigenen, wodurch das
z-index:40 des Knopfes darin gefangen bleibt. Der Rahmen selbst hatte
z-index:auto, also malte die später im Dokument stehende Inhaltsspalte darüber.

Behoben mit z-50 am Sidebar-Rahmen; die Software setzt an derselben Stelle
ebenfalls z-50. Nachgemessen: Am rechten Rand ist jetzt der Knopf selbst das
oberste Element, und ein Klick genau dort schaltet um.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QPeZNwSeU7qG3RRCwaxEZX
---
 features/dashboard/components/layout/AppShell.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/features/dashboard/components/layout/AppShell.tsx b/features/dashboard/components/layout/AppShell.tsx
index bfddbd0..035084d 100644
--- a/features/dashboard/components/layout/AppShell.tsx
+++ b/features/dashboard/components/layout/AppShell.tsx
@@ -61,7 +61,12 @@ export function AppShell({ children }: { children: React.ReactNode }) {
 
   return (
     <div className="flex min-h-screen w-full bg-neutral-50">
-      <div className="dv-no-print sticky top-0 h-screen flex-none">
+      {/* z-50 ist nötig, nicht dekorativ: `position: sticky` erzeugt einen
+          eigenen Stapelkontext. Ohne z-Wert am Rahmen bleibt das z-index des
+          Einklapp-Knopfes darin gefangen, und die Inhaltsspalte — ein späteres
+          Geschwisterelement — malt über den Teil, der aus der Leiste
+          herausragt. Die Software setzt an derselben Stelle ebenfalls z-50. */}
+      <div className="dv-no-print sticky top-0 z-50 h-screen flex-none">
         <SidebarWithSections
           variant={eingeklappt ? "closed" : "open"}
           onToggleCollapse={() => setEingeklappt((wert) => !wert)}