32 lines
1.5 KiB
PHP
32 lines
1.5 KiB
PHP
|
<header class="site-header">
|
||
|
|
<div class="site-header__top">
|
||
|
|
<a class="logo" href="/index.php<?php echo $lang === 'de' ? '?lang=de' : ''; ?>">
|
||
|
|
<img src="/assets/logo.png" alt="FlixCooks">
|
||
|
|
</a>
|
||
|
|
<div class="header-actions">
|
||
|
|
<a class="lang-toggle" href="<?php echo e($langSwitchHref ?? '#'); ?>"><?php echo e($langSwitchLabel ?? 'DE/EN'); ?></a>
|
||
|
|
<button class="menu-toggle" type="button" aria-expanded="false" aria-controls="siteNav">
|
||
|
|
<span class="menu-toggle__icon" aria-hidden="true">☰</span>
|
||
|
|
<span class="menu-toggle__label"><?php echo $lang === 'de' ? 'Menü' : 'Menu'; ?></span>
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<nav id="siteNav" class="site-nav" data-collapsed="true">
|
||
|
|
<a href="/index.php<?php echo $lang === 'de' ? '?lang=de' : ''; ?>"><?php echo e($navHome ?? 'Home'); ?></a>
|
||
|
|
<a href="/index.php<?php echo $lang === 'de' ? '?lang=de' : ''; ?>#latest"><?php echo e($navLatest ?? 'Latest'); ?></a>
|
||
|
|
<a href="/index.php<?php echo $lang === 'de' ? '?lang=de' : ''; ?>#basics"><?php echo e($navBasics ?? 'Basics'); ?></a>
|
||
|
|
</nav>
|
||
|
|
</header>
|
||
|
|
<script>
|
||
|
|
(() => {
|
||
|
|
const toggle = document.currentScript.previousElementSibling.querySelector('.menu-toggle');
|
||
|
|
const nav = document.getElementById('siteNav');
|
||
|
|
if (!toggle || !nav) return;
|
||
|
|
toggle.addEventListener('click', () => {
|
||
|
|
const isCollapsed = nav.getAttribute('data-collapsed') === 'true';
|
||
|
|
nav.setAttribute('data-collapsed', String(!isCollapsed));
|
||
|
|
toggle.setAttribute('aria-expanded', String(isCollapsed));
|
||
|
|
});
|
||
|
|
})();
|
||
|
|
</script>
|