{% extends 'layout.html' %}
{% block content %}
    <section class="profile-section">
        {% block profile-nav %}
            {% include "../partials/_profile_nav.html" %}
        {% endblock %}
        <div class="profile-details">
            <h2>Mes cours</h2>
            <p>Retrouvez ici la liste de tous les cours que vous suivez et votre progression.</p>

            {% if progress_list %}
                <ul class="profile-courses">
                    {% for p in progress_list %}
                        {% with course=p.course %}
                            <li>
                                <a href="{% url 'courses:show' course.name|slugify course.id %}">
                                    {% if course.thumbnail %}
                                        <img src="/{{ course.thumbnail }}" alt="{{ course.name }}" class="course-thumb-mini">
                                    {% endif %}
                                    <span>{{ course.name }}</span>
                                </a>
                                <div class="muted small">Progression: {{ p.percent_completed }}%</div>
                            </li>
                        {% endwith %}
                    {% endfor %}
                </ul>
            {% else %}
                <p class="muted">Vous ne suivez aucun cours pour le moment.</p>
            {% endif %}
        </div>
    </section>
{% endblock %}