fs/tsv08kulmbach-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Navigation: Dropdown-Untermenüs für Fußball und Verein

Browse Source 
navigation.json gruppiert Fußball (Übersicht, Mannschaften, Jugend) und
Verein (Übersicht, Historie) als children. nav.php rendert Disclosure-Buttons
mit aria-expanded/-controls; ohne JS per CSS :hover/:focus-within bedienbar.
nav.js ergänzt Toggle, Escape (Untermenü zuerst, dann Overlay) und
Klick-außerhalb-schließt. Kontakt-CTA aus der Nav entfernt.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01KDQZ6FuchNUh2bxSW9PeNv
This commit is contained in:
Felix Schneider
2026-06-19 08:13:10 +02:00
parent 3b6f630a72
commit c5f7b258ff
3 changed files with 95 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
app/components/nav.php
View File

@@ -4,7 +4,10 @@ declare(strict_types=1);
/**
* Hauptnavigation aus data/navigation.json. Props: $current (Slug).
* Burger-Toggle übernimmt assets/js/nav.js (aria-expanded/aria-controls).
* Burger-Toggle + Dropdowns übernimmt assets/js/nav.js.
* Dropdowns funktionieren auch ohne JS (CSS :hover / :focus-within); JS ergänzt
* nur aria-expanded, Escape und Klick-außerhalb-schließt.
* CTAs rendert der Header (site-header__actions) — nicht hier.
*/
$nav = json_load('navigation');
@@ -20,14 +23,32 @@ $href = static function (string $slug): string {
</button>
<ul class="site-nav__list" id="site-nav-list">
<?php foreach ($nav['main'] as $item): ?>
<li>
<?php if (!empty($item['children'])): ?>
<?php
$submenuId = 'submenu-' . preg_replace('/[^a-z0-9]+/', '-', strtolower($item['label']));
$childActive = false;
foreach ($item['children'] as $child) {
if ($child['slug'] === $current) {
$childActive = true;
break;
}
}
?>
<li class="site-nav__item site-nav__item--has-submenu">
<button class="site-nav__sublink" type="button" aria-expanded="false" aria-controls="<?= e($submenuId) ?>"<?= $childActive ? ' data-current' : '' ?>><?= e($item['label']) ?><?= icon('chevron-down', 'site-nav__chevron') ?></button>
<ul class="site-nav__submenu" id="<?= e($submenuId) ?>">
<?php foreach ($item['children'] as $child): ?>
<li>
<a href="<?= e($href($child['slug'])) ?>"<?= $child['slug'] === $current ? ' aria-current="page"' : '' ?>><?= e($child['label']) ?></a>
</li>
<?php endforeach; ?>
</ul>
</li>
<?php else: ?>
<li class="site-nav__item">
<a href="<?= e($href($item['slug'])) ?>"<?= $item['slug'] === $current ? ' aria-current="page"' : '' ?>><?= e($item['label']) ?></a>
</li>
<?php endforeach; ?>
<?php foreach ($nav['ctas'] ?? [] as $cta): ?>
<li class="site-nav__cta">
<?php component('cta', ['cta' => $cta]); ?>
</li>
<?php endif; ?>
<?php endforeach; ?>
</ul>
</nav>