joshua.seigler.net/site/_includes/base.njk

44 lines
1.7 KiB
Text

---
title: Joshua's Homepage
---
{%- set computedTitle = tag | capitalize if tag else title -%}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="{{ "/site.css" | url }}?modified={{buildTime}}"/>
<link rel="preload" media="light" href="{{ "./cloud.png" | url }}" as="image" />
<link rel="preload" media="dark" href="{{ "./cloud-night.png" | url }}" as="image" />
<title>{{ computedTitle }} - {{ site.title }}</title>
<meta name="description" content="{{ description }}" />
<meta property="og:title" content="{{ computedTitle }}" />
<meta property="og:type" content="{{ article }}" />
<meta property="og:url" content="{{ page.url | absoluteURL }}" />
<meta name="twitter:title" content="{{ computedTitle }}" />
<meta name="twitter:description" content="{{ description }}" />
{% if cover %}
<meta property="og:image" content="{{ cover | absoluteURL }}" />
<meta name="twitter:image" content="{{ cover | absoluteURL }}" />
{% endif %}
<meta name="twitter:card" content="summary" />
</head>
<body data-font="english" data-path="{{page.url}}">
{% include "-header.njk" %}
<main>
{{ content | safe }}
</main>
{% include "-footer.njk" %}
</body>
<script>
function setScrollAmount() {
const body = document.documentElement || document.body;
const scrolledFraction =
body.scrollTop / (body.scrollHeight - body.clientHeight);
body.style.setProperty("--scrollLengthPx", body.scrollTop);
}
setScrollAmount();
document.addEventListener("scroll", setScrollAmount);
document.addEventListener("resize", setScrollAmount);
</script>
</html>