{% extends "testapp/base.html" %}

{% block template_name %}testapp/hub.html{% endblock %}

{% block content %}
    <div class="card">
        <h1>Your profile</h1>
        <p class="lede">
            Each row is an independent run with its own status, read from the
            shape of its stored state rather than by walking it. Enter a
            section from here — its own URL would start a run this hub is not
            tracking.
        </p>
        <p class="lede">
            You have completed {{ hub.completed }} of {{ hub.count }} section{{ hub.count|pluralize }}.
        </p>
        <ul class="task-list">
            {% for row in hub.rows %}
                <li class="task-list__item">
                    <a href="{{ row.url }}">{{ row.title }}</a>
                    <strong class="tag tag--{{ row.status }}">{{ row.status_label }}</strong>
                </li>
            {% endfor %}
        </ul>
    </div>
{% endblock %}