systemausfall.org/hugo-theme-hilfe
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

feat: add optional icon menu to site header (#184)

Browse source
This commit is contained in:
Robert Kaussow 2021-08-12 18:17:49 +02:00 • committed by GitHub
parent afe2abc746
commit 57bbc46a47
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 149 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

50
layouts/partials/site-header.html
View file

@ -2,8 +2,14 @@
<div class="container flex align-center justify-between">
{{ if .MenuEnabled }}
<label for="menu-control" class="gdoc-nav__control">
<svg class="icon gdoc_menu"><use xlink:href="#gdoc_menu"></use></svg>
<svg class="icon gdoc_arrow_back"><use xlink:href="#gdoc_arrow_back"></use></svg>
<svg class="icon gdoc_menu">
<title>Open Nav Menu</title>
<use xlink:href="#gdoc_menu"></use>
</svg>
<svg class="icon gdoc_arrow_back">
<title>Close Nav Menu</title>
<use xlink:href="#gdoc_arrow_back"></use>
</svg>
</label>
{{ end }}
<a class="gdoc-header__link" href="{{ .Root.Site.BaseURL }}">
@ -12,10 +18,40 @@
<span class="gdoc-brand__title">{{ .Root.Site.Title }}</span>
</span>
</a>
<span id="gdoc-dark-mode">
<svg class="icon gdoc_brightness_dark"><use xlink:href="#gdoc_brightness_dark"></use></svg>
<svg class="icon gdoc_brightness_light"><use xlink:href="#gdoc_brightness_light"></use></svg>
<svg class="icon gdoc_brightness_auto"><use xlink:href="#gdoc_brightness_auto"></use></svg>
</span>
<div class="gdoc-menu-header">
{{ if .Root.Site.Data.menu.extra.header }}
<span class="gdoc-menu-header__items">
{{ partial "menu-extra" (dict "current" .Root "source" .Root.Site.Data.menu.extra.header "target" "header") }}
{{ end }}
<span id="gdoc-dark-mode">
<svg class="icon gdoc_brightness_dark">
<title>Toggle Dark/Light/Auto mode</title>
<use xlink:href="#gdoc_brightness_dark"></use>
</svg>
<svg class="icon gdoc_brightness_light">
<title>Toggle Dark/Light/Auto mode</title>
<use xlink:href="#gdoc_brightness_light"></use>
</svg>
<svg class="icon gdoc_brightness_auto">
<title>Toggle Dark/Light/Auto mode</title>
<use xlink:href="#gdoc_brightness_auto"></use>
</svg>
</span>
{{ if .Root.Site.Data.menu.extra.header }}
<label for="menu-header-control" class="gdoc-menu-header__control">
<svg class="icon gdoc_keyborad_arrow_right">
<use xlink:href="#gdoc_keyborad_arrow_right"></use>
<title>Close Menu Bar</title>
</svg>
</label>
</span>
<label for="menu-header-control" class="gdoc-menu-header__control">
<svg class="icon gdoc_keyborad_arrow_left">
<use xlink:href="#gdoc_keyborad_arrow_left"></use>
<title>Open Menu Bar</title>
</svg>
</label>
{{ end }}
</div>
</div>
</header>