Newer
Older
pre-www / src / blocks / accordion.twig
{# 
 # Blocco accordion 
 #}
 
 {% if block.multi_columns == true %}{% set multi_columns = true %}{% endif %}

{% set id = random(99999) %}

<div class="block-container block-{{block.key}} {{block.classes}} {% if multi_columns %}block-accordion--2cols{% endif %}">

    {# if accordion has columns set threshold and set first column #}
    {% if multi_columns %}
        {% set threshold = block.content.items|length / 2 %}
        <div class="block-container-column">
    {% endif %}

    {% for item in block.content.items %}

        <div class="block-{{block.key}}__inner" data-accordion>
            <button data-accordion-title aria-expanded="false" aria-controls="sect{{id}}{{loop.index}}" id="accordion{{id}}{{loop.index}}id">{{item.title}}</button>
            <div data-accordion-content id="sect{{id}}{{loop.index}}" role="region" aria-labelledby="accordion{{id}}{{loop.index}}id" style="display:none">
                {% if item.content.text %}
                   <p>{{item.content.text}}</p>
                {% else %}
                    {% for inner_block in item.inner_blocks %}
                        {% include './'~inner_block.key~'.twig' with {'block': inner_block } %}
                    {% endfor %}
                {% endif %}
            </div>
        </div>

        {# if accordion has columns #}
        {% if multi_columns and loop.index == threshold|round %}
            </div>
            <div class="block-container-column">
        {% endif %}
        
    {% endfor %}
    {# if accordion has columns set threshold and set first column #}
    {% if multi_columns %}</div>{% endif %}
</div>