Daniel/webshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(wizard): unify and minimize top spacing across steps 1-4
All checks were successful
Staging Build / build (push) Successful in 3m8s
Details

Browse Source
This commit is contained in:
DanielS
2026-09-08 00:20:46 +02:00
parent e78fe7c4b8
commit 05cf32591f
3 changed files with 30 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
shop/components/wizard/step-summary.tsx
View File

@@ -103,32 +103,32 @@ export function StepSummary({
return (
<Card className="glass-dark border-white/10 h-[calc(100vh-8.5rem)] flex flex-col justify-between overflow-hidden relative">
{/* ─── 1. FIXED HEADER (shrink-0) ─── */}
<CardHeader className="pb-3 pt-4 px-6 shrink-0 border-b border-white/10 bg-slate-950/40 space-y-0">
<CardHeader className="py-2.5 px-4 shrink-0 border-b border-white/10 bg-slate-950/40 space-y-0">
<div className="flex items-center justify-between gap-3">
<div className="flex items-center gap-3">
<div className="w-10 h-10 bg-primary/20 rounded-xl flex items-center justify-center border border-primary/40 shrink-0 text-primary">
<ShieldCheck className="w-5 h-5" />
<div className="flex items-center gap-2.5">
<div className="w-8 h-8 bg-primary/20 rounded-lg flex items-center justify-center border border-primary/40 shrink-0 text-primary">
<ShieldCheck className="w-4 h-4" />
</div>
<div>
<CardTitle className="text-xl font-bold text-white flex items-center gap-2">
<CardTitle className="text-lg font-bold text-white flex items-center gap-2">
Anfrage prüfen & absenden
</CardTitle>
<CardDescription className="text-xs text-slate-300 mt-0.5">
<CardDescription className="text-[11px] text-slate-300 mt-0.5">
Überprüfen Sie alle konfigurierten Kassen, Positionen und Konditionen vor der Freigabe.
</CardDescription>
</div>
</div>
<Badge variant="outline" className="border-primary/30 text-primary bg-primary/10 text-xs px-3 py-1">
<Badge variant="outline" className="border-primary/30 text-primary bg-primary/10 text-xs px-2.5 py-0.5">
Schritt 4 von 4
</Badge>
</div>
</CardHeader>
{/* ─── 2. SCROLLABLE MIDDLE (flex-1 min-h-0 overflow-y-auto) ─── */}
<div className="flex-1 min-h-0 overflow-y-auto p-6 scrollbar-thin scrollbar-thumb-slate-800 scrollbar-track-transparent">
<div className="grid grid-cols-1 lg:grid-cols-12 gap-6 max-w-7xl mx-auto w-full items-start">
<div className="flex-1 min-h-0 overflow-y-auto p-4 scrollbar-thin scrollbar-thumb-slate-800 scrollbar-track-transparent">
<div className="grid grid-cols-1 lg:grid-cols-12 gap-4 max-w-7xl mx-auto w-full items-start">
{/* ─── LINKES RASTER (lg:col-span-7) – Auftragsübersicht & Kassen ─── */}
<div className="lg:col-span-7 space-y-5">
<div className="lg:col-span-7 space-y-4">
{/* Kopf-Card: Endkunde & Abrechnungsmodell */}
<div className="p-4 rounded-2xl bg-white/5 border border-white/10 space-y-3">
<div className="flex items-center justify-between gap-2 border-b border-white/5 pb-2.5 flex-wrap">