You are here

bs-carousel.html.twig in Bootstrap Kit 8.3

Same filename and directory in other branches
  1. 8.4 templates/bs-carousel.html.twig
{% if content %}
{% set id = random() %}
<div {{ attributes.addClass('carousel slide').removeAttribute('id') }} data-ride="carousel" id="carousel-{{ id }}">

  <!-- Indicators -->
  <ol class="carousel-indicators">
    {% for region in layout.getRegionNames if content[region] %}
    <li class="{{ loop.first ? 'active' }}" data-target="#carousel-{{ id }}" data-slide-to="{{ loop.index0 }}"></li>
    {% endfor %}
  </ol>

  <!-- Slides -->
  <div class="carousel-inner">
    {% for region in layout.getRegionNames if content[region] %}
    <div class="item {{ loop.first ? 'active' }}">
      {{ content[region] }}
    </div>
    {% endfor %}
  </div>

  <!-- Controls -->
  <a class="left carousel-control" href="#carousel-{{ id }}" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a class="right carousel-control" href="#carousel-{{ id }}" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
  </a>

</div>
{% endif %}

File

templates/bs-carousel.html.twig
View source
  1. {% if content %}
  2. {% set id = random() %}
  3. <div {{ attributes.addClass('carousel slide').removeAttribute('id') }} data-ride="carousel" id="carousel-{{ id }}">
  4. <!-- Indicators -->
  5. <ol class="carousel-indicators">
  6. {% for region in layout.getRegionNames if content[region] %}
  7. <li class="{{ loop.first ? 'active' }}" data-target="#carousel-{{ id }}" data-slide-to="{{ loop.index0 }}"></li>
  8. {% endfor %}
  9. </ol>
  10. <!-- Slides -->
  11. <div class="carousel-inner">
  12. {% for region in layout.getRegionNames if content[region] %}
  13. <div class="item {{ loop.first ? 'active' }}">
  14. {{ content[region] }}
  15. </div>
  16. {% endfor %}
  17. </div>
  18. <!-- Controls -->
  19. <a class="left carousel-control" href="#carousel-{{ id }}" data-slide="prev">
  20. <span class="glyphicon glyphicon-chevron-left"></span>
  21. </a>
  22. <a class="right carousel-control" href="#carousel-{{ id }}" data-slide="next">
  23. <span class="glyphicon glyphicon-chevron-right"></span>
  24. </a>
  25. </div>
  26. {% endif %}