8298c98039
All checks were successful
Build and copy to prod / build-and-copy (push) Successful in 1m28s
137 lines
4.4 KiB
Plaintext
137 lines
4.4 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 %}
|
|
|
|
{% if not isCSSNakedDay %}
|
|
<link rel="stylesheet" type="text/css" href="/assets/css/styles.css">
|
|
{% endif %}
|
|
<link rel="alternate" type="application/rss+xml" title="LewisDale.Dev" href="{{ feed.rss if feed.rss else "/rss.xml" }}">
|
|
<link rel="alternate" type="application/atom+xml" title="LewisDale.Dev Atom Feed" href="{{ feed.atom if feed.atom else "/atom.xml" }}">
|
|
<link rel="alternate" type="application/json" title="LewisDale.Dev JSON Feed" href="{{ feed.json if feed.json else "/feed.json" }}">
|
|
|
|
<link rel="me" href="https://proven.lol/f730ca">
|
|
<link rel="me" href="https://social.lol/@lewis">
|
|
<link rel="me" href="https://github.com/LewisDaleUK">
|
|
|
|
<link rel="canonical" href="{{ metadata.site.url }}{{ page.url }}">
|
|
<link rel="webmention" href="https://webmention.io/lewisdale.dev/webmention">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="generator" content="eleventy">
|
|
<meta name="color-scheme" content="light dark">
|
|
|
|
<meta name="author" content="{{ metadata.author.name }}">
|
|
<meta name="description" content="{{ excerpt if excerpt else description }}">
|
|
<meta name="fediverse:creator" content="@lewis@social.lol" />
|
|
|
|
{% ogImage "./_includes/components/ogImage.njk", { title: pageTitle or title, subTitle: description } %}
|
|
|
|
{% if not dev %}
|
|
<script defer src="https://umami.lewisdale.dev/script.js" data-website-id="4f1be7ef-7fb4-4b08-81f1-68fb807a3063"></script>
|
|
{% endif %}
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="switcher-lg">
|
|
<nav class="main-nav">
|
|
<ul role='list'>
|
|
<li><a href="/">Home</a></li>
|
|
<li><a href="/blog">Blog</a></li>
|
|
<li><a href="/links">Links</a></li>
|
|
<li><a href="/blogroll">/Blogroll</a></li>
|
|
<li><a href="/uses">/Uses</a></li>
|
|
<li>
|
|
<a href="/feed/" class="rss" aria-label="RSS feed">
|
|
<i class="fa-solid fa-rss"></i>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<fieldset class="color-scheme">
|
|
<legend>Change your colour scheme</legend>
|
|
<div class="switcher-sm">
|
|
<label>
|
|
<input type="radio" name="color-scheme" value="dark">
|
|
Dark
|
|
</label>
|
|
<label>
|
|
<input type="radio" name="color-scheme" value="light">
|
|
Light
|
|
</label>
|
|
<label>
|
|
<input type="radio" name="color-scheme" value="system">
|
|
System
|
|
</label>
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</header>
|
|
<div class="content">
|
|
{{ content | safe }}
|
|
</div>
|
|
<footer>
|
|
<div class="wrapper-lg mx-auto text-center">Copyright © {{ today.year }} {{ metadata.author.name }}</div>
|
|
|
|
<div class="wrapper-xs mx-auto my-size-xs">
|
|
<p class="text-center">Part of the CSS JOY webring</p>
|
|
<div class="row" data-spacing="between">
|
|
<a href="https://webri.ng/webring/cssjoy/previous?via=https://lewisdale.dev">Previous</a>
|
|
<a href="https://webri.ng/webring/cssjoy/random?via=https://lewisdale.dev">Random</a>
|
|
<a href="https://webri.ng/webring/cssjoy/next?via=https://lewisdale.dev">Next</a>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
|
|
<script>
|
|
const defaultColourScheme = () => {
|
|
if (localStorage.getItem('color-scheme')) {
|
|
return localStorage.getItem('color-scheme');
|
|
}
|
|
|
|
return "system";
|
|
};
|
|
|
|
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>
|