{% extends 'base.html' %}
{% block body %}
{% from 'utils.html' import urlcat, root, index, card with context %}
<h1 id="title"><a href="{{ root() }}/{{ index() }}">DL</a> &gt; {{ title }}</h1>
<div class="work-container">
  <div class="work-preview">
    <a href="view/{{ index() }}">
      <img src="{{ root() }}/{{ work['thumbnail_path'] }}">
      <div class="start-link">Start Reading</div>
    </a>
  </div>
  <div class="work-info">
    <table>
      {% if work['circle'] %}
      <tr class="bubbles">
        <th>Circle</th>
        <td><a href="{{ root() }}/circles/{{ urlcat(work['circle']) }}/{{ index() }}">{{ work['circle'] }}</a></td>
      </tr>
      {% endif %}
      {% if work['authors'] %}
      <tr class="bubbles">
        <th>Authors</th>
        <td>{% for author in work['authors'] %}<a href="{{ root() }}/authors/{{ urlcat(author) }}/{{ index() }}">{{ author }}</a> {% endfor %}</td>
      </tr>
      {% endif %}
      {% if work['tags'] %}
      <tr class="bubbles">
        <th>Tags</th>
        <td>{% for tag in work['tags'] %}<a href="{{ root() }}/tags/{{ urlcat(tag) }}/{{ index() }}">{{ tag }}</a> {% endfor %}</td>
      </tr>
      {% endif %}
      {% if work['series'] %}
      <tr class="bubbles">
        <th>Series</th>
        <td><a href="{{ root() }}/series/{{ urlcat(work['series']) }}/{{ index() }}">{{ work['series'] }}</a></td>
      </tr>
      {% endif %}
      <tr>
        <th>Pages</th>
        <td>{{ work['images'] | length }}</td>
      </tr>
    </table>
    {% if work['description'] %}
    {{ work['description'] }}
    {% endif %}
  </div>
</div>
<h3 id="suggested-subheader">Suggested works</h3>
<div id="suggested-works" class="card-listing">
  {% for sugg in suggested %}
  {{ card(sugg) }}
  {% endfor %}
</div>
{% endblock %}