From c4c9e56b2c52f44f0fc61be30eb284e11acb53c2 Mon Sep 17 00:00:00 2001
From: karim <karim@gabrielevarano.ch>
Date: Tue, 19 May 2026 00:02:26 +0200
Subject: [PATCH] Beide Ebenen-Panels: Section-Header raus, Action-Buttons in
 Sichtbarkeit-Row
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Der Section-Header mit dem Panel-Namen ("Ebenen" / "Zeichnungsebenen")
war redundant — der Panel-Tab in Rhino hat den Namen schon. Stattdessen
direkt mit der Sichtbarkeit-Dropdown beginnen.

EbenenManager:
- `<Section>`-Wrapper entfernt, Section-Import raus.
- "+"-Button neben der Sichtbarkeit-Dropdown (flex: 1).

GeschossManager:
- Gleich. "+"- und Edit-Buttons (Bleistift) neben der Sichtbarkeit-
  Dropdown.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 src/components/EbenenManager.jsx   | 26 +++++----
 src/components/GeschossManager.jsx | 90 +++++++++++++++---------------
 2 files changed, 58 insertions(+), 58 deletions(-)

diff --git a/src/components/EbenenManager.jsx b/src/components/EbenenManager.jsx
index 7344dc8..c411d9e 100644
--- a/src/components/EbenenManager.jsx
+++ b/src/components/EbenenManager.jsx
@@ -1,5 +1,4 @@
 import { useState, useRef, useMemo, useEffect } from 'react'
-import Section from './Section'
 import Icon from './Icon'
 import ConfirmDeleteEbene from './ConfirmDeleteEbene'
 import ContextMenu from './ContextMenu'
@@ -407,14 +406,8 @@ export default function EbenenManager({
                                                                    disabled: ebenen.length <= 1 },
   ]
 
