templates/site/blog/liste_actualites.html.twig line 1

Open in your IDE?
  1. {% extends "site/base.html.twig" %}
  3. {% block title %}Liste des actualités{% endblock %}
  5. {% block content %}
  6.     <section id="banner" class="z-0 h-80 relative w-full">
  7.         <img class="w-full h-full object-cover object-bottom" src="/img/tmp/element5-digital-OyCl7Y4y0Bk-unsplash.jpg" alt="">
  8.         </div>
  9.         <div class="z-10 absolute y-center lg:transform-none sm:left-28 lg:left-24 xl:left-64 text-white
  10.         px-8 sm:px-0">
  11.             {% set isOffres = (catSelected.id == '2') %}
  12.             {% set titre = isOffres?'LG_LISTE_OFFRES':'LG_LISTE_ACTUS' %}
  13.             <h1 class="uppercase text-white text-3xl sm:text-4xl leading-8 tracking-wider mb-2">{{ titre|trans() }}</h1>
  14.             <p class="uppercase leading-6 text-xl tracking-wider">{{ 'LG_ACTUALITES_SOUS_TITRE'|trans({'fr':'Dans les écoles A.B.C.M Zweisprachigkeit'}) }}</p>
  15.         </div>
  16.     </section>
  18.     <section id="liste" class="pt-28 lg:pt-12 pb-12 px-8 sm:px-28 lg:px-24 xl:px-64">
  19.         {% if isOffres %}
  20.             <div class="w-full justify-start flex flex-col sm:flex-row sm:items-center sm:gap-8 gap-y-2 mb-12">
  21.                 <p class="mb-0 font-semibold leading-7 tracking-wide">{{ 'LG_TYPE_OFFRES'|trans({'fr':'Type d\'offres :'}) }}</p>
  22.                 <div class="flex gap-4">
  23.                     <a data-id="0" class="toggle-offre bg-secondary text-white font-normal px-10 py-1 rounded-2xl duration-75 cursor-pointer hover:bg-transparent hover:text-secondary border-transparent border-2 hover:border-secondary">{{ 'LG_TYPE_OFFRES_0'|trans({'fr':'Emploi'}) }}</a>
  24.                     <a data-id="1" class="toggle-offre bg-secondary text-white font-normal px-10 py-1 rounded-2xl duration-75 cursor-pointer hover:bg-transparent hover:text-secondary border-transparent border-2 hover:border-secondary">{{ 'LG_TYPE_OFFRES_1'|trans({'fr':'Stage'}) }}</a>
  25.                 </div>
  26.             </div>
  27.         {% endif %}
  28.         <div id="liste-offres" class="flex justify-center flex-wrap gap-8 w-full">
  29.          {% for actualite in actualites %}
  30.              {% set route = isOffres?'offres_emploi_detail':'actualites_detail' %}
  31.              {% set hasPhoto = (actualite.photo is not empty) %}
  32.              <a href="{{ path(route, {slug:actualite.titreUrl, actualite:actualite.id}) }}" class="tag-{{ actualite.une?'1':'0' }} cursor-pointer w-full sm:w-45p lg:w-30p hover:opacity-80 transitioning xl:w-30p h-56 relative">
  33.                  {% if isOffres %}
  34.                     <p class="absolute -left-2 top-2 w-min bg-secondary text-white shadow-md rounded-2xl text-center px-4">{{ ('LG_TYPE_OFFRES_'~(actualite.une?'1':'0')) |trans() }}</p>
  35.                  {% endif %}
  36.                  <img class="w-full h-full object-cover" src="{{ hasPhoto ? ('actualites/'~actualite.photo)|imagine_filter('tm'): asset('/img/tmp/actu-haguenau.jpg') }}">
  37.                 <p class="absolute -right-2 top-2 w-min bg-tertiary text-white shadow-md rounded-2xl text-center px-4">{{ actualite.date|date('d/m') }}</p>
  38.                 <div class="absolute x-center bottom-2 text-white bg-primary rounded-full text-center text-xs w-9/12 py-3 px-4">
  39.                     <p class="mb-0">{{  actualite.titre }}</p>
  40.                 </div>
  41.             </a>
  42.         {% endfor %}
  43.     </div>
  44.     </section>
  45. {% endblock %}