hugo-PaperMod/layouts/partials/header.html

<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Title -->
    <title>{{ if .Title }}{{ .Title }} - {{ end }}{{ .Site.Title }}</title>
    <!-- Meta -->
    {{- if eq .Kind "page" }}
    <meta name="description" content="{{ .Summary }}">
    <meta name="author" content="{{ .Params.author | default .Site.Params.author }}">
    {{- else }}
    <meta name="description" content="{{ .Site.Params.description }}">
    <meta name="author" content="{{ .Site.Params.author }}">
    {{- end }}
    <!-- Styles -->
    {{ $anoldhope := resources.Get "an-old-hope.min.css" | minify }}
    {{ $style := resources.Get "style.css" | minify }}
    {{ $stylesheet := slice $anoldhope $style | resources.Concat "stylesheet.css" | minify }}
    <link href="{{ $stylesheet.Permalink }}" rel="stylesheet">
    <link href="{{ "custom.css" | absURL }}" rel="stylesheet">
    <!-- Favicons -->
    <link rel="apple-touch-icon" href="{{ "apple-touch-icon.png" | absURL }}">
    <link rel="icon" href="{{ "favicon.ico" | absURL }}">
    <!-- Generator -->
    {{- hugo.Generator }}
    <!-- RSS -->
    {{ range .AlternativeOutputFormats -}}
    {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
    {{ end -}}
    <!-- Misc -->
    {{- if eq (getenv "HUGO_ENV") "production" | or (eq .Site.Params.env "production") }}
    {{- template "_internal/google_analytics_async.html" . }}
    {{- template "_internal/opengraph.html" . }}
    {{- end }}
    <!-- Script -->
    <script>
      function setTheme() {
        const time = new Date();

        const prev = localStorage.getItem('date');
        const date = String(time.getMonth() + 1) + '.' + String(time.getDate());

        const now = time.getTime();
        let sunrise;
        let sunset;

        function setBodyClass() {
          if (now > sunrise && now < sunset) return;
          document.body.classList.add('dark');
        }

        if (date !== prev) {
          fetch('https://api.ipgeolocation.io/astronomy?apiKey=5ed37d85103e4defa5df4c5298ed5215')
            .then(res => res.json())
            .then(data => {
              sunrise = data.sunrise.split(':').map(Number);
              sunset = data.sunset.split(':').map(Number);
            })
            .catch(() => {
              sunrise = [7, 0];
              sunset = [19, 0];
            })
            .finally(() => {
              sunrise = time.setHours(sunrise[0], sunrise[1], 0);
              sunset = time.setHours(sunset[0], sunset[1], 0);
              setBodyClass();
              localStorage.setItem('sunrise', sunrise);
              localStorage.setItem('sunset', sunset);
            });
          localStorage.setItem('date', date);
        } else {
          sunrise = Number(localStorage.getItem('sunrise'));
          sunset = Number(localStorage.getItem('sunset'));
          setBodyClass();
        }
      }
    </script>
  </head>
  <body class="{{ if eq .Kind `page` }}single{{ else }}list{{ if .IsHome }} home{{ end }}{{ end }}">
    <script>
      setTheme();
    </script>
    <header class="header">
      <nav class="nav">
        {{- if .IsHome }}
        <h1 class="logo"><a href="{{ "" | absURL }}">{{ .Site.Title }}</a></h1>
        {{- else }}
        <p class="logo"><a href="{{ "" | absURL }}">{{ .Site.Title }}</a></p>
        {{- end }}
        {{- if .Site.Menus.main }}
        <ul class="menu">
          {{- range .Site.Menus.main }}
          <li>
            <a href="{{ .URL }}">{{ .Name }}</a>
          </li>
          {{- end }}
        </ul>
        {{- end }}
      </nav>
    </header>
    <main class="main">
Initial commit 2018-01-08 17:28:39 +01:00			`<!DOCTYPE html>`
			`<html lang="{{ .Site.LanguageCode }}">`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<head>`
			`<meta charset="utf-8">`
			`<meta http-equiv="X-UA-Compatible" content="IE=edge">`
			`<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">`
			`<!-- Title -->`
simplify code 2020-03-09 18:50:02 +01:00			`<title>{{ if .Title }}{{ .Title }} - {{ end }}{{ .Site.Title }}</title>`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<!-- Meta -->`
			`{{- if eq .Kind "page" }}`
			`<meta name="description" content="{{ .Summary }}">`
			`<meta name="author" content="{{ .Params.author \| default .Site.Params.author }}">`
update html format 2020-03-09 16:56:47 +01:00			`{{- else }}`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<meta name="description" content="{{ .Site.Params.description }}">`
			`<meta name="author" content="{{ .Site.Params.author }}">`
update html format 2020-03-09 16:56:47 +01:00			`{{- end }}`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<!-- Styles -->`
add styles from assets - bundle an-old-hope and style - minify 2020-07-20 15:47:39 +02:00			`{{ $anoldhope := resources.Get "an-old-hope.min.css" \| minify }}`
			`{{ $style := resources.Get "style.css" \| minify }}`
			`{{ $stylesheet := slice $anoldhope $style \| resources.Concat "stylesheet.css" \| minify }}`
			`<link href="{{ $stylesheet.Permalink }}" rel="stylesheet">`
Adds support for custom css. 2020-03-05 05:30:42 +01:00			`<link href="{{ "custom.css" \| absURL }}" rel="stylesheet">`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<!-- Favicons -->`
Update layouts 2019-08-19 22:12:49 +02:00			`<link rel="apple-touch-icon" href="{{ "apple-touch-icon.png" \| absURL }}">`
			`<link rel="icon" href="{{ "favicon.ico" \| absURL }}">`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<!-- Generator -->`
update html format 2020-03-09 16:56:47 +01:00			`{{- hugo.Generator }}`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<!-- RSS -->`
Update header.html 2020-05-25 07:42:32 +02:00			`{{ range .AlternativeOutputFormats -}}`
			{{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title \| safeHTML }}
			`{{ end -}}`
Refine head 2019-06-10 21:29:55 +02:00			`<!-- Misc -->`
update html format 2020-03-09 16:56:47 +01:00			`{{- if eq (getenv "HUGO_ENV") "production" \| or (eq .Site.Params.env "production") }}`
			`{{- template "_internal/google_analytics_async.html" . }}`
			`{{- template "_internal/opengraph.html" . }}`
			`{{- end }}`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`<!-- Script -->`
			`<script>`
			`function setTheme() {`
Fix Dark Mode logic 2019-10-16 21:02:35 +02:00			`const time = new Date();`

			`const prev = localStorage.getItem('date');`
Update month value 2019-10-20 12:20:15 +02:00			`const date = String(time.getMonth() + 1) + '.' + String(time.getDate());`
Fix Dark Mode logic 2019-10-16 21:02:35 +02:00
			`const now = time.getTime();`
Refine Dark Mode code 2019-10-16 05:27:49 +02:00			`let sunrise;`
			`let sunset;`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00
Refine Dark Mode code 2019-10-16 05:27:49 +02:00			`function setBodyClass() {`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`if (now > sunrise && now < sunset) return;`
Fix Dark Mode logic 2019-10-16 21:02:35 +02:00			`document.body.classList.add('dark');`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`}`

Fix Dark Mode logic 2019-10-16 21:02:35 +02:00			`if (date !== prev) {`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`fetch('https://api.ipgeolocation.io/astronomy?apiKey=5ed37d85103e4defa5df4c5298ed5215')`
			`.then(res => res.json())`
			`.then(data => {`
Refine Dark Mode code 2019-10-16 05:27:49 +02:00			`sunrise = data.sunrise.split(':').map(Number);`
			`sunset = data.sunset.split(':').map(Number);`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`})`
			`.catch(() => {`
Refine Dark Mode code 2019-10-16 05:27:49 +02:00			`sunrise = [7, 0];`
			`sunset = [19, 0];`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`})`
			`.finally(() => {`
Fix Dark Mode logic 2019-10-16 21:02:35 +02:00			`sunrise = time.setHours(sunrise[0], sunrise[1], 0);`
			`sunset = time.setHours(sunset[0], sunset[1], 0);`
Refine Dark Mode code 2019-10-16 05:27:49 +02:00			`setBodyClass();`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`localStorage.setItem('sunrise', sunrise);`
			`localStorage.setItem('sunset', sunset);`
			`});`
Fix Dark Mode logic 2019-10-16 21:02:35 +02:00			`localStorage.setItem('date', date);`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`} else {`
Refine Dark Mode code 2019-10-16 05:27:49 +02:00			`sunrise = Number(localStorage.getItem('sunrise'));`
			`sunset = Number(localStorage.getItem('sunset'));`
			`setBodyClass();`
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`}`
			`}`
			`</script>`
Update for 3.0 2019-03-31 14:32:06 +02:00			`</head>`
update html format 2020-03-09 16:56:47 +01:00			<body class="{{ if eq .Kind `page` }}single{{ else }}list{{ if .IsHome }} home{{ end }}{{ end }}">
Add Dark Mode core code 2019-10-15 22:15:16 +02:00			`<script>`
			`setTheme();`
			`</script>`
Update for 3.0 2019-03-31 14:32:06 +02:00			`<header class="header">`
Update layouts 2019-08-19 22:12:49 +02:00			`<nav class="nav">`
update html format 2020-03-09 16:56:47 +01:00			`{{- if .IsHome }}`
Fix links 2019-06-10 00:59:08 +02:00			`<h1 class="logo"><a href="{{ "" \| absURL }}">{{ .Site.Title }}</a></h1>`
update html format 2020-03-09 16:56:47 +01:00			`{{- else }}`
Fix links 2019-06-10 00:59:08 +02:00			`<p class="logo"><a href="{{ "" \| absURL }}">{{ .Site.Title }}</a></p>`
update html format 2020-03-09 16:56:47 +01:00			`{{- end }}`
			`{{- if .Site.Menus.main }}`
Update layouts 2019-08-19 22:12:49 +02:00			`<ul class="menu">`
update html format 2020-03-09 16:56:47 +01:00			`{{- range .Site.Menus.main }}`
Update layouts 2019-08-19 22:12:49 +02:00			`<li>`
			`<a href="{{ .URL }}">{{ .Name }}</a>`
			`</li>`
update html format 2020-03-09 16:56:47 +01:00			`{{- end }}`
Update layouts 2019-08-19 22:12:49 +02:00			`</ul>`
update html format 2020-03-09 16:56:47 +01:00			`{{- end }}`
Update layouts 2019-08-19 22:12:49 +02:00			`</nav>`
Update for 3.0 2019-03-31 14:32:06 +02:00			`</header>`
			`<main class="main">`