{% extends "main.html" %}
{% load presentation %}
{% load thumbnails %}
{% load static %}

{% block title %}Clubs et associations{% endblock %}

{% block content %}
<div class="default-container">
  <h1>Clubs et associations</h1>
  <div class="row">
    <div class="col-lg-3 pt-4">
      <div class="list-group">
        <a href="{% url 'club:liste' %}" class="list-group-item list-group-item-action">Tous les clubs</a>
        <a href="{% url 'club:liste' 'arts' %}" class="list-group-item list-group-item-action">Arts et culture</a>
        <a href="{% url 'club:liste' 'sports' %}" class="list-group-item list-group-item-action">Sports</a>
        <a href="{% url 'club:liste' 'technique' %}" class="list-group-item list-group-item-action">Techniques</a>
        <a href="{% url 'club:liste' 'bureaux' %}" class="list-group-item list-group-item-action">Les bureaux de l'AE
          {{ site_ecole.nom_commun }}</a>
        <a href="{% url 'club:liste' 'listes' %}" class="list-group-item list-group-item-action">Les listes</a>
        <a href="{% url 'club:liste' 'autres' %}" class="list-group-item list-group-item-action">Et aussi…</a>
        {% if site_ecole.ident == "inp" %}
        <a href="{% url 'club:liste' 'ecoles' %}" class="list-group-item list-group-item-action">Tous les clubs dans
          l'INP</a>
        {% else %}
        <a href="{% url 'club:liste' 'inp' %}" class="list-group-item list-group-item-action">Clubs INP</a>
        {% endif %}
      </div>
    </div>


    <div class="col-lg-9 pt-4">
      {% if ecole == 'inp' %}
      <h1>Clubs de l'AE INP</h1>
      {% endif %}

      {% for activite in activites %}
      <h2 class="mb-2"><a href="{{ activite.page }}">{{ activite.titre }}</a></h2>
      <div class="mb-4">
        {% for club in activite.liste_clubs %}
        
        <div class="card mb-2">
          <div class="row no-gutters">
            <div class="col col-pixel-width-224 p-2 border-sm">
              {% if club.logo %}
              <img src="{{ club.logo|thumbnail:"x224" }}" class="card-img my-auto"
                style="object-fit:cover;height:126px;">
              {% endif %}
            </div>
            <div class="col" style="position:static;">
              <div class="card-body">
                <h3 class="card-title">
                  {% if club.url %}
                  <a href="{{ club.url }}" class="text-decoration-none stretched-link">{{ club.nom }}</a>
                  {% else %}
                  {{ club.nom }}
                  {% endif %}
                </h3>
                <p class="card-subtitle mb-2 text-muted">
                  {{ club.miniDescription|default:"<em>Pas de description</em>"|safe }}</p>
              </div>
            </div>
          </div>
        </div>

        {% empty %}
        Aucun club trouvé…
        {% endfor %}
      </div>
      {% endfor %}
    </div>
  </div>
</div>
{% endblock %}