add CSS-only navbar

This commit is contained in:
2019-10-20 15:40:06 +02:00
parent c4e9633f49
commit ac0d9506d4
4 changed files with 285 additions and 35 deletions

View File

@@ -1,23 +1,18 @@
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/"><i class="fa fa-home"></i></a>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="navbar">
<ul class="nav navbar-nav navbar-right">
<header id="luxbar" class="luxbar-default">
<input type="checkbox" class="luxbar-checkbox" id="luxbar-checkbox"/>
<div class="luxbar-menu luxbar-menu-right luxbar-menu-light">
<ul class="luxbar-navigation">
<li class="luxbar-header">
<a href="/" class="luxbar-brand"><i class="fa fa-home"></i></a>
<label class="luxbar-hamburger luxbar-hamburger-spin" id="luxbar-hamburger" for="luxbar-checkbox"> <span></span> </label>
</li>
{{- $rel := .RelPermalink -}}
{{- if .Site.Menus.main -}}
{{- range sort .Site.Menus.main -}}
<!-- if RelPermalink = this menu item, mark it -->
<li class="{{if eq $rel .URL}}active{{end}}"><a href="{{ .URL }}">{{ .Name | upper }}</a></li>
<li class="luxbar-item {{if eq $rel .URL}}active{{end}}"><a href="{{ .URL }}">{{ .Name | upper }}</a></li>
{{- end -}}
{{ end }}
</ul>
</div>
</ul>
</div>
</nav>
</header>