templates/home/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block body %}
  4. <div id="myCarousel" class="carousel slide mb-6" data-bs-ride="carousel">
  5. <div class="carousel-indicators">
  6. {% if headers|length > 1 %}
  7. {% for key,header in headers %}
  8. <button type="button" data-bs-target="#myCarousel" data-bs-slide-to="{{key}}" {% if key == 0 %} class="active" aria-current="true" {% endif %} aria-label="{{ header.title }}"></button>
  9. {% endfor %}
  10. {% endif %}
  11. </div>
  12. <div class="carousel-inner">
  13. {% for key,header in headers %}
  14. <div class="carousel-item {% if key == 0 %} active {% endif %}">
  15. <img src="/uploads/{{header.illustration}}" class="bd-placeholder-img" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" preserveAspectRatio="xMidYMid slice" focusable="false"><rect width="100%" height="100%" fill="var(--bs-secondary-color)"/></img>
  16. <div class="container">
  17. <div class="carousel-caption text-start">
  18. <h1>{{header.title}}</h1>
  19. <p class="opacity-75">{{header.content}}</p>
  20. <p><a class="btn btn-lg btn-primary" href="{{header.buttonLink}}">{{header.buttonTitle}}</a></p>
  21. </div>
  22. </div>
  23. </div>
  24. {% endfor %}
  26. </div>
  27. {% if headers|length > 1 %}
  28. <button class="carousel-control-prev" type="button" data-bs-target="#myCarousel" data-bs-slide="prev">
  29. <span class="carousel-control-prev-icon" aria-hidden="true"></span>
  30. <span class="visually-hidden">Previous</span>
  31. </button>
  32. <button class="carousel-control-next" type="button" data-bs-target="#myCarousel" data-bs-slide="next">
  33. <span class="carousel-control-next-icon" aria-hidden="true"></span>
  34. <span class="visually-hidden">Next</span>
  35. </button>
  36. {% endif %}
  37. </div>
  40. <!-- Marketing messaging and featurettes
  41. ================================================== -->
  42. <!-- Wrap the rest of the page in another container to center all the content. -->
  44. <div class="container marketing">
  46. <!-- Three columns of text below the carousel -->
  47. <div class="row">
  48. {% for product in productsInHomepage %}
  49. <div class="col-lg-4">
  50. <img src="/uploads/{{ product.illustration }}" class="img-fluid">
  51. <h2 class="fw-normal mt-2">{{ product.name }}</h2>
  52. <div class="opacity-75" style="font-size: 14px;">
  53. {{ product.description|raw }}
  54. </div>
  55. <p><a class="btn btn-secondary mt-2" href="{{ path('app_product', { slug: product.slug }) }}">Découvrir</a></p>
  56. </div>
  57. {% endfor %}
  59. </div><!-- /.row -->
  62. <!-- START THE FEATURETTES -->
  64. <hr class="featurette-divider">
  66. <!-- /END THE FEATURETTES -->
  68. </div><!-- /.container -->
  70. {% endblock %}