{% extends 'layouts/base.twig' %}

{% block content %}
    <h1 class="mb-5 position-relative fs-4 fw-bold sp-module-title">{{ post.title }}</h1>

    {% if enlaces %}
    <div class="enlaces">
        <div class="accordion" id="accordionEnlaces">
            {% for grupo in enlaces %}
                <div class="accordion-item">
                    <h2 class="accordion-header">

                        <button class="accordion-button {% if loop.index0 != 0 %}collapsed{% endif %}" 
                                type="button" 
                                data-bs-toggle="collapse" 
                                data-bs-target="#collapse{{ loop.index }}" 
                                aria-expanded="{% if loop.index0 == 0 %}true{% else %}false{% endif %}" 
                                aria-controls="collapse{{ loop.index }}">
                            {{ grupo.titulo }}

                            <span class="badge bg-secondary ms-2">{{ grupo.enlaces|length }}</span>
                        </button>
                    </h2>
                    <div id="collapse{{ loop.index }}" 
                        class="accordion-collapse collapse {% if loop.index0 == 0 %}show{% endif %}" 
                        data-bs-parent="#accordionEnlaces">
                        <div class="accordion-body">
                            {% if grupo.enlaces %}
                                <div class="d-grid gap-2">
                                    {% for enlace in grupo.enlaces %}
                                        <a href="{{ enlace.url }}"
                                        class="btn btn-outline-dark btn-sm text-start"
                                        target == '_blank'
                                        rel="noopener noreferrer">
                                            {{ enlace.titulo }}
                                            {% if enlace.target == '_blank' %}
                                                <i class="fas fa-external-link-alt ms-1 small"></i>
                                            {% endif %}
                                        </a>
                                    {% endfor %}
                                </div>
                            {% endif %}
                        </div>
                    </div>
                </div>
            {% endfor %}
        </div> 
    </div>
    {% endif %}

    {#<pre>{{ dump(enlaces) }}</pre>#}

{% endblock %}