101 lines
2.8 KiB
HTML
101 lines
2.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="Site with Zola Hook">
|
|
<title>DraigerCMS</title>
|
|
|
|
<link rel="stylesheet" href="/style.css?h=c59bf21e289e8d31d2b7">
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<link rel="alternate" type="application/atom+xml" title="DraigerCMS - Atom Feed" href="/atom.xml">
|
|
|
|
|
|
|
|
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<header class="space">
|
|
<h1>DraigerCMS</h1>
|
|
|
|
|
|
<nav class="header-links">
|
|
|
|
<a href="mailto:dr_chanmp@disroot.org">Mail</a>
|
|
|
|
<a href="https://github.com/draigercms">GitHub</a>
|
|
|
|
<a href="https://mstdn.plus/@draigercms">Mastodon</a>
|
|
|
|
|
|
</nav>
|
|
|
|
</header>
|
|
|
|
|
|
|
|
|
|
<main>
|
|
|
|
|
|
<h2>Recent posts</h2>
|
|
<ul>
|
|
|
|
<li><a href="/blog/about/">About</a></li>
|
|
|
|
</ul>
|
|
<p><a href="/blog/">Archive</a></p>
|
|
|
|
</main>
|
|
|
|
|
|
<div class="dark-mode-buttons">
|
|
<button class="dark-mode-button" id="dark-mode-on"><img src="/dark_mode.svg" width="24" height="24" alt="Dark mode" aria-label="dark mode toggle" title="Dark mode"></button>
|
|
<button class="dark-mode-button" id="dark-mode-off"><img src="/light_mode.svg" width="24" height="24" alt="Light mode" aria-label="light mode toggle" title="Light mode"></button>
|
|
</div>
|
|
<script>
|
|
const cls = document.querySelector("html").classList;
|
|
const sessionTheme = sessionStorage.getItem("theme");
|
|
|
|
function setDark() {
|
|
cls.add("dark-mode");
|
|
cls.remove("light-mode");
|
|
sessionStorage.setItem("theme", "dark");
|
|
}
|
|
function setLight() {
|
|
cls.add("light-mode");
|
|
cls.remove("dark-mode");
|
|
sessionStorage.setItem("theme", "light");
|
|
}
|
|
|
|
if (sessionTheme === "dark") {
|
|
setDark();
|
|
} else if (sessionTheme === "light") {
|
|
setLight();
|
|
} else if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
|
|
setDark();
|
|
}
|
|
|
|
document.getElementById("dark-mode-on").addEventListener("click", function(e) {
|
|
setDark();
|
|
});
|
|
document.getElementById("dark-mode-off").addEventListener("click", function(e) {
|
|
setLight();
|
|
});
|
|
</script>
|
|
<noscript>
|
|
<style>
|
|
.dark-mode-buttons {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</noscript>
|
|
</body>
|
|
</html>
|