From d29cc29d470d75cf0661ec60ca5087bec5646664 Mon Sep 17 00:00:00 2001
From: Claude <claude@webklar.local>
Date: Sun, 18 Oct 2026 23:14:37 +0000
Subject: [PATCH] =?UTF-8?q?Workers=20P4=20Endpr=C3=BCfung=20W6:=20?=
 =?UTF-8?q?=E2=80=9ESchlie=C3=9Fen=E2=80=9C=20im=20Interessenten-Panel=20i?=
 =?UTF-8?q?st=20am=20Handy=2040=20px=20hoch?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Die gemeinsame Regel `.dialog-foot .btn` (32 px) gilt für rund 22 Dialoge der Seite und bleibt unberührt.
Das Panel gibt seinem Knopf die Klasse wk-prospect-close; im Handy-Block von workers.css hebt
`.wk-prospect-close.btn[type="button"]` (Spezifität 0,3,0 gegen 0,2,0, beginnt mit einer wk-Klasse wie
workersCss.test.mjs es verlangt) ihn auf volle Breite und 40 px. Der Desktop behält 32 px.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 src/components/workers/ProspectPanel.jsx |  2 +-
 src/styles/workers.css                   |  4 ++++
 tests/unit/workersProspect.test.mjs      | 17 +++++++++++++++++
 3 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/components/workers/ProspectPanel.jsx b/src/components/workers/ProspectPanel.jsx
index 8c4dc26..af35661 100644
--- a/src/components/workers/ProspectPanel.jsx
+++ b/src/components/workers/ProspectPanel.jsx
@@ -123,7 +123,7 @@ export default function ProspectPanel({ api, prospectId, onClose }) {
       title={view ? view.title : 'Interessent'}
       onClose={onClose}
       wide
-      footer={<Button type="button" onClick={onClose}>Schließen</Button>}
+      footer={<Button type="button" className="wk-prospect-close" onClick={onClose}>Schließen</Button>}
     >
       {body}
     </Dialog>
diff --git a/src/styles/workers.css b/src/styles/workers.css
index e0eea8e..ea31938 100644
--- a/src/styles/workers.css
+++ b/src/styles/workers.css
@@ -259,6 +259,10 @@
   /* Hauptknopf oben, „Abbrechen“ darunter */
   .wk-pult-panel-btns { flex-direction: column-reverse; align-items: stretch; }
   .wk-pult-panel-foot .btn { width: 100%; min-height: 40px; justify-content: center; text-align: center; }
+  /* „Schließen“ im Fuß des Interessenten-Panels: `.dialog-foot .btn` (global.css, 32 px) gilt für alle Dialoge und bleibt; hier nur der eigene Knopf auf 40 px.
+     Der Dialog hängt nicht unter einer wk-Klasse, die Regel beginnt deshalb mit der Klasse des Knopfs. Mit (0,3,0) (Klasse, Klasse, Attribut) gewinnt sie
+     gegen (0,2,0), gleich in welcher Reihenfolge die Dateien geladen werden. */
+  .wk-prospect-close.btn[type="button"] { width: 100%; min-height: 40px; justify-content: center; }
 }
 
 /* ---------- Weniger Bewegung ---------- */
diff --git a/tests/unit/workersProspect.test.mjs b/tests/unit/workersProspect.test.mjs
index 9f93f8a..726caf2 100644
--- a/tests/unit/workersProspect.test.mjs
+++ b/tests/unit/workersProspect.test.mjs
@@ -430,3 +430,20 @@ test('CSS: wk-pult-text bricht Zeilen wie im Text (pre-wrap) und lange Wörter u
   const jsx = read('src/components/workers/ProspectPanel.jsx')
   for (const m of jsx.matchAll(/(?<![\w-])wk-[a-z0-9-]+/g)) assert.ok(css.includes('.' + m[0]), m[0])
 })
+
+// Endprüfung P4 (W6): „Schließen“ im Fuß des Panels ist am Handy mindestens 40 px hoch. Die gemeinsame Regel `.dialog-foot .btn` (32 px) bleibt für die
+// übrigen Dialoge unverändert; die Hustler-Seite hebt nur ihren eigenen Knopf an (Klasse wk-prospect-close, Spezifität (0,3,0) gegen (0,2,0); die Regel
+// beginnt mit einer wk-Klasse, wie workersCss.test.mjs es für jede Regel dieser Datei verlangt).
+test('ProspectPanel (W6): der Schließen-Knopf trägt wk-prospect-close; die Handy-Regel macht ihn 40 px hoch, die Dialog-Regel bleibt unverändert', () => {
+  const jsx = read('src/components/workers/ProspectPanel.jsx')
+  assert.match(jsx, /<Button type="button" className="wk-prospect-close" onClick=\{onClose\}>Schließen<\/Button>/)
+  const css = read('src/styles/workers.css').replace(/\/\*[\s\S]*?\*\//g, '')
+  const phone = css.slice(css.indexOf('@media (max-width: 860px)'), css.indexOf('@media (prefers-reduced-motion'))
+  const rule = phone.match(/\.wk-prospect-close\.btn\[type="button"\]\s*\{([^}]*)\}/)?.[1] ?? ''
+  assert.match(rule, /min-height:\s*40px/); assert.match(rule, /width:\s*100%/)
+  // nirgends außerhalb des Handy-Blocks (der Desktop behält 32 px) und keine Änderung an der gemeinsamen Regel
+  assert.equal((css.match(/wk-prospect-close/g) ?? []).length, 1)
+  assert.doesNotMatch(css, /(^|\})\s*\.dialog-foot \.btn\s*\{/)
+  const global = read('src/styles/global.css')
+  assert.match(global, /\.dialog-foot \.btn\s*\{[^}]*min-height:\s*32px/)
+})