From 4f9cf3b9e8b2bf8cdc2b95f198b137e92c68112e Mon Sep 17 00:00:00 2001
From: Benjamin Admin <benjaminadmin@MacBookPro.fritz.box>
Date: Thu, 5 Mar 2026 14:54:01 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20validation=20step=20buttons=20unreachabl?=
 =?UTF-8?q?e=20=E2=80=94=20reduce=20panel=20height=20+=20sticky=20bar?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The side-by-side panels used calc(100vh - 380px) pushing the Speichern/
Abschliessen buttons below the viewport. Reduced to calc(100vh - 580px)
and made the action bar sticky at the bottom.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 admin-lehrer/components/ocr-pipeline/StepGroundTruth.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/admin-lehrer/components/ocr-pipeline/StepGroundTruth.tsx b/admin-lehrer/components/ocr-pipeline/StepGroundTruth.tsx
index f471d59..0e9f759 100644
--- a/admin-lehrer/components/ocr-pipeline/StepGroundTruth.tsx
+++ b/admin-lehrer/components/ocr-pipeline/StepGroundTruth.tsx
@@ -304,7 +304,7 @@ export function StepGroundTruth({ sessionId, onNext }: StepGroundTruthProps) {
       )}
 
       {/* Side-by-side panels */}
-      <div className="grid grid-cols-2 gap-4" style={{ height: 'calc(100vh - 380px)', minHeight: 400 }}>
+      <div className="grid grid-cols-2 gap-4" style={{ height: 'calc(100vh - 580px)', minHeight: 300 }}>
         {/* Left: Original */}
         <div className="border rounded-lg dark:border-gray-700 overflow-hidden flex flex-col">
           <div className="px-3 py-1.5 bg-gray-50 dark:bg-gray-800 text-sm font-medium text-gray-600 dark:text-gray-400 border-b dark:border-gray-700">
@@ -565,8 +565,8 @@ export function StepGroundTruth({ sessionId, onNext }: StepGroundTruthProps) {
         </div>
       </div>
 
-      {/* Actions */}
-      <div className="flex items-center justify-between">
+      {/* Actions — sticky bottom bar */}
+      <div className="sticky bottom-0 bg-white dark:bg-gray-900 border-t dark:border-gray-700 py-3 px-1 -mx-1 flex items-center justify-between">
         <div className="text-sm text-gray-500 dark:text-gray-400">
           {status === 'saved' && <span className="text-green-600 dark:text-green-400">Validierung gespeichert</span>}
           {status === 'saving' && <span>Speichere...</span>}