hugo-blog/themes/reporter/layouts/partials/header.html

80 lines
3.5 KiB
HTML
Raw Normal View History

<!-- navigation -->
<header class="navigation">
<div class="container">
<!-- navbar -->
<nav class="navbar navbar-expand-lg navbar-light px-0">
<a class="navbar-brand order-1 py-0" href="{{ site.BaseURL | relLangURL }}">
{{ $logo:= site.Params.logo }}
{{ if fileExists (add `assets/` $logo) }}
{{ $logo:= resources.Get $logo }}
{{ $option := add (string site.Params.logo_width) " webp" }}
{{ $logo:= $logo.Resize site.Params.logo_width }}
{{ $logo_webp:= $logo.Resize $option }}
<img loading="prelaod" decoding="async" class="img-fluid" width="{{$logo.Width}}" height="{{$logo.Height}}" src="{{$logo_webp.RelPermalink}}" alt="{{ site.Title }}" onerror="this.onerror=null;this.src='{{$logo.RelPermalink}}'">
{{ else }}
{{site.Params.logo_text | markdownify}}
{{ end }}
</a>
<div class="navbar-actions order-3">
<!-- Language List -->
{{ if .IsTranslated }}
<select class="mx-3 border-0 bg-transparent" id="select-language" onchange="location = this.value;">
{{ $siteLanguages := site.Languages}}
{{ $pageLang := .Page.Lang}}
{{ range .Page.AllTranslations }}
{{ $translation := .}}
{{ range $siteLanguages }}
{{ if eq $translation.Lang .Lang }}
{{ $selected := false }}
{{ if eq $pageLang .Lang}}
<option id="{{ $translation.Language }}" value="{{ $translation.RelPermalink }}" selected>{{ .LanguageName }}
</option>
{{ else }}
<option id="{{ $translation.Language }}" value="{{ $translation.RelPermalink }}">{{ .LanguageName }}</option>
{{ end }}
{{ end }}
{{ end }}
{{ end }}
</select>
{{ end }}
<button aria-label="navbar toggler" class="navbar-toggler border-0" type="button" data-toggle="collapse" data-target="#navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
{{ if site.Params.search }}
<!-- search -->
<form action="{{ `search`| relLangURL }}" class="search order-lg-3 order-md-2 order-3 ml-auto">
<input id="search-query" name="s" type="search" placeholder="Search...">
</form>
{{ end }}
<div class="collapse navbar-collapse text-center order-lg-2 order-4" id="navigation">
<ul class="navbar-nav mx-auto mt-3 mt-lg-0">
{{ range site.Menus.main }}
{{ if .HasChildren }}
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
{{ .Name }}
</a>
<div class="dropdown-menu">
{{ range .Children }}
<a class="dropdown-item" {{if findRE `^http` .URL}}target="_blank"{{end}}
href="{{if findRE `^#` .URL}}{{if not $.IsHome}}{{site.BaseURL | relLangURL}}{{end}}{{ .URL }}{{else}}{{.URL | relLangURL}}{{end}}">{{ .Name }}</a>
{{ end }}
</div>
</li>
{{ else }}
<li class="nav-item">
<a class="nav-link" {{if findRE `^http` .URL}}target="_blank"{{end}}
href="{{if findRE `^#` .URL}}{{if not $.IsHome}}{{site.BaseURL | relLangURL}}{{end}}{{ .URL }}{{else}}{{.URL | relLangURL}}{{end}}">{{ .Name }}</a>
</li>
{{ end }}
{{ end }}
</ul>
</div>
</nav>
</div>
</header>
<!-- /navigation -->