fix(home): rebalance application form split

This commit is contained in:
syntaxbullet
2026-07-31 17:34:31 +02:00
parent f465839af0
commit 5b62abf8d4
2 changed files with 86 additions and 1 deletions

View File

@@ -42,12 +42,17 @@ export function ApplicationFormSection({ source }: { source: NewsletterSource })
const newsletterPhase = newsletterPhaseForApplicationPhase(activeApplicationPhase)
const benefits = fallbackArray<NewsletterBenefit>(section.benefits, homeContent.application.benefits)
const finalBenefits = showApplicationForm ? benefits : newsletterCopy.benefits
const desktopGridTemplateColumns = source === 'homepage' ? '5fr 1px 7fr' : '4fr 1px 8fr'
return (
<section style={{ background: '#24366A', position: 'relative', overflow: 'hidden', height: isMobile ? 'auto' : showApplicationForm ? 'calc(100vh - 60px)' : 'auto', minHeight: isMobile ? undefined : showApplicationForm ? undefined : 560, display: 'flex', flexDirection: 'column' }} id="bewerben">
<div style={{ position: 'absolute', left: -120, top: '50%', transform: 'translateY(-50%)', width: 600, height: 600, borderRadius: '50%', background: 'radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%)', pointerEvents: 'none' }} />
<div style={{ display: 'grid', gridTemplateColumns: isMobile ? '1fr' : '4fr 1px 8fr', position: 'relative', flex: isMobile ? 'none' : 1, minHeight: 0, overflow: 'hidden' }}>
<div
data-testid="application-form-layout"
data-source={source}
style={{ display: 'grid', gridTemplateColumns: isMobile ? '1fr' : desktopGridTemplateColumns, position: 'relative', flex: isMobile ? 'none' : 1, minHeight: 0, overflow: 'hidden' }}
>
<div style={{ padding: isMobile ? '32px 24px 24px' : '36px 36px 32px 52px', display: 'flex', flexDirection: 'column', justifyContent: 'center', overflow: 'hidden' }}>
<span style={{ fontFamily: FF, fontSize: 10, color: '#EFBF04', textTransform: 'uppercase', letterSpacing: '0.36em', fontWeight: 700, display: 'block', marginBottom: 16, opacity: 0.8 }}>{showApplicationForm ? fallbackText(section.eyebrow, homeContent.application.eyebrow) : newsletterCopy.eyebrow}</span>
<h2 className="type-section-title text-role-inverse" style={{ textTransform: 'uppercase', marginBottom: 16 }}>