-  const actionBtns = (
-    <button className="btn-add" onClick={addNew} title="Ebene hinzufügen">
-      <Icon name="add" size={16} />
-    </button>
-  )
-
   return (
-    <Section title="Ebenen" badge={ebenen.length} action={actionBtns}>
+    <>
       {/* Ebenenkombinationen — Label + Dropdown + Save-As-Plus */}
       <div style={{
         display: 'flex', flexDirection: 'column', gap: 4,
@@ -474,9 +467,18 @@ export default function EbenenManager({
         borderBottom: '1px solid var(--border-light)',
       }}>
         <span className="label-xs">Sichtbarkeit</span>
-        <select value={mode} onChange={ev => onModeChange(ev.target.value)} style={{ width: '100%' }}>
-          {MODES.map(m => <option key={m.value} value={m.value}>{m.label}</option>)}
-        </select>
+        <div style={{ display: 'flex', alignItems: 'center', gap: 6 }}>
+          <select
+            value={mode}
+            onChange={ev => onModeChange(ev.target.value)}
+            style={{ flex: 1, minWidth: 0 }}
+          >
+            {MODES.map(m => <option key={m.value} value={m.value}>{m.label}</option>)}
+          </select>
+          <button className="btn-icon-sm" onClick={addNew} title="Ebene hinzufügen">
+            <Icon name="add" size={14} />
+          </button>
+        </div>
       </div>
 
       <div style={{
@@ -582,6 +584,6 @@ export default function EbenenManager({
           />
         )
       })()}
-    </Section>
+    </>
   )
 }
diff --git a/src/components/GeschossManager.jsx b/src/components/GeschossManager.jsx
index a435b23..81a4f93 100644
--- a/src/components/GeschossManager.jsx
+++ b/src/components/GeschossManager.jsx
@@ -1,5 +1,4 @@
 import { useState } from 'react'
-import Section from './Section'
 import Icon from './Icon'
 import GeschossDialog from './GeschossDialog'
 import GeschossSettingsDialog from './GeschossSettingsDialog'
@@ -104,64 +103,63 @@ export default function GeschossManager({
     onChange([...zeichnungsebenen, newZ])
   }
 
-  const actions = (
-    <div style={{ display: 'flex', gap: 6, alignItems: 'center' }}>
-      <button className="btn-add" onClick={addQuick} title="Zeichnungsebene hinzufügen">
-        <Icon name="add" size={16} />
-      </button>
-      <button className="btn-icon-tonal" onClick={() => setDialogOpen(true)} title="Bearbeiten">
-        <Icon name="edit" size={14} />
-      </button>
-    </div>
-  )
-
   const toggleVisible = (id) => {
     onChange(zeichnungsebenen.map(z => z.id === id ? { ...z, visible: !(z.visible !== false) } : z))
   }
 
   return (
     <>
-      <Section title="Zeichnungsebenen" badge={zeichnungsebenen.length} action={actions}>
-        <div style={{
-          display: 'flex', flexDirection: 'column', gap: 4,
-          padding: '6px 14px',
-          background: 'var(--bg-section)',
-          borderBottom: '1px solid var(--border-light)',
-        }}>
-          <span className="label-xs">Sichtbarkeit</span>
-          <select value={mode} onChange={ev => onModeChange(ev.target.value)} style={{ width: '100%' }}>
+      <div style={{
+        display: 'flex', flexDirection: 'column', gap: 4,
+        padding: '6px 14px',
+        background: 'var(--bg-section)',
+        borderBottom: '1px solid var(--border-light)',
+      }}>
+        <span className="label-xs">Sichtbarkeit</span>
+        <div style={{ display: 'flex', alignItems: 'center', gap: 6 }}>
+          <select
+            value={mode}
+            onChange={ev => onModeChange(ev.target.value)}
+            style={{ flex: 1, minWidth: 0 }}
+          >
             {MODES.map(m => (
               <option key={m.value} value={m.value}>{m.label}</option>
             ))}
           </select>
+          <button className="btn-icon-sm" onClick={addQuick} title="Zeichnungsebene hinzufügen">
+            <Icon name="add" size={14} />
+          </button>
+          <button className="btn-icon-sm" onClick={() => setDialogOpen(true)} title="Bearbeiten">
+            <Icon name="edit" size={13} />
+          </button>
         </div>
+      </div>
 
-        <div style={{
-          display: 'flex', justifyContent: 'space-between', alignItems: 'center',
-          padding: '3px 14px',
-          background: 'var(--bg-section)',
-          borderBottom: '1px solid var(--border-light)',
-        }}>
-          <span className="label-xs">Gebäudehöhe</span>
-          <span style={{ fontSize: 11, fontFamily: 'var(--font-mono)', color: 'var(--text-secondary)' }}>
-            {gesamthoehe.toFixed(2)} m
-          </span>
-        </div>
+      <div style={{
+        display: 'flex', justifyContent: 'space-between', alignItems: 'center',
+        padding: '3px 14px',
+        background: 'var(--bg-section)',
+        borderBottom: '1px solid var(--border-light)',
+      }}>
+        <span className="label-xs">Gebäudehöhe</span>
+        <span style={{ fontSize: 11, fontFamily: 'var(--font-mono)', color: 'var(--text-secondary)' }}>
+          {gesamthoehe.toFixed(2)} m
+        </span>
+      </div>
 
-        <div>
-          {sorted.map(z => (
-            <ZeichnungsebeneRow
-              key={z.id}
-              z={z}
-              active={z.id === activeId}
-              mode={mode}
-              onClick={() => onActiveChange(z.id)}
-              onToggleVisible={() => toggleVisible(z.id)}
-              onSettings={() => setSettingsFor(z)}
-            />
-          ))}
-        </div>
-      </Section>
+      <div>
+        {sorted.map(z => (
+          <ZeichnungsebeneRow
+            key={z.id}
+            z={z}
+            active={z.id === activeId}
+            mode={mode}
+            onClick={() => onActiveChange(z.id)}
+            onToggleVisible={() => toggleVisible(z.id)}
+            onSettings={() => setSettingsFor(z)}
+          />
+        ))}
+      </div>
 
       {dialogOpen && (
         <GeschossDialog