{% extends "layout.html" %}

{% block content %}
<div class="grid-container">
    <div class="grid-x grid-padding-x">
        <div class="cell padding-top-1">
            <h3>
            <a href="{% url 'intern:index' %}#{{ active_topic.topic_group.slug }}">{{ active_topic.topic_group.title }}</a>
            / {{ active_topic.title }}
            </h3>
        </div>
    </div>

    <div class="intern-hero">
        <div class="grid-x padding-top-1 padding-left-1 padding-right-1">
            <div class="cell large-3 medium-4 small-10">
                <a class="button" href="{% url 'intern:topic-update' active_topic.slug %}">Thema bearbeiten</a>
            </div>
            {% if active_topic.task_list %}
                <div class="cell large-3 medium-4 small-10">
                    <a class="button" href="{% url 'intern:task-create' active_topic.slug %}">neuen Task hinzufügen</a>
                </div>
            {% endif %}
        </div>

        {% if active_topic.description %}
        <div class="padding-top-1 padding-left-1 padding-right-1">
            {{ active_topic.description|safe }}
            <hr>
        </div>
        {% endif %}

        {% if tasks %}
        <div class="grid-x grid-padding-x">
            <div class="cell">offene Tasks:</div>

            {% for task in tasks %}
            <div class="cell">
                <a href="{% url 'tasks:task-detail' task.id %}">{{ task }}</a>
            </div>
            {% endfor %}
        </div>
        <hr>
        {% endif %}

        <div class="grid-x grid-padding-x">
        {% for docu in docus %}
            <div class="cell large-2 medium-4 small-6">
                <a href="{% url 'intern:docu' active_topic.slug docu.slug %}">
                <div class="intern-topic">
                    <div class="intern-topic-text">
                    {{ docu.title }}
                    </div>
                </div>
                </a>
            </div>
        {% endfor %}

            <div class="cell large-2 medium-4 small-6">
                <a href="{% url 'intern:docu-create' active_topic.slug %}">
                <div class="intern-topic">
                    <div class="intern-topic-text">
                    +
                    </div>
                </div>
                </a>
            </div>
        </div>
    </div>
</div>
{% endblock %}