{% load bleach_tags %}
{% load duration %}
{% load humanize %}
{% load i18n %}
{% for post in posts %}
  <section class="activity post">
    <div style="display:flex;">
      <div>
        <div class="avatar" style="margin:0.6em 0.6em 0.6em 0;">
          <img src="{{ post.author.local_icon_url }}"
               alt="@{{ post.author.handle }}" />
        </div>
      </div>
      <div style="flex-grow:1;">
        <span class="action">
          <span class="timestamp">{{ post.published|naturaldelta }}</span>
          {% include "action_reply_post.html" %}
          {% include "action_like_post.html" %}
          {% include "action_boost_post.html" %}
          {% include "action_open_post.html" %}
        </span>
        <span>
          <a href="{{ post.author.url }}"
             class="nickname"
             title="@{{ post.author.handle }}">{{ post.author.name }}</a>
        </span>
        <div>{{ post.summary|default:'' }}</div>
        <div {% if post.summary or post.sensitive %}class="spoiler" _="on click toggle .revealed on me"{% endif %}>
          <div class="attachments">
            {% for attachment in post.attachments.all %}
              {% if attachment.is_image %}
                <a href="#img_{{ post.pk }}_{{ loop.index }}">
                  <img src="{{ attachment.thumbnail_url.relative }}"
                       alt="image attachment"
                       class="preview">
                </a>
                <a href="#" class="lightbox" id="img_{{ post.pk }}_{{ loop.index }}">
                  <span style="background-image: url('{{ attachment.full_url.relative }}')"></span>
                </a>
              {% endif %}
            {% endfor %}
          </div>
          <div class="tldr" _="on click toggle .tldr on me">{{ post.content|bleach:"a,p,span,br,div,img"|default:"" }}</div>
        </div>
      </div>
    </div>
    <div id="replies_{{ post.pk }}"></div>
  </section>
{% empty %}
  <div class="empty">{% trans "nothing so far." %}</div>
{% endfor %}
