fix(shell): Einklapp-Knopf wurde von der Inhaltsspalte überdeckt

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
This commit is contained in:
dejanandClaude Opus 5 committed 2026-08-29 21:02:47 +02:00
1 parent 7183fad27a
commit 9eec855f57
1 file changed
+6 -1
@@ -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)}