style: align heights of step 1 selection boxes in wizard
All checks were successful
Staging Build / build (push) Successful in 2m54s

This commit is contained in:
DanielS
2026-08-11 00:41:18 +02:00
parent ea64ce9ef0
commit 4b8dfd5b20

View File

@@ -175,10 +175,10 @@ export function StepCustomer({
</Button> </Button>
</div> </div>
<div className={isAdmin ? 'grid grid-cols-1 lg:grid-cols-2 gap-8 items-start' : 'space-y-6'}> <div className={isAdmin ? 'grid grid-cols-1 lg:grid-cols-2 gap-8 items-stretch' : 'space-y-6'}>
{/* ─── 1. ADMIN PARTNER SELECTION ─── */} {/* ─── 1. ADMIN PARTNER SELECTION ─── */}
{isAdmin && ( {isAdmin && (
<div className="p-5 rounded-2xl bg-white/5 border border-white/10 space-y-4"> <div className="p-5 rounded-2xl bg-white/5 border border-white/10 flex flex-col h-[34rem] overflow-hidden justify-between space-y-4">
<div className="flex items-center justify-between gap-4 flex-wrap"> <div className="flex items-center justify-between gap-4 flex-wrap">
<div> <div>
<Label className="text-white font-bold text-base flex items-center gap-2"> <Label className="text-white font-bold text-base flex items-center gap-2">
@@ -221,7 +221,7 @@ export function StepCustomer({
</div> </div>
{/* Partner Card List */} {/* Partner Card List */}
<div className="space-y-2 max-h-[30rem] overflow-y-auto pr-1"> <div className="space-y-2 flex-1 overflow-y-auto pr-1 min-h-0 py-1">
{/* Reserved Fixed Card: Alle Partner */} {/* Reserved Fixed Card: Alle Partner */}
<div <div
onClick={() => { onClick={() => {
@@ -378,7 +378,7 @@ export function StepCustomer({
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
exit={{ opacity: 0, y: -10 }} exit={{ opacity: 0, y: -10 }}
transition={{ duration: 0.2 }} transition={{ duration: 0.2 }}
className="p-5 rounded-2xl bg-white/5 border border-white/10 space-y-4" className="p-5 rounded-2xl bg-white/5 border border-white/10 flex flex-col h-[34rem] overflow-hidden justify-between space-y-4"
> >
<div className="flex items-center justify-between gap-4 flex-wrap"> <div className="flex items-center justify-between gap-4 flex-wrap">
<div> <div>
@@ -412,7 +412,7 @@ export function StepCustomer({
</Button> </Button>
</div> </div>
) : ( ) : (
<div className="space-y-4"> <div className="space-y-4 flex-1 flex flex-col min-h-0 overflow-hidden justify-between">
{/* Customer Header Controls: Search & Page Size */} {/* Customer Header Controls: Search & Page Size */}
<div className="flex flex-col sm:flex-row gap-3 items-stretch sm:items-center justify-between"> <div className="flex flex-col sm:flex-row gap-3 items-stretch sm:items-center justify-between">
<div className="relative flex-1"> <div className="relative flex-1">
@@ -445,9 +445,9 @@ export function StepCustomer({
Keine passenden Kunden gefunden. Keine passenden Kunden gefunden.
</div> </div>
) : ( ) : (
<> <div className="flex-1 flex flex-col min-h-0 justify-between">
{/* Customer Card List */} {/* Customer Card List */}
<div className="space-y-2 max-h-[30rem] overflow-y-auto pr-1"> <div className="space-y-2 flex-1 overflow-y-auto pr-1 min-h-0 py-1">
{paginatedCustomers.map((customer) => { {paginatedCustomers.map((customer) => {
const isSelected = selectedEndCustomerId === customer.id const isSelected = selectedEndCustomerId === customer.id
@@ -546,7 +546,7 @@ export function StepCustomer({
</Button> </Button>
</div> </div>
</div> </div>
</> </div>
)} )}
</div> </div>
)} )}
@@ -561,7 +561,7 @@ export function StepCustomer({
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
exit={{ opacity: 0, y: -10 }} exit={{ opacity: 0, y: -10 }}
transition={{ duration: 0.2 }} transition={{ duration: 0.2 }}
className="grid grid-cols-1 md:grid-cols-2 gap-4 p-4 rounded-xl bg-white/5 border border-white/10" className="grid grid-cols-1 md:grid-cols-2 gap-4 p-5 rounded-2xl bg-white/5 border border-white/10 h-[34rem] overflow-y-auto content-start"
> >
{( {(
[ [