Massstab in 2 Reihen + View-Toggle inaktiv ebenfalls dunkel

User-Wunsch: Massstab-Stack analog Preset-Block. Plus inaktive View-
Toggle-Buttons sollen denselben dunklen Hintergrund haben wie der
Preset-Block.

Massstab:
- Reihe 1 (oben): Buttons (%, fit_screen, center_focus_strong, print/edit)
- Reihe 2 (unten): Live-Zoom-Chip + Massstab-Dropdown (BarCombo statt
  BarSelect — dunklerer bg-input + zusammenhaengender Pill)
- Custom-Input ebenfalls auf bg-input

View-Toggle: inaktive Buttons bg-item → bg-input (konsistent dunkel mit
allen anderen Pills). Aktiv bleibt accent-fill.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
2026-05-20 23:03:02 +02:00
parent 1d1cd10a0b
commit b78a95caaa
+34 -21
View File
@@ -418,7 +418,7 @@ export default function OberleisteApp() {
title={`Ansicht ${v.label}`}
style={{
height: BAR_H, padding: '0 10px',
background: isActive ? 'var(--accent)' : 'var(--bg-item)',
background: isActive ? 'var(--accent)' : 'var(--bg-input)',
color: isActive ? 'var(--bg-panel)' : 'var(--text-primary)',
border: '1px solid var(--border)',
borderLeft: isFirst ? '1px solid var(--border)' : 'none',
@@ -557,8 +557,34 @@ export default function OberleisteApp() {
<div style={sep} />
{/* ====== MASSSTAB ====== */}
{/* Live-Zoom Chip — pill, accent wenn Massstab anwendbar */}
{/* ====== MASSSTAB 2-Reihen ======
Oben: Buttons (%, fit, center, print/edit)
Unten: Live-Zoom-Chip + Dropdown
*/}
<div style={{
display: 'flex', flexDirection: 'column', gap: 4,
flexShrink: 0,
}}>
{/* Reihe 1: Buttons */}
<div style={{ display: 'flex', gap: 4, justifyContent: 'flex-start' }}>
<BarButton icon="percent" onClick={apply100}
disabled={isPerspective || !appliedScale}
title={appliedScale ? `Zoom auf 1:${appliedScale} snappen` : 'Erst einen Massstab wählen'} />
<BarButton icon="fit_screen" onClick={zoomExtents}
title="Auf gesamten Inhalt zoomen" />
<BarButton icon="center_focus_strong" onClick={zoomSelection}
title="Auf Selektion zoomen" />
<BarButton
icon={state.showLineweights ? 'print' : 'edit'}
active={state.showLineweights}
onClick={() => setShowLineweights(!state.showLineweights)}
title={state.showLineweights
? 'Print-View aktiv — klick zum Ausschalten'
: 'Strichstärken anzeigen (Print-View)'}
/>
</div>
{/* Reihe 2: Live-Zoom + Dropdown */}
<div style={{ display: 'flex', gap: 4, alignItems: 'center' }}>
<div style={{
display: 'inline-flex', alignItems: 'center',
height: BAR_H, padding: '0 10px',
@@ -585,7 +611,7 @@ export default function OberleisteApp() {
onBlur={applyDraft}
style={{
height: BAR_H, width: 100,
background: 'var(--bg-item)',
background: 'var(--bg-input)',
color: 'var(--text-primary)',
border: '1px solid var(--border)',
borderRadius: 999,
@@ -596,7 +622,7 @@ export default function OberleisteApp() {
title="Massstab eingeben (Enter = uebernehmen, Esc = abbrechen)"
/>
) : (
<BarSelect
<BarCombo
icon="straighten"
value={dropdownValue}
onChange={(v) => applyDropdown(v)}
@@ -612,23 +638,10 @@ export default function OberleisteApp() {
<option value={String(appliedScale)}>1:{appliedScale}</option>
)}
<option value="__custom__">Eigener</option>
</BarSelect>
</BarCombo>
)}
<BarButton icon="percent" onClick={apply100}
disabled={isPerspective || !appliedScale}
title={appliedScale ? `Zoom auf 1:${appliedScale} snappen` : 'Erst einen Massstab wählen'} />
<BarButton icon="fit_screen" onClick={zoomExtents}
title="Auf gesamten Inhalt zoomen" />
<BarButton icon="center_focus_strong" onClick={zoomSelection}
title="Auf Selektion zoomen" />
<BarButton
icon={state.showLineweights ? 'print' : 'edit'}
active={state.showLineweights}
onClick={() => setShowLineweights(!state.showLineweights)}
title={state.showLineweights
? 'Print-View aktiv — klick zum Ausschalten'
: 'Strichstärken anzeigen (Print-View)'}
/>
</div>
</div>
{/* Snap-Toggles (Ortho/Grid/OSnap) sind in Rhinos eigener Footer-Bar
schon vorhanden — hier rausgenommen um Doppelung zu vermeiden. */}