bobatheme/layouts/partials/top.html

<h2 class="header">
    <a href="{{ .Site.Home.Permalink | absLangURL }}">{{ .Site.Title | markdownify }}</a>
</h2>

<div class="topbar">
    <nav class="navbar">
        {{ with .Site.Home }}
        <a class="navbar-item{{ if $.IsHome }} active{{ end }}" href="{{ .Permalink | absLangURL }}">{{ .Title }}</a>
        {{ end }}

        {{ range .Site.Menus.main }}

        {{ $isActive := false }}
        {{ if or ($.HasMenuCurrent .Menu .) ($.IsMenuCurrent .Menu .) }}
        {{ $isActive = true }}
        {{ end }}

        <a class="navbar-item{{ if $isActive }} active{{ end }}" href="{{ .URL }}">{{ .Name }}</a>

        {{ end }}
    </nav>

    {{ if .Site.IsMultiLingual }}
    <details class="langpicker">
        <summary>
            {{- partial "icon.html" "world" -}}
        </summary>
        <ul class="languages">
            {{ range .AllTranslations }}
            <li>
                <a class="langpicker-item{{ if eq .Language $.Site.Language }} active{{ end }}" href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
            </li>
            {{ end }}

            {{ $site_translations := slice }}
            {{ range .Site.Languages }}
            {{ $site_translations = $site_translations | append .LanguageName }}
            {{ end }}

            {{ $translation_codes := slice }}
            {{ range .AllTranslations }}
            {{ $translation_codes = $translation_codes | append .Language }}
            {{ end }}

            {{ range (.Site.Languages | complement $translation_codes) }}
            <li>
                <a class="langpicker-item unavailable">{{ .LanguageName }}</a>
            </li>
            {{ end }}
        </ul>
    </details>
    {{ end }}
</div>