{% extends 'base.html' %}

{% block content %}
<div class="container">
    
    <div class="accordion">
        {% for event in events%}
        <div class="accordion-item">
            <div class="accordion-item">
                <h2 class="accordion-header" id="event-{{event.id}}">
                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#event-collapse-{{event.id}}" aria-expanded="true" aria-controls="event-collapse-{{event.id}}">
                        {{event.name}}
                    </button>
                </h2>
                <div id="event-collapse-{{event.id}}" class="accordion-collapse collapse" aria-labelledby="event-{{event.id}}" data-bs-parent="#accordionExample">
                    <div class="accordion-body">

                            {{event.description}}
                    </div>
                </div>
            </div>
        </div>

        {% endfor %}
    </div>
</div>

{% endblock %}