183 lines
7.6 KiB
HTML
183 lines
7.6 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<html lang="{% block html_lang %}{{ DEFAULT_LANG }}{% endblock html_lang %}">
|
|
|
|
<head>
|
|
{% block head %}
|
|
<title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
|
|
<meta charset="utf-8" />
|
|
<script>
|
|
(function () {
|
|
const stored = localStorage.getItem('theme');
|
|
if (stored === 'dark' || stored === 'light') {
|
|
document.documentElement.setAttribute('data-theme', stored);
|
|
}
|
|
})();
|
|
</script>
|
|
<link rel="stylesheet" type="text/css" href="{{ main_siteurl | default(SITEURL) }}/theme/css/site.css" />
|
|
|
|
{% if FEED_ALL_ATOM %}
|
|
<link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_ATOM_URL %}{{ FEED_ALL_ATOM_URL }}{% else %}{{ FEED_ALL_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
|
|
{% endif %}
|
|
{% if FEED_ALL_RSS %}
|
|
<link href="{{ FEED_DOMAIN }}/{% if FEED_ALL_RSS_URL %}{{ FEED_ALL_RSS_URL }}{% else %}{{ FEED_ALL_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" />
|
|
{% endif %}
|
|
{% if FEED_ATOM %}
|
|
<link href="{{ FEED_DOMAIN }}/{%if FEED_ATOM_URL %}{{ FEED_ATOM_URL }}{% else %}{{ FEED_ATOM }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Atom Feed" />
|
|
{% endif %}
|
|
{% if FEED_RSS %}
|
|
<link href="{{ FEED_DOMAIN }}/{% if FEED_RSS_URL %}{{ FEED_RSS_URL }}{% else %}{{ FEED_RSS }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
|
|
{% endif %}
|
|
{% if CATEGORY_FEED_ATOM and category %}
|
|
<link href="{{ FEED_DOMAIN }}/{% if CATEGORY_FEED_ATOM_URL %}{{ CATEGORY_FEED_ATOM_URL.format(slug=category.slug) }}{% else %}{{ CATEGORY_FEED_ATOM.format(slug=category.slug) }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Categories Atom Feed" />
|
|
{% endif %}
|
|
{% if CATEGORY_FEED_RSS and category %}
|
|
<link href="{{ FEED_DOMAIN }}/{% if CATEGORY_FEED_RSS_URL %}{{ CATEGORY_FEED_RSS_URL.format(slug=category.slug) }}{% else %}{{ CATEGORY_FEED_RSS.format(slug=category.slug) }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Categories RSS Feed" />
|
|
{% endif %}
|
|
{% if TAG_FEED_ATOM and tag %}
|
|
<link href="{{ FEED_DOMAIN }}/{% if TAG_FEED_ATOM_URL %}{{ TAG_FEED_ATOM_URL.format(slug=tag.slug) }}{% else %}{{ TAG_FEED_ATOM.format(slug=tag.slug) }}{% endif %}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Tags Atom Feed" />
|
|
{% endif %}
|
|
{% if TAG_FEED_RSS and tag %}
|
|
<link href="{{ FEED_DOMAIN }}/{% if TAG_FEED_RSS_URL %}{{ TAG_FEED_RSS_URL.format(slug=tag.slug) }}{% else %}{{ TAG_FEED_RSS.format(slug=tag.slug) }}{% endif %}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Tags RSS Feed" />
|
|
{% endif %}
|
|
{% endblock head %}
|
|
</head>
|
|
|
|
<body id="index" class="home">
|
|
<header id="banner" class="body">
|
|
<div class="header-controls">
|
|
{% if extra_siteurls is defined %}
|
|
<ul class="lang-switcher">
|
|
{% for lang, siteurl in extra_siteurls.items() %}
|
|
<li>
|
|
{% if article is defined and article %}
|
|
<a href="{{ siteurl }}/{{ article.slug }}.html">{{ lang }}</a>
|
|
{% elif page is defined and page %}
|
|
<a href="{{ siteurl }}/pages/{{ page.slug }}.html">{{ lang }}</a>
|
|
{% else %}
|
|
<a href="{{ siteurl }}/">{{ lang }}</a>
|
|
{% endif %}
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
<span class="header-delimiter">·</span>
|
|
{% endif %}
|
|
<button id="theme-toggle" aria-label="Toggle color theme">◐</button>
|
|
</div>
|
|
<h1><a href="{{ SITEURL }}/">{{ SITENAME }} <strong>{{ SITESUBTITLE }}</strong></a></h1>
|
|
</header><!-- /#banner -->
|
|
|
|
<div id="container">
|
|
<nav id="menu">
|
|
{% for title, link in MENUITEMS %}
|
|
<ul class="menuitems">
|
|
<li><a href="{{ link }}">{{ title }}</a></li>
|
|
</ul>
|
|
{% endfor %}
|
|
{% if DISPLAY_PAGES_ON_MENU %}
|
|
<ul id="pages" class="menuitems">
|
|
{% for p in pages %}
|
|
<li{% if p == page %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ p.url }}">{{ p.title }}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endif %}
|
|
{% if DISPLAY_RECENT_ARTICLES_ON_MENU | default(true) and articles is defined and articles %}
|
|
<ul id="recent-articles" class="menuitems">
|
|
{% for recent_article in articles[:(RECENT_ARTICLES_COUNT | default(10))] %}
|
|
<li{% if article is defined and recent_article == article %} class="active"{% endif %}>
|
|
<a href="{{ SITEURL }}/{{ recent_article.url }}">{{ recent_article.title }}</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endif %}
|
|
{% if DISPLAY_CATEGORIES_ON_MENU %}
|
|
<ul id="categories" class="menuitems">
|
|
{% for cat, null in categories %}
|
|
<li{% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endif %}
|
|
</nav><!-- /#menu -->
|
|
<main id="content">
|
|
{% block content %}
|
|
{% endblock %}
|
|
</main><!-- /#content -->
|
|
</div>
|
|
|
|
<footer id="contentinfo" class="body">
|
|
<address id="about" class="vcard body">
|
|
Proudly powered by <a href="http://getpelican.com/">Pelican</a>, which takes great advantage of <a href="http://python.org">Python</a>.
|
|
</address><!-- /#about -->
|
|
</footer><!-- /#contentinfo -->
|
|
|
|
<div class="lightbox-overlay" id="lightbox-overlay">
|
|
<div class="lightbox-content">
|
|
<img id="lightbox-img" src="" alt="">
|
|
<p id="lightbox-caption"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const overlay = document.getElementById('lightbox-overlay');
|
|
const overlayImg = document.getElementById('lightbox-img');
|
|
const overlayCaption = document.getElementById('lightbox-caption');
|
|
|
|
document.querySelectorAll('.entry-content img').forEach(function (img, index) {
|
|
const figureNumber = index + 1;
|
|
|
|
img.addEventListener('click', function () {
|
|
overlayImg.src = img.src;
|
|
overlayImg.alt = img.alt;
|
|
const captionEl = img.nextElementSibling;
|
|
const captionText = (captionEl && captionEl.tagName === 'EM') ? captionEl.textContent : '';
|
|
overlayCaption.innerHTML = captionText
|
|
? '<span class="fig-number">Figure ' + figureNumber + ':</span> ' + captionText
|
|
: '';
|
|
overlay.classList.add('active');
|
|
});
|
|
});
|
|
|
|
overlay.addEventListener('click', function () {
|
|
overlay.classList.remove('active');
|
|
overlayImg.src = '';
|
|
overlayCaption.innerHTML = '';
|
|
});
|
|
|
|
document.addEventListener('keydown', function (e) {
|
|
if (e.key === 'Escape') {
|
|
overlay.classList.remove('active');
|
|
overlayImg.src = '';
|
|
overlayCaption.innerHTML = '';
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const toggleBtn = document.getElementById('theme-toggle');
|
|
const root = document.documentElement;
|
|
|
|
function getCurrentTheme() {
|
|
const attr = root.getAttribute('data-theme');
|
|
if (attr) return attr;
|
|
return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
|
|
}
|
|
|
|
function updateIcon() {
|
|
toggleBtn.textContent = getCurrentTheme() === 'dark' ? '☀' : '☾';
|
|
}
|
|
updateIcon();
|
|
toggleBtn.addEventListener('click', function () {
|
|
const next = getCurrentTheme() === 'dark' ? 'light' : 'dark';
|
|
root.setAttribute('data-theme', next);
|
|
localStorage.setItem('theme', next);
|
|
updateIcon();
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|