120 lines
3.8 KiB
Plaintext
120 lines
3.8 KiB
Plaintext
<!doctype html>
|
|
<html lang="{{metadata.site.language}}">
|
|
<head>
|
|
<meta charset="UTF-8" >
|
|
|
|
<title>{{ title | safe }} | {{ metadata.site.name }}</title>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
href="/assets/favicon/light/favicon.ico"
|
|
media="(prefers-color-scheme: light)"
|
|
>
|
|
<link
|
|
rel="icon"
|
|
type="image/png"
|
|
href="/assets/favicon/dark/favicon.ico"
|
|
media="(prefers-color-scheme: dark)"
|
|
>
|
|
<link rel="stylesheet" type="text/css" href="/assets/css/fontawesome.min.css">
|
|
{% if includePrism %}
|
|
<link rel="stylesheet" type="text/css" href="/assets/css/prism.min.css">
|
|
{% endif %}
|
|
<link rel="stylesheet" type="text/css" href="/assets/css/styles.css">
|
|
{% if feed %}
|
|
<link rel="alternate" type="application/rss+xml" title="LewisDale.Dev" href="{{ feed }}">
|
|
<link rel="alternate" type="application/atom+xml" title="LewisDale.Dev Atom Feed" href="{{ feed }}atom">
|
|
<link rel="alternate" type="application/json" title="LewisDale.Dev JSON Feed" href="{{ feed }}json">
|
|
{% else %}
|
|
<link rel="alternate" type="application/rss+xml" title="LewisDale.Dev" href="/feed/">
|
|
<link rel="alternate" type="application/atom+xml" title="LewisDale.Dev Atom Feed" href="/feed/atom">
|
|
<link rel="alternate" type="application/json" title="LewisDale.Dev JSON Feed" href="/feed/json">
|
|
{% endif %}
|
|
<link rel="me" href="proven.lol/f730ca">
|
|
<link rel="me" href="https://social.lewisdale.dev/@lewis">
|
|
<link rel="me" href="https://github.com/LewisDaleUK">
|
|
|
|
<link rel="webmention" href="https://cms.lewisdale.dev/wp-json/webmention/1.0/endpoint">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="generator" content="eleventy">
|
|
|
|
<meta name="author" content="{{ metadata.author.name }}">
|
|
<meta name="description" content="{{ description }}">
|
|
</head>
|
|
<body>
|
|
<header class="wrapper-lg row space-between">
|
|
<a href="/" class="site-title">LD</a>
|
|
|
|
<nav>
|
|
<ul class="row" role='list'>
|
|
<li><a href="/">Home</a></li>
|
|
<li><a href="/now">Now</a></li>
|
|
<li><a href="/blog">Blog</a></li>
|
|
<li><a href="https://cycling.lewisdale.dev">Cycling</a></li>
|
|
<li><a href="/links">Links</a></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<a href="/feed/" class="rss">
|
|
<svg xmlns="http://www.w3.org/2000/svg" aria-label="RSS" role="img" viewBox="0 0 512 512">
|
|
<path d="m0 0H512V512H0" fill="none"/>
|
|
<path fill="currentColor" d="m109 271A132 133 0 01241 403h60A192 193 0 00109 211v-54A246 247 0 01355 403h60A306 307 0 00109 97m35 235a35 35 0 102 0"/>
|
|
</svg>
|
|
</a>
|
|
|
|
<fieldset class="color-scheme">
|
|
<legend>Change your colour scheme</legend>
|
|
<label>
|
|
<input type="radio" name="color-scheme" value="dark">
|
|
Dark
|
|
</label>
|
|
<label>
|
|
<input type="radio" name="color-scheme" value="light">
|
|
Light
|
|
</label>
|
|
</fieldset>
|
|
</header>
|
|
{{ content | safe }}
|
|
<footer>
|
|
<div class="wrapper-lg">Copyright © {{ today.year }} {{ metadata.author.name }}</div>
|
|
</footer>
|
|
|
|
|
|
<script>
|
|
const defaultColourScheme = () => {
|
|
if (localStorage.getItem('color-scheme')) {
|
|
return localStorage.getItem('color-scheme');
|
|
}
|
|
|
|
if (window.matchMedia('(prefers-color-scheme: dark)')?.matches) {
|
|
return "dark";
|
|
}
|
|
|
|
return "light";
|
|
};
|
|
|
|
const data = new Proxy({
|
|
'color-scheme': defaultColourScheme(),
|
|
}, {
|
|
set: (obj, key, value) => {
|
|
obj[key] = value;
|
|
localStorage.setItem(key, value);
|
|
document.body.setAttribute(`data-${key}`, value);
|
|
|
|
return true;
|
|
}
|
|
});
|
|
|
|
const onRadioChange = e => {
|
|
data[e.target.name] = e.target.value;
|
|
}
|
|
|
|
document.querySelectorAll('[name="color-scheme"]').forEach(radio => {
|
|
radio.addEventListener('change', onRadioChange);
|
|
radio.checked = data[radio.name] == radio.value;
|
|
});
|
|
document.body.setAttribute(`data-color-scheme`, localStorage.getItem('color-scheme'));
|
|
</script>
|
|
</body>
|
|
</html>
|