{% extends "repo.html" %}
{% set active_page = "forum" %}

{% block title %}
    {% trans username=username, repository=repository %}Forum of {{ username }}/{{ repository }}{% endtrans %}
{% endblock %}
{% block content %}
<x-vbox>
    <x-frame style="--width: 896px;" class="flexible-space">
        <x-vbox>
            <form class="vbox">
                <input type="text" name="q" placeholder="{% trans %}Search...{% endtrans %}" value="{{ query }}">
            </form>
            {% for post in results %}
                <article class="card card-horizontal">
                    {% if post.state == 0 %}
                        <div class="card-top state-label" style="background: var(--color-done); color: var(--color-done-text);">
                            {% trans %}done{% endtrans %}
                        </div>
                    {% elif post.state == 1 %}
                        <div class="card-top state-label" style="background: var(--color-pending); color: var(--color-pending-text);">
                            {% trans %}active{% endtrans %}
                        </div>
                    {% endif %}
                    <section class="card-main">
                        <a href="/{{ username }}/{{ repository }}/forum/{{ post.number }}"><h2>{{ post.subject }}</h2></a>
                        <p class="post-details"><a href="/{{ post.owner.username }}" class="post-author">{{ post.owner.username }}</a> &bull; {{ post.date | strftime("%A, %e %B %Y, %H:%M:%S") }}</p>
                        <p>{{ post.html | safe }}</p>
                    </section>
                </article>
            {% endfor %}
        </x-vbox>
        {% include "pagination.html" %}
    </x-frame>
</x-vbox>
{% endblock %}