templates/gallery/gallerieFront.html.twig line 1

Open in your IDE?
  3. {% extends 'backfront.html.twig' %}
  5. {% block title %}SIP ACADEMY {% endblock %}
  7. {% block body %}
  8.     <style>
  9.         .gallery-area .row {
  10.             display: flex;
  11.             flex-wrap: wrap;
  12.             justify-content: center;
  13.         }
  15.         @media (max-width: 767px) {
  16.             .gallery-area .single-gallery-img {
  17.                 display: flex;
  18.                 justify-content: center;
  19.             }
  20.             .gallery-area .single-gallery-img img {
  21.                 width: 100%; /* Ensure it adapts to mobile screen size */
  22.                 max-width: 365px; /* Maintain the maximum width */
  23.                 height: auto;
  24.             }
  25.         }
  27.     </style>
  29.     <!--Gallery Area Start-->
  30. <div class="gallery-area pt-100 pb-70">
  31.     <div class="container">
  32.         <div class="row">
  33.             <!--Single Gallery Image Start-->
  35.             {% for gallerie in galleries|sort|reverse %}
  36.                 <div class="col-md-4 col-sm-6 d-flex justify-content-center">
  37.                     <div class="single-gallery-img mb-30">
  38.                         <a href="{{asset('uploads/gallery/'~ gallerie.image1  )}}" data-fancybox="images">
  39.                             <img src="{{asset('uploads/gallery/'~ gallerie.image1  )}}" alt="" class="img-fluid" style="height: 300px; width: 365px;">
  40.                         </a>
  41.                     </div>
  42.                 </div>
  45.             {% endfor %}
  46.             <!--Single Gallery Image End-->
  47.             <!--Single Gallery Image Start-->
  49.         </div>
  50.     </div>
  51. </div>
  52. <!--Gallery Area End-->
  54. {% endblock %}