74 lines
2.4 KiB
HTML
74 lines
2.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="{{ settings.html_language }}">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="author" content="{{ album.author }}">
|
|
<meta property="og:site_name" content="{{ index_title }}">
|
|
<meta property="og:title" content="{{ album.title|striptags }}">
|
|
|
|
<title>{{ album.title|striptags }}</title>
|
|
|
|
<link rel="stylesheet" href="{{ theme.url }}/css/main.css">
|
|
|
|
{% block extra_head %}{% endblock extra_head %}
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1><a class="logo" href="{{ album.index_url }}">{{ index_title }} </a></h1>
|
|
{% if album.breadcrumb %}
|
|
<h2>
|
|
{% for url, title in album.breadcrumb %}
|
|
{% if loop.last and media is defined %}
|
|
» <a href="{{ url }}#{{ media.url }}">{{ title }}</a>
|
|
{% else %}
|
|
» <a href="{{ url }}">{{ title }}</a>
|
|
{% endif %}
|
|
{% endfor -%}
|
|
{% if media is defined %}
|
|
» <a href="{{ media.url }}.html">{{ media.title }}</a>
|
|
{% endif %}
|
|
</h2>
|
|
{% endif %}
|
|
{% include "links.html" %}
|
|
</header>
|
|
<main>
|
|
{% block content %}{% endblock content %}
|
|
</main>
|
|
<footer>
|
|
<p><a href="#" id="darkModeToggle">Toggle dark mode</a></p>
|
|
<p>Generated using <a href="https://github.com/saimn/sigal/">sigal</a>, custom theme <a href="https://git.bksp.space/BlackSponge/photos">available here</a>.
|
|
</footer>
|
|
<script type="text/javascript">
|
|
function setTheme(themeName) {
|
|
localStorage.setItem('theme', themeName);
|
|
document.body.setAttribute('theme', themeName);
|
|
return themeName;
|
|
}
|
|
|
|
function getPreferedTheme() {
|
|
let preferedTheme = window.getComputedStyle(document.body, '::after').content;
|
|
if (preferedTheme !== undefined) {
|
|
return preferedTheme.replace(/"/g, '');
|
|
}
|
|
return 'light';
|
|
}
|
|
|
|
let darkModeToggleElement = document.getElementById('darkModeToggle');
|
|
let theme = localStorage.getItem('theme') || getPreferedTheme();
|
|
|
|
setTheme(theme);
|
|
|
|
darkModeToggle.addEventListener('click', (e) => {
|
|
e.preventDefault();
|
|
|
|
if (theme === 'dark') {
|
|
theme = setTheme('light');
|
|
} else {
|
|
theme = setTheme('dark');
|
|
}
|
|
})
|
|
</script>
|
|
</body>
|
|
</html>
|