diff options
Diffstat (limited to 'themes/PaperMod/layouts/partials/header.html')
| -rw-r--r-- | themes/PaperMod/layouts/partials/header.html | 121 |
1 files changed, 121 insertions, 0 deletions
diff --git a/themes/PaperMod/layouts/partials/header.html b/themes/PaperMod/layouts/partials/header.html new file mode 100644 index 0000000..cc63659 --- /dev/null +++ b/themes/PaperMod/layouts/partials/header.html @@ -0,0 +1,121 @@ +{{- /* theme-toggle is enabled */}} +{{- if (not .Site.Params.disableThemeToggle) }} +{{- /* theme is light */}} +{{- if (eq .Site.Params.defaultTheme "light") }} +<script> + if (localStorage.getItem("pref-theme") === "dark") { + document.body.classList.add('dark'); + } + +</script> +{{- /* theme is dark */}} +{{- else if (eq .Site.Params.defaultTheme "dark") }} +<script> + if (localStorage.getItem("pref-theme") === "light") { + document.body.classList.remove('dark') + } + +</script> +{{- else }} +{{- /* theme is auto */}} +<script> + if (localStorage.getItem("pref-theme") === "dark") { + document.body.classList.add('dark'); + } else if (localStorage.getItem("pref-theme") === "light") { + document.body.classList.remove('dark') + } else if (window.matchMedia('(prefers-color-scheme: dark)').matches) { + document.body.classList.add('dark'); + } + +</script> +{{- end }} +{{- /* theme-toggle is disabled and theme is auto */}} +{{- else if (and (ne .Site.Params.defaultTheme "light") (ne .Site.Params.defaultTheme "dark"))}} +<script> + if (window.matchMedia('(prefers-color-scheme: dark)').matches) { + document.body.classList.add('dark'); + } + +</script> +{{- end }} + +<header class="header"> + <nav class="nav"> + <div class="logo"> + {{- $label_text := (.Site.Params.label.text | default .Site.Title) }} + {{- if .Site.Title }} + <a href="{{ "" | absLangURL }}" accesskey="h" title="{{ $label_text }} (Alt + H)"> + {{- if .Site.Params.label.icon }} + <img src="{{- .Site.Params.label.icon | absURL -}}" alt="logo" aria-label="logo" + height="{{- .Site.Params.label.iconHeight | default " 30px" -}}"> + {{- end -}} + {{- $label_text -}} + </a> + {{- end }} + <span class="logo-switches"> + {{- if (not .Site.Params.disableThemeToggle) }} + <button id="theme-toggle" accesskey="t" title="(Alt + T)"> + <svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" + fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" + stroke-linejoin="round"> + <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path> + </svg> + <svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" + fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" + stroke-linejoin="round"> + <circle cx="12" cy="12" r="5"></circle> + <line x1="12" y1="1" x2="12" y2="3"></line> + <line x1="12" y1="21" x2="12" y2="23"></line> + <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line> + <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line> + <line x1="1" y1="12" x2="3" y2="12"></line> + <line x1="21" y1="12" x2="23" y2="12"></line> + <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line> + <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line> + </svg> + </button> + {{- end }} + + {{- $lang := .Lang}} + {{- $separator := or $label_text (not .Site.Params.disableThemeToggle)}} + {{- with $.Site.Home.AllTranslations }} + <ul class="lang-switch"> + {{- if $separator }}<li>|</li>{{ end }} + {{- range . -}} + {{- if ne $lang .Lang }} + <li> + <a href="{{- .Permalink -}}" title="{{ .Language.Params.languageAltTitle | default (.Language.LanguageName | emojify) | default (.Lang | title) }}" + aria-label="{{ .Language.LanguageName | default (.Lang | title) }}"> + {{- if (and $.Site.Params.displayFullLangName (.Language.LanguageName)) }} + {{- .Language.LanguageName | emojify -}} + {{- else }} + {{- .Lang | title -}} + {{- end -}} + </a> + </li> + {{- end -}} + {{- end}} + </ul> + {{- end }} + </span> + </div> + {{- $currentPage := . }} + <ul id="menu"> + {{- range .Site.Menus.main }} + {{- $menu_item_url := (cond (strings.HasSuffix .URL "/") .URL (printf "%s/" .URL) ) | absLangURL }} + {{- $page_url:= $currentPage.Permalink | absLangURL }} + {{- $is_search := eq ($.Site.GetPage .KeyName).Layout `search` }} + <li> + <a href="{{ .URL | absLangURL }}" title="{{ .Title | default .Name }} {{- cond $is_search (" (Alt + /)" | safeHTMLAttr) ("" | safeHTMLAttr ) }}" + {{- cond $is_search (" accesskey=/" | safeHTMLAttr) ("" | safeHTMLAttr ) }}> + <span {{- if eq $menu_item_url $page_url }} class="active" {{- end }}> + {{- .Pre }} + {{- .Name -}} + {{ .Post -}} + </span> + </a> + </li> + {{- end }} + </ul> + </nav> +</header> |