{% extends "base.html" %}

{% block head %}
  {% include "snippets/blog-imports.html" %}
  <script src="{{ config.services.common.url.pub }}/static/js/base.js?v={{ config.version_str }}"></script>
{% endblock %}

{% block body %}
  <h1>{{ blog.title }}</h1>
  <div><b>By <a href="/blog/{{ blog.u_by.username }}">{{ blog.u_by.username }}</a></b></div>
  <small data-timestamp="{{ blog.timestamp }}"></small>
  {% if username == blog.u_by.username %}
    <form method="POST">
      {% csrf_token %}
      <p>
        <input type="checkbox" required id="confirm">
        <label data-fake-checkbox for="confirm">I understand this is irreversible</label><br>
        <input type="submit" value="Delete this post">
      </p>
    </form>
  {% endif %}
  <hr>
  <div id="blog-container" style="max-width: 1000px; width: 90vw;" class="inline-block left" data-format="{{ blog.text_format }}" data-raw="{{ blog.content }}"><i>Loading...</i></div>

  <script>
    const blog = document.getElementById("blog-container");
    blog.innerHTML = toHTML(blog.dataset.format, blog.dataset.raw);
  </script>
{% endblock %}