nasg/templates/base.j2.html

430 lines
16 KiB
HTML
Raw Normal View History

2018-07-20 16:45:42 +01:00
<!DOCTYPE html>
<html {% block lang %}lang="{{ post.lang }}"{% endblock %}>
<head>
<title>{% block title %}{{ post.title }} - {{ site.domain }}{% endblock %}</title>
2018-07-20 16:45:42 +01:00
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1" />
<link rel="icon" href="{{ site.url }}/favicon.ico" />
2018-07-20 16:45:42 +01:00
{% for key, value in meta.items() %}
<link rel="{{ key }}" href="{{ value }}" />
{% endfor %}
{% block meta %}{% endblock %}
<style media="all">
{% include 'style.css' %}
2018-07-20 16:45:42 +01:00
</style>
<style id="css_alt" media="none">
{% include 'style-alt.css' %}
2018-07-20 16:45:42 +01:00
</style>
<style media="print">
{% include 'style-print.css' %}
</style>
<script>
/* color scheme switcher */
var current = localStorage.getItem("stylesheet");
if (current) {
document.querySelector('#css_alt').setAttribute("media", current);
2018-07-20 16:45:42 +01:00
}
function toggleStylesheet(trigger){
var setto = 'all';
var e = document.querySelector('#css_alt');
2018-07-20 16:45:42 +01:00
if (e.getAttribute("media") == 'all') {
setto = 'none';
}
localStorage.setItem("stylesheet", setto);
e.setAttribute("media", setto);
return false;
2018-07-20 16:45:42 +01:00
}
</script>
{% block prism %}
{% endblock %}
2018-07-20 16:45:42 +01:00
</head>
<body>
{% macro activemenu(name) %}{% if (post is defined and post.category == name ) or ( category is defined and category.name == name ) %}active{% endif %}{% endmacro %}
<header>
<nav>
2018-07-20 16:45:42 +01:00
<ul>
<li>
<a title="home" href="/" class="{{ activemenu('') }}">
<svg class="icon" width="16" height="16"><use xlink:href="#icon-home" /></svg>
home
</a>
</li>
<li>
<a title="photos" href="/category/photo/" class="{{ activemenu('photo') }}">
<svg class="icon" width="18" height="16"><use xlink:href="#icon-photo" /></svg>
photos
</a>
</li>
<li>
<a title="journal" href="/category/journal/" class="{{ activemenu('journal') }}">
<svg class="icon" width="16" height="16"><use xlink:href="#icon-journal" /></svg>
journal
</a>
</li>
<li>
<a title="IT" href="/category/article/" class="{{ activemenu('article') }}">
<svg class="icon" width="16" height="16"><use xlink:href="#icon-article" /></svg>
IT
</a>
</li>
<li>
<a title="notes" href="/category/note/" class="{{ activemenu('note') }}">
<svg class="icon" width="16" height="16"><use xlink:href="#icon-note" /></svg>
notes
</a>
</li>
</ul>
</nav>
<form role="search" method="get" action="/search.php">
2018-07-20 16:45:42 +01:00
<label for="s">Search</label>
<input type="search" placeholder="search..." value="" name="q" id="q" title="Search for:" />
<input type="submit" value="Go ➡" />
2018-07-20 16:45:42 +01:00
</form>
<p class="contrast">
<a title="toggle site colour scheme" href="#"
onclick="return toggleStylesheet(this)">
2018-07-20 16:45:42 +01:00
<svg class="icon" width="16" height="16">
<use xlink:href="#icon-contrast" />
</svg>
</a>
</p>
</header>
{% block content %}
<section>
2018-07-20 16:45:42 +01:00
<article class="h-entry hentry singular" lang="{{ post.lang }}">
<header>
<h1>
{% if post.is_reply %}
<span class="p-name">
<svg class="icon" width="16" height="16">
<use xlink:href="#icon-reply" />
</svg>
<a href="/{{ post.slug }}/" class="u-url">
RE:
</a>
<a href="{{ post.is_reply }}" class="u-in-reply-to">
{{ post.is_reply }}
</a>
</span>
{% else %}
<a href="/{{ post.slug }}/" title="{{ post.title }}">
<span class="entry-title p-name">{{ post.title }}</span>
</a>
{% endif %}
</h1>
</header>
{% if post.review %}
<div class="h-review hreview">
<h2>Review summary</h2>
<p>
<a href="{{ post.review.url }}" class="p-name url fn p-item h-product">
{{ post.review.title }}
</a>
</p>
<p>
<span class="rating">
<span class="value">{{ post.review.rating }}</span>
out of
<span class="best">5</span>
</span>
</p>
<p class="p-summary">{{ post.review.summary }}</p>
</div>
{% endif %}
{% if post.summary %}
<div class="e-summary entry-summary">
{{ post.html_summary }}
</div>
{% endif %}
<div class="e-content entry-content">
{{ post.html_content }}
2018-07-20 16:45:42 +01:00
</div>
<footer>
<dl>
<dt>Published</dt>
<dd class="published">
<time class="dt-published" datetime="{{ post.pubtime }}">{{ post.pubdate }}</time>
</dd>
<dt>Author</dt>
<dd>
<p class="p-author h-card vcard">
<img class="photo avatar u-photo u-avatar"
src="{{ author.avatar }}"
alt="Photo of {{ author.name }}" />
<a class="fn p-name url u-url u-uid" href="{{ author.url }}">
{{ author.name }}
</a>
&lt;<a rel="me" class="u-email email" href="mailto:{{ author.email }}">{{ author.email }}</a>&gt;
2018-07-20 16:45:42 +01:00
</p>
</dd>
<dt>Entry URL</dt>
<dd>
<a class="u-url u-uuid" rel="bookmark" href="{{ post.url }}">
{{ post.url }}
</a>
</dd>
<dt>License</dt>
<dd class="license">
{% if post.licence == 'by' %}
<a rel="license" href="https://creativecommons.org/licenses/by/4.0/" class="u-license">CC BY 4.0</a>
<ul>
<li>you can share it</li>
<li>you can republish it</li>
<li>you can modify it, but you need to indicate the modifications</li>
<li>you can use it for commercial purposes</li>
<li>you always need to make a link back here</li>
</ul>
{% elif post.licence.text == 'by-nc' %}
<a rel="license" href="https://creativecommons.org/licenses/by-nc/4.0/" class="u-license">CC BY-NC 4.0</a>
<ul>
<li>you can share it</li>
<li>you can republish it</li>
<li>you can modify it, but you need to indicate the modifications</li>
<li>you can't use it for commercial purposes</li>
<li>you always need to make a link back here</li>
</ul>
For commercial use, please contact me.
{% else %}
<a rel="license" href="https://creativecommons.org/licenses/by-nc-nd/4.0/" class="u-license">CC BY-NC-ND 4.0</a>
<ul>
<li>you can share it</li>
<li>you can't modify it</li>
<li>you can't republish it</li>
<li>you can't use it for commercial purposes</li>
<li>you always need to make a link back here</li>
</ul>
For commercial use, please contact me.
{% endif %}
</dd>
<dt class="noprint">Leave a tip</dt>
<dd class="donation">
<p>
{% if post.category in labels.tiptext.keys(): %}
{{ labels.tiptext[post.category] }}
{% else %}
Did you like what you read?<br />Leave a tip!
{% endif %}
</p>
<ul>
{% for tip in tips %}
<li>
<a rel="payment" title="pay {{ author.name }} via {{ tip.label }} {{ tip.value }}" href="{{ tip.url }}">
{{ tip.value }}
<span class="method">
<svg class="icon" width="16" height="16">
<use xlink:href="#icon-{{ tip.name }}"></use>
</svg>
with {{ tip.label }}
</span>
</a>
</li>
{% endfor %}
</ul>
</dd>
</dl>
</footer>
{% if post.syndicate|length %}
<section class="syndication">
{% for url in post.syndicate %}
<a href="{{ url }}" class="u-syndication"></a>
{% endfor %}
</section>
{% endif %}
{% if post.replies|length %}
<section class="replies">
<h2><a id="replies"></a>Replies</h2>
<ol>
{% for mtime, comment in post.replies.items() %}
<li class="h-entry p-comment">
<time class="dt-published" datetime="{{ comment.pubtime }}">
{{ comment.pubdate }}
</time> from
<span class="p-author h-card">
{% if comment.author.url %}
<a class="url u-url" href="{{ comment.author.url }}">
<span class="p-name fn">
{{ comment.author.name }}
</span>
</a>
{% else %}
<span class="p-name fn">
{{ comment.author.name }}
</span>
{% endif %}
</span><br />
<span class="source">
<svg class="icon" width="16" height="16">
<use xlink:href="#icon-link"></use>
</svg>
<a class="u-url" href="{{ comment.source }}">
{{ comment.source }}
</a>
</span>
</li>
{% endfor %}
</ol>
</section>
{% endif %}
{% if post.reactions|length %}
<section class="reactions">
<h2><a id="reactions"></a>Reactions</h2>
<dl>
{% for character, comments in post.reactions.items() %}
<dt>{{ character }}</dt>
<dd>
<ul>
{% for mtime, comment in comments.items() %}
<li class="h-entry p-comment">
<span class="reaction">
<a class="u-url" href="{{ comment.source }}">
{{ comment.type }}
</a>
</span>
<time class="dt-published" datetime="{{ comment.pubtime }}">
{{ comment.pubdate }}
</time> from
<span class="p-author h-card">
{% if comment.author.url %}
<a class="url u-url" href="{{ comment.author.url }}">
<span class="p-name fn">
{{ comment.author.name }}
</span>
</a>
{% else %}
<span class="p-name fn">
{{ comment.author.name }}
</span>
{% endif %}
</span>
</li>
{% endfor %}
</ul>
</dd>
{% endfor %}
</dl>
</section>
{% endif %}
</article>
</section>
{% endblock %}
{% block pagination %}
{% endblock %}
<footer>
<div class="limit">
<nav class="p-author h-card vcard">
<h2>Contact</h2>
<div>
<dl>
<dt>
<img class="photo avatar u-photo u-avatar"
src="https://petermolnar.net/molnar_peter_avatar.jpg"
alt="Photo of Peter Molnar" />
</dt>
<dd>
<a class="fn p-name url u-url u-uid" href="/about.html">
Peter Molnar
</a>
</dd>
<dt>email</dt>
<dd>
<a rel="me" class="u-email email" href="mailto:{{ author.email }}">
{{ author.email }}
</a>
</dd>
{% if author.gpg %}
<dt>GPG</dt>
<dd>
<a rel="me" class="u-gpg gpg" href="/{{ author.gpg }}">key</a>
</dd>
{% endif %}
<dt>url</dt>
<dd>
<a rel="me" class="u-url url" href="{{ author.url }}">
{{ author.url }}
</a>
</dd>
</dl>
</div>
<div>
<dl>
{% if author.xmpp %}
<dt>XMPP</dt>
<dd>
<a rel="me" class="u-xmpp xmpp" href="xmpp:{{ author.xmpp }}">{{ author.xmpp }}</a>
</dd>
{% endif %}
{% if author.sip %}
<dt>SIP</dt>
<dd>
<a rel="me" class="u-sip sip" href="sip:{{ author.sip }}">
{{ author.sip }}
</a>
</dd>
{% endif %}
{% if author.icq %}
<dt>ICQ</dt>
<dd>
<a rel="me" class="u-icq icq" href="icq:{{ author.icq }}">
{{ author.icq }}
</a>
</dd>
{% endif %}
{% if author.flickr %}
<dt>flickr</dt>
<dd>
<a rel="me" class="u-flickr" href="https://flickr.com/people/{{ author.flickr }}">{{ author.flickr }}</a>
</dd>
{% endif %}
{% if author.github %}
<dt>github</dt>
<dd>
<a rel="me" class="u-github" href="https://github.com/{{ author.github }}">{{ author.github }}</a>
</dd>
{% endif %}
{% if author.twitter %}
<dt>twitter</dt>
<dd>
<a rel="me" class="u-twitter" href="https://twitter.com/{{ author.twitter }}">{{ author.twitter }}</a>
</dd>
{% endif %}
</dl>
</div>
</nav>
<div class="webring">
<a href="https://xn--sr8hvo.ws/🇻🇮📢/previous"></a>
Member of <a href="https://xn--sr8hvo.ws">IndieWeb Webring</a>
<a href="https://xn--sr8hvo.ws/🇻🇮📢/next"></a>
</div>
</div>
2018-07-20 16:45:42 +01:00
</footer>
{% include 'symbols.svg' %}
</body>
</html>