You are here

views-bootstrap-accordion.html.twig in Views Bootstrap 8.3

Same filename and directory in other branches
  1. 8.4 templates/views-bootstrap-accordion.html.twig
{% set title_attributes = create_attribute({'class': ['accordion-toggle']}) %}
{% if group_title %}<h3>{{ group_title }}</h3>{% endif %}
<div {{ attributes.addClass(classes).setAttribute('id', id).setAttribute('role', 'tablist').setAttribute('aria-multiselectable', 'true') }}>
  {% for key, row in rows -%}
    {% set expanded = (behavior == 'first' and loop.first) or behavior == 'all' ? true : false %}
    {% set title_class = [expanded == false ? 'collapsed' : ''] %}
    <div class="panel panel-default">
      <div class="panel-heading" {{ attributes.addClass('panel-heading').setAttribute('role', 'tab').setAttribute('id', 'heading' ~ id ~ '-collapse-' ~ key) }}>
        <h4 class="panel-title">
          <a {{ title_attributes.addClass(title_class) }}
             role="button"
             data-toggle="collapse"
             data-parent="#{{ id }}"
             aria-expanded="{{ expanded }}"
             aria-controls="{{ id }}-collapse-{{ key }}"
             href="#{{ id }}-collapse-{{ key }}">
            {{row.title}}
          </a>
          {% if row.label %}
            <span class="badge pull-right">{{ row.label }}</span>
          {% endif %}
        </h4>
      </div>

      <div id="{{ id }}-collapse-{{ key }}" class="panel-collapse collapse {{ expanded == 'true' ? 'in' }}" role="tabpanel" aria-labelledby="heading{{ id }}-collapse-{{ key }}">
        <div class="panel-body">
          {{row.content}}
        </div>
      </div>
    </div>
  {%- endfor %}
</div>

File

templates/views-bootstrap-accordion.html.twig
View source
  1. {% set title_attributes = create_attribute({'class': ['accordion-toggle']}) %}
  2. {% if group_title %}<h3>{{ group_title }}</h3>{% endif %}
  3. <div {{ attributes.addClass(classes).setAttribute('id', id).setAttribute('role', 'tablist').setAttribute('aria-multiselectable', 'true') }}>
  4. {% for key, row in rows -%}
  5. {% set expanded = (behavior == 'first' and loop.first) or behavior == 'all' ? true : false %}
  6. {% set title_class = [expanded == false ? 'collapsed' : ''] %}
  7. <div class="panel panel-default">
  8. <div class="panel-heading" {{ attributes.addClass('panel-heading').setAttribute('role', 'tab').setAttribute('id', 'heading' ~ id ~ '-collapse-' ~ key) }}>
  9. <h4 class="panel-title">
  10. <a {{ title_attributes.addClass(title_class) }}
  11. role="button"
  12. data-toggle="collapse"
  13. data-parent="#{{ id }}"
  14. aria-expanded="{{ expanded }}"
  15. aria-controls="{{ id }}-collapse-{{ key }}"
  16. href="#{{ id }}-collapse-{{ key }}">
  17. {{row.title}}
  18. </a>
  19. {% if row.label %}
  20. <span class="badge pull-right">{{ row.label }}</span>
  21. {% endif %}
  22. </h4>
  23. </div>
  24. <div id="{{ id }}-collapse-{{ key }}" class="panel-collapse collapse {{ expanded == 'true' ? 'in' }}" role="tabpanel" aria-labelledby="heading{{ id }}-collapse-{{ key }}">
  25. <div class="panel-body">
  26. {{row.content}}
  27. </div>
  28. </div>
  29. </div>
  30. {%- endfor %}
  31. </div>