{{/* TODO: maybe move somewhere else */}}

{{ $currentPage := . }}

{{/* Unique modal dialog */}}
<div id="dialog-here"></div>

{{/* Svg symbols that can be calls through html with <use> */}}
<div class="svg-symbols">
	{{ partial "svg/inline-svg" "symbols" }}
</div>
{{/* Decoration svg shapes for header and background */}}
{{ partial "decoration_shapes" $currentPage.Params.decotype }}
<div class="header-container shadow-container">
	<header role="banner" class="wrapper">
		<div>
			<a href="{{ `/` | relLangURL }}" class="logo-ecoindex" title="EcoIndex, {{ i18n `BackHome` -}}">
				<span class="logo-ecoindex__eco">eco</span><span class="logo-ecoindex__index">Index</span>
			</a>
			<div class="menu-btn-container" hidden>
				<div class="with-icon-l">
					<button class="menu-btn" aria-expanded="false" aria-controls="main-nav">
						<svg class="icon-l" focusable="false" viewBox="0 0 30 30" stroke="currentColor" width="1em" height="1em">
							<path d="M3,3 27,3 M3,15 27,15 M3,27 27,27"></path>
						</svg>
						Menu
					</button>
				</div>
			</div>
			<nav
				id="main-nav"
				role="navigation"
				class="main-nav-container"
				data-open="false"
				aria-labelledby="main-nav-label">
				<div>
					<span id="main-nav-label" hidden>{{ i18n `MainNav` -}}</span>
					<div class="cluster-l">
						<ul class>
							{{ range .Site.Menus.main }}
								{{- if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) -}}
									<li><span aria-current="page">{{ .Name }}</span></li>
								{{- else -}}
									<li><a href="{{- .URL | safeHTMLAttr -}}">{{ .Name }}</a></li>
								{{- end -}}
							{{- end -}}
						</ul>
					</div>
					<div class="cluster-l">
						<ul class>
							{{ range .Site.Menus.extra }}
								{{- if or ($currentPage.IsMenuCurrent "extra" .) ($currentPage.HasMenuCurrent "extra" .) -}}
									<li><span aria-current="page">{{ .Name }}</span></li>
								{{- else -}}
									<li><a href="{{- .URL | safeHTMLAttr -}}">{{ .Name }}</a></li>
								{{- end -}}
							{{- end -}}
						</ul>
					</div>
					{{- partial "header/language_switcher" . }}
				</div>
			</nav>
		</div>
	</header>
</div>