fix(pitch-deck): fix JSX syntax error in USPSlide corner cards
All checks were successful
Build pitch-deck / build-push-deploy (push) Successful in 1m3s
CI / go-lint (push) Has been skipped
CI / python-lint (push) Has been skipped
CI / nodejs-lint (push) Has been skipped
CI / test-go-consent (push) Successful in 30s
CI / test-python-voice (push) Successful in 29s
CI / test-bqas (push) Successful in 27s

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
2026-04-15 13:14:03 +02:00
parent adf3bf8301
commit 40d2342086

View File

@@ -146,51 +146,24 @@ export default function USPSlide({ lang }: USPSlideProps) {
</div>
{/* Outer capability cards — 4 corners */}
{/* Top Left */}
<div className="absolute top-0 left-0 w-[180px]">
<div className={`border ${outerCapabilities[0].border} ${outerCapabilities[0].bg} rounded-xl p-3`}>
<div className="flex items-center gap-1.5 mb-1">
<outerCapabilities[0].icon className={`w-3.5 h-3.5 ${outerCapabilities[0].color}`} />
<span className={`text-[11px] font-bold ${outerCapabilities[0].color}`}>{outerCapabilities[0].label}</span>
{outerCapabilities.map((cap, idx) => {
const Icon = cap.icon
const posClass = idx === 0 ? 'top-0 left-0'
: idx === 1 ? 'top-0 right-0'
: idx === 2 ? 'bottom-0 left-0'
: 'bottom-0 right-0'
return (
<div key={idx} className={`absolute ${posClass} w-[180px]`}>
<div className={`border ${cap.border} ${cap.bg} rounded-xl p-3`}>
<div className="flex items-center gap-1.5 mb-1">
<Icon className={`w-3.5 h-3.5 ${cap.color}`} />
<span className={`text-[11px] font-bold ${cap.color}`}>{cap.label}</span>
</div>
<p className="text-[10px] text-white/40 leading-tight">{cap.desc}</p>
</div>
</div>
<p className="text-[10px] text-white/40 leading-tight">{outerCapabilities[0].desc}</p>
</div>
{/* Connector line */}
<div className="absolute bottom-0 right-0 w-8 h-8 border-b border-r border-white/10 rounded-br-xl translate-x-4 translate-y-4" />
</div>
{/* Top Right */}
<div className="absolute top-0 right-0 w-[180px]">
<div className={`border ${outerCapabilities[1].border} ${outerCapabilities[1].bg} rounded-xl p-3`}>
<div className="flex items-center gap-1.5 mb-1">
<outerCapabilities[1].icon className={`w-3.5 h-3.5 ${outerCapabilities[1].color}`} />
<span className={`text-[11px] font-bold ${outerCapabilities[1].color}`}>{outerCapabilities[1].label}</span>
</div>
<p className="text-[10px] text-white/40 leading-tight">{outerCapabilities[1].desc}</p>
</div>
</div>
{/* Bottom Left */}
<div className="absolute bottom-0 left-0 w-[180px]">
<div className={`border ${outerCapabilities[2].border} ${outerCapabilities[2].bg} rounded-xl p-3`}>
<div className="flex items-center gap-1.5 mb-1">
<outerCapabilities[2].icon className={`w-3.5 h-3.5 ${outerCapabilities[2].color}`} />
<span className={`text-[11px] font-bold ${outerCapabilities[2].color}`}>{outerCapabilities[2].label}</span>
</div>
<p className="text-[10px] text-white/40 leading-tight">{outerCapabilities[2].desc}</p>
</div>
</div>
{/* Bottom Right */}
<div className="absolute bottom-0 right-0 w-[180px]">
<div className={`border ${outerCapabilities[3].border} ${outerCapabilities[3].bg} rounded-xl p-3`}>
<div className="flex items-center gap-1.5 mb-1">
<outerCapabilities[3].icon className={`w-3.5 h-3.5 ${outerCapabilities[3].color}`} />
<span className={`text-[11px] font-bold ${outerCapabilities[3].color}`}>{outerCapabilities[3].label}</span>
</div>
<p className="text-[10px] text-white/40 leading-tight">{outerCapabilities[3].desc}</p>
</div>
</div>
)
})}
{/* Dashed connection lines from corners to circle */}
<svg className="absolute inset-0 w-full h-full pointer-events-none" viewBox="0 0 800 420">