f47ed93fa0
becase it's easy to write, forces me to use some sort of structure, and it might come handy. However, the end HTML is microformats v1 and v2 - v1 for google, search engines, etc, v2 for anything indieweb.
266 lines
11 KiB
HTML
266 lines
11 KiB
HTML
{% extends "base.j2.html" %}
|
|
|
|
{% block lang %} lang="{{ post.inLanguage }}" {% endblock %}
|
|
|
|
{% block title %}{{ post.headline }} - {{ site.name }}{% endblock %}
|
|
|
|
{% block meta %}
|
|
<meta name="description" content="{{ post.description|striptags|e }}" />
|
|
<link rel="canonical" href="{{ post.url }}" />
|
|
<meta property="og:title" content="{{ post.headline }}" />
|
|
<meta property="og:type" content="article" />
|
|
<meta property="og:url" content="{{ post.url }}" />
|
|
<meta property="og:description" content="{{ post.description|striptags|e }}" />
|
|
<meta property="article:published_time" content="{{ post.datePublished }}" />
|
|
<meta property="article:modified_time" content="{{ post.dateModified }}" />
|
|
<meta property="article:author" content="{{ post.author.name }} ({{ post.author.email}})" />
|
|
{% if post.image.url is defined %}
|
|
<meta property="og:image" content="{{ post.image.url }}" />
|
|
<meta property="og:image:type" content="{{ post.image.encodingFormat }}" />
|
|
<meta property="og:image:width" content="{{ post.image.width }}" />
|
|
<meta property="og:image:height" content="{{ post.image.height }}" />
|
|
{% else %}
|
|
<meta property="og:image" content="{{ post.image }}" />
|
|
{% endif %}
|
|
|
|
{% if post['@type'] == 'TechArticle' %}
|
|
<style media="all">
|
|
{% include('prism.css') %}
|
|
</style>
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block prism %}
|
|
{% if post['@type'] == 'TechArticle' %}
|
|
<script>
|
|
{% include('prism.js') %}
|
|
</script>
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<main>
|
|
<article class="h-entry hentry" lang="{{ post.inLanguage }}" id="article">
|
|
<header>
|
|
<h1 class="p-name entry-title">
|
|
{% if post.mentions %}
|
|
<span>
|
|
<svg width="16" height="16">
|
|
<use xlink:href="#icon-reply" />
|
|
</svg>
|
|
<a href="{{ post.url }}">
|
|
RE:
|
|
</a>
|
|
<a href="{{ post.mentions.url }}" class="u-in-reply-to">
|
|
{{ post.mentions.url }}
|
|
</a>
|
|
</span>
|
|
{% else %}
|
|
<a href="{{ post.url }}">
|
|
{{ post.headline }}
|
|
</a>
|
|
{% endif %}
|
|
</h1>
|
|
</header>
|
|
|
|
{% if post.review %}
|
|
<div class="h-review hreview">
|
|
<strong>Review summary of: <a href="{{ post.review.url }}" class="p-name u-url p-item h-product item fn">{{ post.review.name }}</a></strong>
|
|
<p>
|
|
By
|
|
<span class="p-author h-card reviewer vcard">
|
|
<a class="p-name u-url fn" href="{{ post.author.url }}">
|
|
<span>{{ post.author.name }}</span>
|
|
</a></span> in <time class="dt-published dtreviewed" datetime="{{ post.datePublished }}" title="{{ post.datePublished }}">{{ post.datePublished|printdate }}</time>
|
|
</p>
|
|
<p>
|
|
<span class="rating">
|
|
<span class="value p-rating">{{ post.review.reviewRating.ratingValue }}</span>
|
|
out of
|
|
<span class="best">{{ post.review.reviewRating.bestRating }}</span>
|
|
</span>
|
|
</p>
|
|
<p class="p-summary summary">{{ post.review.text }}</p>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if post.description|length %}
|
|
<div class="e-summary entry-summary">
|
|
{{ post.description }}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="e-content entry-content">
|
|
{{ post.text }}
|
|
</div>
|
|
|
|
<footer>
|
|
<dl>
|
|
{% if post.subjectOf %}
|
|
<dt>Trip details</dt>
|
|
<dd class="h-event vevent">
|
|
<span class="summary">
|
|
From
|
|
<time class="dt-start dtstart" datetime="{{ post.subjectOf.startDate }}">
|
|
{{ post.subjectOf.startDate|printdate }}
|
|
</time>
|
|
to
|
|
<time class="dt-end dtend" datetime="{{ post.subjectOf.endDate }}">
|
|
{{ post.subjectOf.endDate|printdate }}
|
|
</time>, in
|
|
<span class="p-location location">
|
|
{{ post.subjectOf.location.name }}
|
|
</span>
|
|
</span>
|
|
<a class="u-url url" href="{{ post.url }}"></a>
|
|
</dd>
|
|
{% endif %}
|
|
|
|
<dt>Published</dt>
|
|
<dd>
|
|
<time datetime="{{ post.datePublished }}" class="dt-published published">{{ post.datePublished|printdate }}</time>
|
|
<time datetime="{{ post.dateModified }}" class="dt-updated updated"></time>
|
|
</dd>
|
|
|
|
<dt>License</dt>
|
|
<dd class="license">
|
|
{% if 'CC-BY-4.0' in post.license %}
|
|
<a rel="license" href="{{ post.license }}" 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 'CC-BY-NC-4.0' in post.license %}
|
|
<a rel="license" href="{{ post.license }}" 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.
|
|
{% elif 'CC-BY-NC-ND-4.0' in post.license %}
|
|
<a rel="license" href="{{ post.license }}" 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>Author</dt>
|
|
<dd class="p-author h-card vcard">
|
|
<img class="u-photo photo" src="{{ post.author.image }}" alt="" />
|
|
<a class="p-name u-url fn url" href="{{ post.author.url }}">{{ post.author.name }}</a>
|
|
<a class="u-email email" href="mailto:{{ post.author.email }}">{{ post.author.email }}</a>
|
|
</dd>
|
|
|
|
<dt>Entry URL</dt>
|
|
<dd>
|
|
<a class="u-url u-uuid bookmark" href="{{ post.url }}">
|
|
{{ post.url }}
|
|
</a>
|
|
</dd>
|
|
|
|
{% if post.sameAs|length %}
|
|
<dt>Also on</dt>
|
|
<dd>
|
|
<ul>
|
|
{% for url in post.sameAs %}
|
|
<li>
|
|
<a class="u-syndication" href="{{ url }}">
|
|
{{ url }}
|
|
</a>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
</dd>
|
|
{% endif %}
|
|
|
|
</dl>
|
|
</footer>
|
|
|
|
{% if 'WebPage' != post['@type'] %}
|
|
<section class="syndication">
|
|
{% for action in post.potentialAction %}
|
|
{% if 'InteractAction' == action['@type'] %}
|
|
<a href="{{ action.url }}"></a>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</section>
|
|
|
|
<section class="encourage">
|
|
<h2>Encourage creation!</h2>
|
|
<p>
|
|
If this entry helped you, or you simply liked it, leave a tip via <br />
|
|
{% set counters = {'donation': False} %}
|
|
{% for donate in post.potentialAction %}
|
|
{% if 'DonateAction' == donate['@type'] %}
|
|
{% if counters.donation %} or {% endif %}
|
|
<a href="{{ donate.url }}">
|
|
<svg width="16" height="16">
|
|
<use xlink:href="#icon-{{ donate.name }}"></use>
|
|
</svg> {{ donate.description }}</a>
|
|
{% if counters.update({'donation': True}) %} {% endif %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</p>
|
|
</section>
|
|
|
|
{% if post.comment|length %}
|
|
<section class="comments">
|
|
<h2><a id="comments"></a>Responses</h2>
|
|
<ol>
|
|
{% for comment in post.comment %}
|
|
<li class="h-entry p-comment hentry">
|
|
<a href="{{ comment.url }}">
|
|
{{ comment.disambiguatingDescription }}
|
|
</a>
|
|
from
|
|
<span class="p-author h-card vcard">
|
|
{% if comment.author.url %}
|
|
<a class="u-url p-name fn" href="{{ comment.author.url }}">
|
|
{{ comment.author.name }}
|
|
</a>
|
|
{% else %}
|
|
<span class="p-name fn">
|
|
{{ comment.author.name }}
|
|
</span>
|
|
{% endif %}
|
|
</span>
|
|
at
|
|
<time class="dt-published published" datetime="{{ comment.datePublished }}">
|
|
{{ comment.datePublished|printdate }}
|
|
</time>
|
|
<br />
|
|
<svg width="16" height="16">
|
|
<use xlink:href="#icon-link"></use>
|
|
</svg>
|
|
<a class="u-url" href="{{ comment.url }}">
|
|
{{ comment.url }}
|
|
</a>
|
|
<a href="{{ post.url }}" class="u-in-reply-to"></a>
|
|
</li>
|
|
{% endfor %}
|
|
</ol>
|
|
</section>
|
|
{% endif %}
|
|
|
|
{% endif %}
|
|
</article>
|
|
</main>
|
|
{% endblock %}
|