diff --git a/src/Header/config.ts b/src/Header/config.ts index a4c7872..f73568b 100644 --- a/src/Header/config.ts +++ b/src/Header/config.ts @@ -49,6 +49,7 @@ export const Header: GlobalConfig = { { name: 'menuLabel', type: 'text', defaultValue: defaultHeaderData.menuLabel, required: true }, { name: 'openLabel', type: 'text', defaultValue: defaultHeaderData.openLabel, required: true }, { name: 'closeLabel', type: 'text', defaultValue: defaultHeaderData.closeLabel, required: true }, + { name: 'dialogLabel', type: 'text', defaultValue: defaultHeaderData.dialogLabel, required: true }, { name: 'overviewLabel', type: 'text', defaultValue: defaultHeaderData.overviewLabel, required: true }, { name: 'loadingBrand', type: 'text', defaultValue: defaultHeaderData.loadingBrand, required: true }, { name: 'loadingLabel', type: 'text', defaultValue: defaultHeaderData.loadingLabel, required: true }, diff --git a/src/payload-types.ts b/src/payload-types.ts index b24487a..687eb78 100644 --- a/src/payload-types.ts +++ b/src/payload-types.ts @@ -5775,6 +5775,7 @@ export interface Header { menuLabel: string; openLabel: string; closeLabel: string; + dialogLabel: string; overviewLabel: string; loadingBrand: string; loadingLabel: string; @@ -5898,6 +5899,7 @@ export interface HeaderSelect { menuLabel?: T; openLabel?: T; closeLabel?: T; + dialogLabel?: T; overviewLabel?: T; loadingBrand?: T; loadingLabel?: T; diff --git a/src/spa/cmsNavigation.ts b/src/spa/cmsNavigation.ts index fca1e39..d767033 100644 --- a/src/spa/cmsNavigation.ts +++ b/src/spa/cmsNavigation.ts @@ -21,6 +21,7 @@ export type SpaHeaderData = { menuLabel: string openLabel: string closeLabel: string + dialogLabel: string overviewLabel: string loadingBrand: string loadingLabel: string @@ -66,6 +67,7 @@ export const defaultHeaderData: SpaHeaderData = { menuLabel: 'Menü', openLabel: 'Navigation öffnen', closeLabel: 'Menü schließen', + dialogLabel: 'Navigation', overviewLabel: 'Überblick', loadingBrand: 'BMP', loadingLabel: 'Exzellenz wird geladen...', diff --git a/src/spa/components/layout/Layout.tsx b/src/spa/components/layout/Layout.tsx index aa1ad82..6e753f6 100644 --- a/src/spa/components/layout/Layout.tsx +++ b/src/spa/components/layout/Layout.tsx @@ -59,11 +59,13 @@ const Layout: React.FC = ({ children, header = defaultHeaderData, f const footerLogo = footer.logo?.url || '/bmp-logo.png'; const headerCtas = header.ctas; const footerCtas = footer.ctas; + const fallbackHeaderCtas = defaultHeaderData.ctas; + const fallbackFooterCtas = defaultFooterData.ctas; const [open, setOpen] = useState(false); // desktop overlay const [activeKey, setActive] = useState(null); // desktop hover subnav const [mobileOpen, setMobileOpen] = useState(false); // mobile sidebar overlay const [expandKey, setExpand] = useState(null); // mobile accordion - const [lang, setLang] = useState(header.languages[0] || 'DE'); + const [lang, setLang] = useState(header.languages[0] || defaultHeaderData.languages[0]); const [mounted, setMounted] = useState(false); const [showLoader, setShowLoader] = useState(() => { if (typeof window === 'undefined') return false; @@ -236,7 +238,7 @@ const Layout: React.FC = ({ children, header = defaultHeaderData, f {/* ── DESKTOP OVERLAY ──────────────────────────── */} -
= ({ children, header = defaultHeaderData, f style={{ display:'inline-block', background:'#EFBF04', color:'#101828', fontSize: 15, fontWeight:700, textTransform:'uppercase', letterSpacing:'.12em', padding:'11px 24px', textDecoration:'none', transition:'background .2s, box-shadow .2s', borderRadius:0, fontFamily:FF_DISPLAY }} onMouseEnter={e=>{ e.currentTarget.style.background='#FFD130'; e.currentTarget.style.boxShadow='0 0 18px rgba(239,191,4,0.65), 0 0 40px rgba(239,191,4,0.3)'; }} onMouseLeave={e=>{ e.currentTarget.style.background='#EFBF04'; e.currentTarget.style.boxShadow='none'; }} - >{headerCtas[0]?.label || 'Jetzt bewerben'} + >{headerCtas[0]?.label || fallbackHeaderCtas[0].label} setOpen(false)} style={{ display:'inline-block', background:'transparent', color:MUTED, fontSize: 15, fontWeight:700, textTransform:'uppercase', letterSpacing:'.12em', padding:'10px 24px', textDecoration:'none', transition:'border-color .2s, color .2s', borderRadius:0, fontFamily:FF_DISPLAY, border:'1.5px solid rgba(239,191,4,0.35)' }} onMouseEnter={e=>{ e.currentTarget.style.borderColor='#EFBF04'; e.currentTarget.style.color='#EFBF04'; }} onMouseLeave={e=>{ e.currentTarget.style.borderColor='rgba(239,191,4,0.35)'; e.currentTarget.style.color=MUTED; }} - >{headerCtas[1]?.label || 'Mitglied werden'} + >{headerCtas[1]?.label || fallbackHeaderCtas[1].label}
@@ -409,7 +411,7 @@ const Layout: React.FC = ({ children, header = defaultHeaderData, f e.currentTarget.style.background='rgba(255,255,255,0.04)'; }} > - {headerCtas[2]?.label || 'Formular hochladen'} + {headerCtas[2]?.label || fallbackHeaderCtas[2].label}
@@ -457,7 +459,7 @@ const Layout: React.FC = ({ children, header = defaultHeaderData, f {/* ── FULLSCREEN OVERLAY ───────────────────────── */} -
= ({ children, header = defaultHeaderData, f
setMobileOpen(false)} style={{ display:'flex', alignItems:'center', justifyContent:'center', minHeight:52, background:GOLD, color:'#101828', fontSize:14, fontWeight:700, textTransform:'uppercase', letterSpacing:'.12em', textDecoration:'none', fontFamily:FF_DISPLAY }} - >{headerCtas[0]?.label || 'Jetzt bewerben'} + >{headerCtas[0]?.label || fallbackHeaderCtas[0].label} setMobileOpen(false)} style={{ display:'flex', alignItems:'center', justifyContent:'center', minHeight:50, background:'transparent', color:'#fff', fontSize:14, fontWeight:700, textTransform:'uppercase', letterSpacing:'.12em', textDecoration:'none', fontFamily:FF_DISPLAY, border:`1.5px solid ${LINE}` }} - >{headerCtas[1]?.label || 'Mitglied werden'} + >{headerCtas[1]?.label || fallbackHeaderCtas[1].label} setMobileOpen(false)} style={{ display:'flex', alignItems:'center', justifyContent:'center', gap:8, minHeight:46, background:'none', color:'rgba(255,255,255,0.5)', fontSize:11, fontWeight:700, textTransform:'uppercase', letterSpacing:'.14em', textDecoration:'none', fontFamily:FF_DISPLAY, border:'1px dashed rgba(255,255,255,0.2)' }} - > {headerCtas[2]?.label || 'Formular hochladen'} + > {headerCtas[2]?.label || fallbackHeaderCtas[2].label}
{/* Footer zone: lang + social + secondary */} @@ -612,7 +614,7 @@ const Layout: React.FC = ({ children, header = defaultHeaderData, f onMouseEnter={e => { (e.currentTarget as HTMLElement).style.background = '#EFBF04'; (e.currentTarget as HTMLElement).style.color = '#101828'; }} onMouseLeave={e => { (e.currentTarget as HTMLElement).style.background = '#111D55'; (e.currentTarget as HTMLElement).style.color = '#fff'; }} > - {headerCtas[0]?.label || 'Jetzt bewerben'} + {headerCtas[0]?.label || fallbackHeaderCtas[0].label} )} @@ -760,7 +762,7 @@ const Layout: React.FC = ({ children, header = defaultHeaderData, f e.currentTarget.style.background = GOLD; e.currentTarget.style.boxShadow = 'none'; }} - >{footerCtas[0]?.label || 'Kostenlos bewerben'} + >{footerCtas[0]?.label || fallbackFooterCtas[0].label} = ({ children, header = defaultHeaderData, f e.currentTarget.style.borderColor = 'rgba(239,191,4,0.35)'; e.currentTarget.style.color = MUTED; }} - >{footerCtas[1]?.label || 'Mitglied werden'} + >{footerCtas[1]?.label || fallbackFooterCtas[1].label} = ({ children, header = defaultHeaderData, f }} onMouseEnter={e => { e.currentTarget.style.color = '#fff'; }} onMouseLeave={e => { e.currentTarget.style.color = 'rgba(255,255,255,0.4)'; }} - >{footerCtas[2]?.label || 'Sponsoring-Anfrage →'} + >{footerCtas[2]?.label || fallbackFooterCtas[2].label}