From f414e820e64df81c3090f7c16e550309727a1d0f Mon Sep 17 00:00:00 2001 From: Eddy Date: Mon, 13 Apr 2026 20:24:00 +0200 Subject: [PATCH] =?UTF-8?q?Fix:=20Rechtes=20Panel=20tats=C3=A4chlich=20kle?= =?UTF-8?q?iner=20schiebbar?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Alle Panels nutzen jetzt feste px-Werte, das letzte Panel bekommt den Restplatz über JS-Berechnung statt CSS 1fr. Dadurch kann der Drag-Handle die Breite tatsächlich reduzieren. Co-Authored-By: Claude Opus 4.6 (1M context) --- src/routes/+page.svelte | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index fdff28e..387a8fd 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -30,12 +30,13 @@ function applyWidths() { if (!gridEl) return; - // 7 Spalten: panel 8px panel 8px panel 8px panel(rest) - // Letztes Panel füllt den verfügbaren Platz - const cols = panelWidths.map((w, i) => { - if (i < panelWidths.length - 1) return `${w}px 8px`; - return `minmax(80px, 1fr)`; - }).join(' '); + const available = gridEl.clientWidth - 24; // 3 Handles × 8px + const total = panelWidths[0] + panelWidths[1] + panelWidths[2] + panelWidths[3]; + + // Letztes Panel bekommt den Restplatz (mindestens 80px) + const lastWidth = Math.max(80, panelWidths[3] + (available - total)); + + const cols = `${panelWidths[0]}px 8px ${panelWidths[1]}px 8px ${panelWidths[2]}px 8px ${lastWidth}px`; gridEl.style.gridTemplateColumns = cols; } @@ -186,7 +187,7 @@ .grid { display: grid; - grid-template-columns: 220px 8px 1fr 8px 1fr 8px 1fr; + grid-template-columns: 220px 8px 1fr 8px 1fr 8px 380px; height: 100%; }