{% extends "base.html" %}
{% import "macros/user_cell.html" as user_cell %}
{% block title %}{{ entry.title }} · {{ page_title | default(value="Achievements") }}{% endblock %}
{% block extra_head %}
<link rel="stylesheet" href="/plugins/achievements/assets/css/achievements-timeline.css">
<link rel="stylesheet" href="/static/css/user-cell.css">
{% endblock %}
{% block content %}
<div class="container" data-plugin="achievements">
  <article class="achievements-detail">
    <p class="mb-3"><a href="/plugins/achievements/index">&larr; {% if timeline_title %}{{ timeline_title }}{% elif plugin_settings.timeline_title %}{{ plugin_settings.timeline_title }}{% elif page_title %}{{ page_title }}{% elif plugin_settings.page_title %}{{ plugin_settings.page_title }}{% else %}Achievements{% endif %}</a></p>

    {% if entry.cover_image %}
    <img class="achievements-detail__cover" src="{{ entry.cover_image }}" alt="">
    {% endif %}

    <p class="achievements-detail__meta">
      {{ entry.occurred_on | date_in_tz(timezone=settings.timezone, format='%d %b %Y') }}
    </p>
    <h1>{{ entry.title }}</h1>
    {% if entry.summary %}
    <p class="text-muted">{{ entry.summary }}</p>
    {% endif %}

    {% if entry.body_html %}
    <div class="achievements-detail__body">{{ entry.body_html | safe }}</div>
    {% endif %}

    {% if entry.source_url %}
    <p><a href="{{ entry.source_url }}" rel="noopener noreferrer" target="_blank">Source</a></p>
    {% endif %}

    {% if credits %}
    <section class="achievements-credits" aria-label="Credits">
      <h2 class="achievements-credits__title">Credits</h2>
      <ul class="achievements-credits__list">
        {% for c in credits %}
        <li class="achievements-credits__item">
          {{ user_cell::render(name=c.name, email=c.email, avatar=c.avatar) }}
          {% if c.role %}
          <span class="achievements-credits__role">{{ c.role }}</span>
          {% endif %}
        </li>
        {% endfor %}
      </ul>
    </section>
    {% endif %}

    <div data-plugin-block-id="comments-thread"
         data-plugin="comments"
         data-host-plugin="achievements"
         data-entity-type="entry"
         data-entity-id="{{ entry.id }}"
         data-config='{"plugin":"achievements","entity_type":"entry","entity_id":"{{ entry.id }}"}'></div>
  </article>
</div>
{% endblock %}