{{#extends "base"}}
{{#block "main"}}
<article class="post">
  <!-- Typed to the page, not the site. The base layout's Blog/WebPage graph
       says a blog exists; it never said this page is an article, by whom, or
       when — which is exactly what an answer engine needs to cite it. -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@graph": [
      {
        "@type": "BlogPosting",
        "@id": "{{permalink}}#article",
        "headline": "{{post_title}}",
        "description": "{{description}}",
        "datePublished": "{{post_iso}}",
        "image": "{{site_url}}images/screenshot.png",
        "inLanguage": "{{language}}",
        "articleSection": "{{post_cat}}",
        "author": { "@type": "Person", "name": "{{post_author}}" },
        "mainEntityOfPage": { "@id": "{{permalink}}" },
        "isPartOf": { "@id": "{{site_url}}#blog" }
      },
      {
        "@type": "BreadcrumbList",
        "itemListElement": [
          { "@type": "ListItem", "position": 1, "name": "{{nav_home}}", "item": "{{site_url}}" },
          { "@type": "ListItem", "position": 2, "name": "{{post_title}}", "item": "{{permalink}}" }
        ]
      }
    ]
  }
  </script>

  <div class="wrap narrow post-head">
    <nav class="crumbs" aria-label="{{label_crumbs}}">
      <ol>
        <li><a href="{{locale_path}}">{{nav_home}}</a></li>
        <li><span aria-current="page">{{post_title}}</span></li>
      </ol>
    </nav>
    <p class="post-cat">{{post_cat}}</p>
    <h1 class="post-h">{{post_title}}</h1>
    <p class="post-meta">
      <span class="post-author">{{post_author}}</span>
      <span class="card-sep" aria-hidden="true">&#183;</span>
      <time datetime="{{post_iso}}">{{post_date}}</time>
      <span class="card-sep" aria-hidden="true">&#183;</span>
      <span>{{post_read}}</span>
    </p>
  </div>

  <p class="post-media"><span class="post-art post-art-1"></span></p>

  <div class="wrap narrow prose">
    {{!content}}
  </div>

  <div class="wrap narrow">
    <nav class="pager" aria-label="{{label_pager}}">
      <a class="pager-link pager-prev" href="{{prev_href}}">
        <span class="pager-dir">{{label_prev}}</span>
        <span class="pager-name">{{prev_label}}</span>
      </a>
      <a class="pager-link pager-next" href="{{next_href}}">
        <span class="pager-dir">{{label_next}}</span>
        <span class="pager-name">{{next_label}}</span>
      </a>
    </nav>
  </div>
</article>
{{/block}}