fix: Onepager — Kacheln-Layout mit gleichen Höhen
- grid-rows-2 für alle 3 Spalten → Höhen exakt synchron - Umsatzerwartung → "Unternehmensentwicklung" mit MA-Spalte integriert - Mitarbeiter-Kachel → "Zielmärkte" (Maschinenbau, Automobil, Zulieferer, Produktion) - Unternehmensentwicklung: 4 Spalten (Jahr, MA, Kunden, ARR) - Linke + rechte Kacheln haben gleiche Höhe wie mittlere Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -474,27 +474,31 @@ export default function ExecutiveSummarySlide({ lang, data }: ExecutiveSummarySl
|
||||
{/* 3-Spalten Layout: schmal | mittel-breit | schmal */}
|
||||
<div className="grid md:grid-cols-[1fr_1.6fr_1fr] gap-3 mb-4">
|
||||
|
||||
{/* Linke Spalte: Mitarbeiter + Markt */}
|
||||
<div className="flex flex-col gap-3">
|
||||
<GlassCard delay={0.5} hover={false} className="p-3 flex-1">
|
||||
<h3 className="text-xs font-bold text-purple-400 uppercase tracking-wider mb-2">{de ? 'Mitarbeiter' : 'Headcount'}</h3>
|
||||
<div className="space-y-1.5 text-xs">
|
||||
{[
|
||||
{ year: '2026', count: '5' },
|
||||
{ year: '2027', count: '10' },
|
||||
{ year: '2028', count: '17' },
|
||||
{ year: '2029', count: '25' },
|
||||
{ year: '2030', count: '35' },
|
||||
].map((r, idx) => (
|
||||
<div key={idx} className="flex justify-between">
|
||||
<span className="text-white/40">{r.year}</span>
|
||||
<span className="text-white/70 font-mono">{r.count}</span>
|
||||
</div>
|
||||
{/* Linke Spalte: Zielmärkte + Markt — Höhe an Mitte angepasst */}
|
||||
<div className="grid grid-rows-2 gap-3">
|
||||
<GlassCard delay={0.5} hover={false} className="p-3">
|
||||
<h3 className="text-xs font-bold text-purple-400 uppercase tracking-wider mb-2">{de ? 'Zielmärkte' : 'Target Markets'}</h3>
|
||||
<div className="space-y-1.5">
|
||||
{(de ? [
|
||||
'Maschinen- & Anlagenbau',
|
||||
'Automobilindustrie',
|
||||
'Zulieferindustrie',
|
||||
'Produzierende Unternehmen',
|
||||
] : [
|
||||
'Machine & Plant Manufacturing',
|
||||
'Automotive Industry',
|
||||
'Supplier Industry',
|
||||
'Manufacturing Companies',
|
||||
]).map((item, idx) => (
|
||||
<p key={idx} className="text-xs text-white/60 pl-3 relative">
|
||||
<span className="absolute left-0 top-1 w-1.5 h-1.5 rounded-full bg-purple-400/60" />
|
||||
{item}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
</GlassCard>
|
||||
|
||||
<GlassCard delay={0.55} hover={false} className="p-3 flex-1">
|
||||
<GlassCard delay={0.55} hover={false} className="p-3">
|
||||
<h3 className="text-xs font-bold text-amber-400 uppercase tracking-wider mb-2">{de ? 'Markt' : 'Market'}</h3>
|
||||
<div className="space-y-1.5 text-xs">
|
||||
<div className="flex justify-between"><span className="text-white/40">TAM</span><span className="text-white/70">{tam ? formatEur(tam.value_eur, lang) : '—'}</span></div>
|
||||
@@ -504,23 +508,24 @@ export default function ExecutiveSummarySlide({ lang, data }: ExecutiveSummarySl
|
||||
</GlassCard>
|
||||
</div>
|
||||
|
||||
{/* Mittlere Spalte: Umsatzerwartung + Wettbewerber */}
|
||||
<div className="flex flex-col gap-3">
|
||||
<GlassCard delay={0.5} hover={false} className="p-3 flex-1">
|
||||
<h3 className="text-xs font-bold text-indigo-400 uppercase tracking-wider mb-2">{de ? 'Umsatzerwartung' : 'Revenue Forecast'}</h3>
|
||||
<div className="grid grid-cols-[1fr_1fr_1fr] gap-x-2 text-[10px] text-white/30 uppercase tracking-wider mb-1.5 border-b border-white/10 pb-1">
|
||||
<span>{de ? 'Jahr' : 'Year'}</span><span className="text-right">{de ? 'Kunden' : 'Customers'}</span><span className="text-right">ARR</span>
|
||||
{/* Mittlere Spalte: Unternehmensentwicklung + Wettbewerber */}
|
||||
<div className="grid grid-rows-2 gap-3">
|
||||
<GlassCard delay={0.5} hover={false} className="p-3">
|
||||
<h3 className="text-xs font-bold text-indigo-400 uppercase tracking-wider mb-2">{de ? 'Unternehmensentwicklung' : 'Company Growth'}</h3>
|
||||
<div className="grid grid-cols-[1fr_1fr_1fr_1fr] gap-x-2 text-[10px] text-white/30 uppercase tracking-wider mb-1.5 border-b border-white/10 pb-1">
|
||||
<span>{de ? 'Jahr' : 'Year'}</span><span className="text-right">MA</span><span className="text-right">{de ? 'Kunden' : 'Customers'}</span><span className="text-right">ARR</span>
|
||||
</div>
|
||||
<div className="space-y-1">
|
||||
{[
|
||||
{ year: '2026', cust: '~30', arr: de ? '~22k EUR' : '~EUR 22k' },
|
||||
{ year: '2027', cust: '~120', arr: de ? '~750k EUR' : '~EUR 750k' },
|
||||
{ year: '2028', cust: '~350', arr: de ? '~2,5 Mio. EUR' : '~EUR 2.5M' },
|
||||
{ year: '2029', cust: '~700', arr: de ? '~5,0 Mio. EUR' : '~EUR 5.0M' },
|
||||
{ year: '2030', cust: '~1.200', arr: de ? '~8,5 Mio. EUR' : '~EUR 8.5M' },
|
||||
{ year: '2026', emp: '5', cust: '~30', arr: de ? '~22k EUR' : '~EUR 22k' },
|
||||
{ year: '2027', emp: '10', cust: '~120', arr: de ? '~750k EUR' : '~EUR 750k' },
|
||||
{ year: '2028', emp: '17', cust: '~350', arr: de ? '~2,5 Mio. EUR' : '~EUR 2.5M' },
|
||||
{ year: '2029', emp: '25', cust: '~700', arr: de ? '~5,0 Mio. EUR' : '~EUR 5.0M' },
|
||||
{ year: '2030', emp: '35', cust: '~1.200', arr: de ? '~8,5 Mio. EUR' : '~EUR 8.5M' },
|
||||
].map((r, idx) => (
|
||||
<div key={idx} className="grid grid-cols-[1fr_1fr_1fr] gap-x-2 text-xs">
|
||||
<div key={idx} className="grid grid-cols-[1fr_1fr_1fr_1fr] gap-x-2 text-xs">
|
||||
<span className="text-white/40">{r.year}</span>
|
||||
<span className="text-right text-white/50">{r.emp}</span>
|
||||
<span className="text-right text-white/50">{r.cust}</span>
|
||||
<span className={`text-right font-mono ${idx >= 3 ? 'text-emerald-300 font-bold' : 'text-white/70'}`}>{r.arr}</span>
|
||||
</div>
|
||||
@@ -556,9 +561,9 @@ export default function ExecutiveSummarySlide({ lang, data }: ExecutiveSummarySl
|
||||
</GlassCard>
|
||||
</div>
|
||||
|
||||
{/* Rechte Spalte: Pricing + Kundenersparnis */}
|
||||
<div className="flex flex-col gap-3">
|
||||
<GlassCard delay={0.6} hover={false} className="p-3 flex-1">
|
||||
{/* Rechte Spalte: Pricing + Kundenersparnis — Höhe an Mitte angepasst */}
|
||||
<div className="grid grid-rows-2 gap-3">
|
||||
<GlassCard delay={0.6} hover={false} className="p-3">
|
||||
<h3 className="text-xs font-bold text-amber-400 uppercase tracking-wider mb-2">{de ? 'Pricing' : 'Pricing'}</h3>
|
||||
<div className="space-y-1.5">
|
||||
{[
|
||||
@@ -575,7 +580,7 @@ export default function ExecutiveSummarySlide({ lang, data }: ExecutiveSummarySl
|
||||
</div>
|
||||
</GlassCard>
|
||||
|
||||
<GlassCard delay={0.65} hover={false} className="p-3 flex-1">
|
||||
<GlassCard delay={0.65} hover={false} className="p-3">
|
||||
<h3 className="text-xs font-bold text-emerald-400 uppercase tracking-wider mb-2">{de ? 'Kundenersparnis' : 'Customer Savings'}</h3>
|
||||
<div className="space-y-1.5 text-xs text-white/60">
|
||||
<div className="flex justify-between"><span>Pentests</span><strong className="text-emerald-300">30k</strong></div>
|
||||
|
||||
Reference in New Issue
Block a user