47 lines
2.3 KiB
HTML
47 lines
2.3 KiB
HTML
{{- /* Sprachumschalter. Aufruf: (dict "page" . "variant" "dropdown"|"list") */ -}}
|
||
{{ $cur := .page }}
|
||
{{ $variant := .variant | default "dropdown" }}
|
||
|
||
{{ if eq $variant "list" }}
|
||
{{/* Einfache Liste (mobiles Offcanvas) */}}
|
||
<nav class="op-langswitch op-langswitch--list" aria-label="Sprache / Language">
|
||
{{ range site.Sites }}
|
||
{{ $s := . }}
|
||
{{ $link := $s.Home.RelPermalink }}
|
||
{{ range $cur.AllTranslations }}{{ if eq .Language.Lang $s.Language.Lang }}{{ $link = .RelPermalink }}{{ end }}{{ end }}
|
||
{{ $isCurrent := eq $s.Language.Lang site.Language.Lang }}
|
||
<a class="op-langswitch__item{{ if $isCurrent }} is-current{{ end }}" href="{{ $link }}"
|
||
hreflang="{{ $s.Language.Lang }}" lang="{{ $s.Language.Lang }}"{{ if $isCurrent }} aria-current="true"{{ end }}>
|
||
<span class="op-langswitch__flag" aria-hidden="true">{{ $s.Language.Params.flag }}</span>
|
||
<span class="op-langswitch__name">{{ $s.Language.LanguageName }}</span>
|
||
</a>
|
||
{{ end }}
|
||
</nav>
|
||
{{ else }}
|
||
{{/* Dropdown (Navbar) */}}
|
||
<div class="op-langswitch">
|
||
<button class="op-langswitch__toggle" type="button" aria-haspopup="true"
|
||
aria-label="{{ site.Language.LanguageName }} – Sprache wählen / choose language">
|
||
<span class="op-langswitch__flag" aria-hidden="true">{{ site.Language.Params.flag }}</span>
|
||
<span class="op-langswitch__code">{{ upper site.Language.Lang }}</span>
|
||
<span class="op-langswitch__caret" aria-hidden="true"></span>
|
||
</button>
|
||
<div class="op-langswitch__drop" uk-dropdown="mode: click; pos: bottom-right; offset: 4; boundary: .op-navbar">
|
||
<ul class="uk-nav uk-dropdown-nav">
|
||
{{ range site.Sites }}
|
||
{{ $s := . }}
|
||
{{ $link := $s.Home.RelPermalink }}
|
||
{{ range $cur.AllTranslations }}{{ if eq .Language.Lang $s.Language.Lang }}{{ $link = .RelPermalink }}{{ end }}{{ end }}
|
||
{{ $isCurrent := eq $s.Language.Lang site.Language.Lang }}
|
||
<li class="{{ if $isCurrent }}uk-active{{ end }}">
|
||
<a href="{{ $link }}" hreflang="{{ $s.Language.Lang }}" lang="{{ $s.Language.Lang }}"{{ if $isCurrent }} aria-current="true"{{ end }}>
|
||
<span class="op-langswitch__flag" aria-hidden="true">{{ $s.Language.Params.flag }}</span>
|
||
<span class="op-langswitch__name">{{ $s.Language.LanguageName }}</span>
|
||
</a>
|
||
</li>
|
||
{{ end }}
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
{{ end }}
|