generated from bisco/codex-bootstrap
bisco
34 lines
1.1 KiB
Plaintext
34 lines
1.1 KiB
Plaintext
---
|
||
interface Props {
|
||
siteName: string;
|
||
ctaLabel: string;
|
||
ctaUrl: string;
|
||
}
|
||
|
||
const { siteName, ctaLabel, ctaUrl } = Astro.props;
|
||
const links = [
|
||
["Il laboratorio", "#laboratorio"],
|
||
["Il maestro", "#maestro"],
|
||
["Le lezioni", "#lezioni"],
|
||
["Progetti", "#spettacoli"],
|
||
["Galleria", "#galleria"],
|
||
];
|
||
---
|
||
|
||
<header class="site-header">
|
||
<div class="container header-inner">
|
||
<a class="wordmark" href="#inizio" aria-label={`${siteName}, torna all’inizio`}>{siteName}</a>
|
||
<nav class="desktop-nav" aria-label="Navigazione principale">
|
||
{links.map(([label, href]) => <a href={href}>{label}</a>)}
|
||
</nav>
|
||
<a class="button button-small desktop-cta" href={ctaUrl}>{ctaLabel}</a>
|
||
<details class="mobile-menu">
|
||
<summary aria-label="Apri il menu"><span aria-hidden="true"></span><span class="menu-label">Menu</span></summary>
|
||
<nav aria-label="Navigazione mobile">
|
||
{links.map(([label, href]) => <a href={href}>{label}</a>)}
|
||
<a class="button button-small" href={ctaUrl}>{ctaLabel}</a>
|
||
</nav>
|
||
</details>
|
||
</div>
|
||
</header>
|