---
layout: base.njk
---

<article class="blogpost">
  <h1 class="text-4xl">{{ title }}</h1>
  <aside class="not-prose space-y-4 text-base">
    <ul class="postmeta">
      <li>
        {% lucide "calendar", {"size": "20"} %}
        <time datetime="{{ page.date | isoDate }}" title="{{ page.date | longDate }}">
          {{ page.date | readableDate }}
        </time>
      </li>
      <li>
        {% lucide "user", {"size": "20"} %}
        <a href="{{ author.href }}">{{ author.name }}</a>
      </li>
      <li>
        {% lucide "glasses", {"size": "20"} %}
        {{ content | readingtime }}
      </li>
    </ul>
    {% if tags.length > 0 %}
      <ul class="tags">
        {% for tag in tags %}
          <li class="tag">
            {% lucide "tag", {"size": "20"} %}
            {{ tag }}
          </li>
        {%- endfor %}
      </ul>
    {% endif %}
  </aside>

  {% if image and image.src != '' %}
    <img src="{{ image.src }}" alt="{{ image.alt }}">
  {% endif %}

  {{ content | safe }}
</article>