{% extends 'includes/layout.swig' %}

{% import "includes/paginator.swig" as P %}
{% import "includes/tags.swig" as T %}

{% block body %}
    <div class="card z-depth-0">
      <h2 style="margin-left: 1rem; margin-bottom: 0;">{{page.tag}}<i class="mdi mdi-tag" style="font-size: 2rem; color: #ee6e73;"></i></h2>
      {% if site.data.theme.topic_rss and site.data.theme.topic_rss.tag %}
        {% set tag_rss = site.data.theme.topic_rss.tag %}
        {% if tag_rss.name_lowercase %}
          {% set rss_name = page.tag.toLowerCase() %}
        {% else %}
          {% set rss_name = page.tag %}
        {% endif %}
        <div class="card-action">
          {% if tag_rss.atom_suffix %}
            <a href="{{ full_url_for(tag_rss.prefix + rss_name + tag_rss.atom_suffix) }}">Feed (Atom)</a>
          {% endif %}
          {% if tag_rss.rss_suffix %}
            <a href="{{ full_url_for(tag_rss.prefix + rss_name + tag_rss.rss_suffix) }}">Feed (RSS)</a>
          {% endif %}
        </div>
      {% endif %}
    </div>
    <ul class="collapsible popout">
    {% for article in page.posts.toArray() %}
    <li>
      <div class="collapsible-header">
      <div class="row" style="margin: 0;">
        <div class="row" style="margin-left: 4px; margin-bottom: 0.5rem;"><div class="col s12"><h3 style="font-size: 1.2rem; margin: 0; margin-top: 8px;">{{article.title}}</h3></div></div>
        <div class="row" style="margin-left: 0; margin-bottom: 0;"><div class="col s12">{{ T.PostTags(article) }}</div></div>
      </div>
      </div>
      <div class="collapsible-body small-padding">
        <div style="padding-left: 1rem">
          <div class="mdi mdi-clock" style="padding-bottom: 8px">{{ date(article.date) }}</div>
        </div>
        <div class="entry">{{article.excerpt}}</div>
        <div class="card z-depth-0">
          <div class="card-action" style="padding-bottom: 0; padding-left: 14px;">
            <a href="{% if article.link %}{{article.link}}{% else %}{{url_for(article.path)}}{% endif %}">Go To "{{article.title}}"</a>
          </div>
        </div>
      </div>
    </li>
    {% endfor %}
  </ul>

  <div id="center">
    {{ P.Paginiation() }}
  </div>
{% endblock %}