hugo-WonderMod/layouts/partials/header.html

99 lines
3.5 KiB
HTML
Raw Normal View History

2018-01-08 11:28:39 -05:00
<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
2019-03-31 08:32:06 -04: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 -->
2020-03-09 13:50:02 -04:00
<title>{{ if .Title }}{{ .Title }} - {{ end }}{{ .Site.Title }}</title>
2019-03-31 08:32:06 -04:00
<!-- Meta -->
{{- if eq .Kind "page" }}
<meta name="description" content="{{ .Summary }}">
<meta name="author" content="{{ .Params.author | default .Site.Params.author }}">
2020-03-09 11:56:47 -04:00
{{- else }}
2019-03-31 08:32:06 -04:00
<meta name="description" content="{{ .Site.Params.description }}">
<meta name="author" content="{{ .Site.Params.author }}">
2020-03-09 11:56:47 -04:00
{{- end }}
2019-03-31 08:32:06 -04:00
<!-- Styles -->
2019-08-19 16:12:49 -04:00
<link href="{{ "an-old-hope.min.css" | absURL }}" rel="stylesheet">
<link href="{{ "style.css" | absURL }}" rel="stylesheet">
2019-03-31 08:32:06 -04:00
<!-- Favicons -->
2019-08-19 16:12:49 -04:00
<link rel="apple-touch-icon" href="{{ "apple-touch-icon.png" | absURL }}">
<link rel="icon" href="{{ "favicon.ico" | absURL }}">
2019-03-31 08:32:06 -04:00
<!-- Generator -->
2020-03-09 11:56:47 -04:00
{{- hugo.Generator }}
2019-03-31 08:32:06 -04:00
<!-- RSS -->
2019-06-09 18:44:15 -04:00
<link rel="alternate" type="application/atom+xml" href="{{ "index.xml" | absURL }}" title="{{ .Site.Title }}">
2019-06-10 15:29:55 -04:00
<!-- Misc -->
2020-03-09 11:56:47 -04:00
{{- if eq (getenv "HUGO_ENV") "production" | or (eq .Site.Params.env "production") }}
{{- template "_internal/google_analytics_async.html" . }}
{{- template "_internal/opengraph.html" . }}
{{- end }}
2019-10-15 16:15:16 -04:00
<!-- Script -->
<script>
function setTheme() {
2019-10-16 15:02:35 -04:00
const time = new Date();
const prev = localStorage.getItem('date');
2019-10-20 06:20:15 -04:00
const date = String(time.getMonth() + 1) + '.' + String(time.getDate());
2019-10-16 15:02:35 -04:00
const now = time.getTime();
2019-10-15 23:27:49 -04:00
let sunrise;
let sunset;
2019-10-15 16:15:16 -04:00
2019-10-15 23:27:49 -04:00
function setBodyClass() {
2019-10-15 16:15:16 -04:00
if (now > sunrise && now < sunset) return;
2019-10-16 15:02:35 -04:00
document.body.classList.add('dark');
2019-10-15 16:15:16 -04:00
}
2019-10-16 15:02:35 -04:00
if (date !== prev) {
2019-10-15 16:15:16 -04:00
fetch('https://api.ipgeolocation.io/astronomy?apiKey=5ed37d85103e4defa5df4c5298ed5215')
.then(res => res.json())
.then(data => {
2019-10-15 23:27:49 -04:00
sunrise = data.sunrise.split(':').map(Number);
sunset = data.sunset.split(':').map(Number);
2019-10-15 16:15:16 -04:00
})
.catch(() => {
2019-10-15 23:27:49 -04:00
sunrise = [7, 0];
sunset = [19, 0];
2019-10-15 16:15:16 -04:00
})
.finally(() => {
2019-10-16 15:02:35 -04:00
sunrise = time.setHours(sunrise[0], sunrise[1], 0);
sunset = time.setHours(sunset[0], sunset[1], 0);
2019-10-15 23:27:49 -04:00
setBodyClass();
2019-10-15 16:15:16 -04:00
localStorage.setItem('sunrise', sunrise);
localStorage.setItem('sunset', sunset);
});
2019-10-16 15:02:35 -04:00
localStorage.setItem('date', date);
2019-10-15 16:15:16 -04:00
} else {
2019-10-15 23:27:49 -04:00
sunrise = Number(localStorage.getItem('sunrise'));
sunset = Number(localStorage.getItem('sunset'));
setBodyClass();
2019-10-15 16:15:16 -04:00
}
}
</script>
2019-03-31 08:32:06 -04:00
</head>
2020-03-09 11:56:47 -04:00
<body class="{{ if eq .Kind `page` }}single{{ else }}list{{ if .IsHome }} home{{ end }}{{ end }}">
2019-10-15 16:15:16 -04:00
<script>
setTheme();
</script>
2019-03-31 08:32:06 -04:00
<header class="header">
2019-08-19 16:12:49 -04:00
<nav class="nav">
2020-03-09 11:56:47 -04:00
{{- if .IsHome }}
2019-06-09 18:59:08 -04:00
<h1 class="logo"><a href="{{ "" | absURL }}">{{ .Site.Title }}</a></h1>
2020-03-09 11:56:47 -04:00
{{- else }}
2019-06-09 18:59:08 -04:00
<p class="logo"><a href="{{ "" | absURL }}">{{ .Site.Title }}</a></p>
2020-03-09 11:56:47 -04:00
{{- end }}
{{- if .Site.Menus.main }}
2019-08-19 16:12:49 -04:00
<ul class="menu">
2020-03-09 11:56:47 -04:00
{{- range .Site.Menus.main }}
2019-08-19 16:12:49 -04:00
<li>
<a href="{{ .URL }}">{{ .Name }}</a>
</li>
2020-03-09 11:56:47 -04:00
{{- end }}
2019-08-19 16:12:49 -04:00
</ul>
2020-03-09 11:56:47 -04:00
{{- end }}
2019-08-19 16:12:49 -04:00
</nav>
2019-03-31 08:32:06 -04:00
</header>
<main class="main">