templates/category/show.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}
  4.     {% if properties is defined and properties[0] is defined and properties[0].category is defined and properties[0].category.name is defined %}
  5.         {{ properties[0].category.name }}
  6.     {% else %}
  7.         Catégorie vide
  8.     {% endif %}
  9.     {{ parent() }}
  10. {% endblock %}
  12. {% block body %}
  13. <link rel="stylesheet" href="{{ asset('css/swip.css') }}">
  14. <style>
  15. .row{
  16. margin-left:0;
  17. margin-right:0;
  18.     }
  19. </style>
  20. {% if properties is not empty %}
  21. <div id="modals">
  22.         {% for property in properties %}
  23.             {{ include('modal/show.html.twig', { 'property': property }) }}
  24.         {% endfor %}
  25.     </div>
  27. <h1 class="text-center m-5">{{ properties[0].category.name }}</h1>
  28. {{ properties[0].category.describ }}
  29. <div class="row">
  30.     {% for property in properties %}
  31.         <div class="col-md-4 mb-4 rounded-pill">
  32.             <div class="card p-4 shadow " style="height:660px;">
  33.                 {% if property.images|length > 0 %}
  34.                     <img style="width: 100%; height: 400px; object-fit: cover;" src="{{ asset('images/properties/' ~ property.images[0].imagename) }}" alt="{{ property.title }}">
  35.                 {% else %}
  36.                     <img src="{{ asset('images/no-image.png') }}" style="width: 100%; height: 400px; object-fit: cover;" alt="No image available">
  37.                 {% endif %}
  38.                 <div class="card-body">
  39.                     <h2 class="card-title">{{ property.title }}</h2>
  40.                     <h5 class="card-text text-danger">{{ property.housingType.name }} - {{ property.category.name }}
  41.                         {% if property.category.name matches '/location/i' and property.subType is not empty %}
  42.                             - {{ property.subType.name }}
  43.                         {% endif %}
  44.                     </h5>
  45.                     {% if property.category.name matches '/location/i' and property.subType is not empty %}
  46.                         <h2 class="card-text" id="price">{{ property.rent }} &euro;/mois</h2>
  47.                     {% else %}
  48.                         <h2 class="card-text" id="price">{{ property.price|number_format }} &euro;</h2>
  49.                     {% endif %}
  50.                     <div class="d-flex">
  51.                             <div class="d-flex flex-row align-items-center">
  52.                                 <button id="favori-button-{{ property.id }}" class="favori-button"   onclick="toggleFavori({{ property.id }})" data-property-id="{{ property.id }}"></button>
  53.                                 <h6 class="fs-6 ml-2 position-relative" id="favori_numb" >{{ property.favoritNumber }}</h6>
  54.                                 
  55.                 </div>
  56.                             <button id="voir"type="button" class="btn open-modal-btn mt-4 text-white px-4 py-2 rounded" data-toggle="modal" data-target="#exampleModal-{{ property.id }}">Voir</button>
  57.                         </div>
  58.                 </div>
  59.             </div>
  60.         </div>
  79.     {% endfor %}
  80. </div>
  81. {% else %}
  83. <div style="display:flex; flex-direction:row; align-items: center;justify-content: center;">
  84. <img src="{{ asset('images/croix_icon_rouge.png') }}" alt="icon de la croix rouge" width="110" height="110" class="d-inline-block align-text-top">
  85. <div style="display:flex; flex-direction: column">
  86.     <h2 style="color:#ce2248">Cette catĂ©gorie est vide pour le moment</h2>
  87.     <h4 style="font-weight: 100;">Revenez un autre moment.</h4>
  88. </div>
  89. </div>
  90. {% endif %}
  92. <script>
  93. $(function () {
  94.             $('[data-toggle="tooltip"]').tooltip({
  95.                 delay: { "show": 500, "hide": 100 },
  96.                 customClass: 'custom-tooltip'
  97.             });
  98.         });
  100. window.favoriUpdateUrl = '{{ path('app_favori_update') }}';
  102. </script>
  103.         
  104.     <script src="{{ asset('js/favorit.js') }}"></script>
  106. {% endblock %}