templates/news/list.html.twig line 1

Open in your IDE?
  1. {% extends "layout.html.twig" %}
  3. {% block content %}
  5. <!-- #main -->
  6. <main id="main" role="main">
  8.     <div class="apk-page-news">
  9.         <div class="uk-container apk-container-1400">
  11.             <h1 class="uk-margin-medium-bottom uk-text-center">{{ pimcore_textarea("service-titre")}}</h1>
  13.             {% if paginator|length == 0 %}
  14.                 <div class="uk-margin-medium-top uk-text-center uk-text-bold">
  15.                     {{ "Aucun article n'est disponible"|trans }}
  16.                 </div>
  18.             {% endif %}
  20.             <div class="uk-grid" uk-grid uk-height-match="target: .apk-content-infos" uk-scrollspy="cls: uk-animation-slide-top-medium; target: .apk-animate; delay: 300; repeat: false">
  21.             {% for news in paginator %}
  23.                 {% if news.slug %}
  24.                     {% set link = path('newsDetail', {'slug': news.slug}) %}
  25.                 {% else %}
  26.                     {% set link = false %}
  27.                 {% endif %}
  30.                 {% if loop.first %}
  31.                     <div class="uk-width-1-1 apk-content-first uk-height-1-1">
  32.                         <div class="uk-grid-collapse uk-child-width-1-2@m" uk-grid>
  34.                             <div class="uk-position-relative" data-apk-href="{{ link }}">
  35.                                 {{ news.image.thumbnail('news-image').html()|raw }}
  37.                                 {% if news.categorie %}
  38.                                     <div class="uk-position-top-left apk-badge">{{ news.categorie }}</div>
  39.                                 {% endif %}
  40.                             </div>
  42.                             <div>
  43.                                 <div class="uk-flex uk-flex-middle uk-height-1-1 suk-position-relative">
  44.                                     <div class="apk-content">
  45.                                         <div class="uk-flex">
  46.                                             <img src="/static/img/pictos/horloge.svg" width="25" style="width:25px; height:auto; margin-right:10px;" alt="">
  47.                                             <p class="uk-margin-remove">{{ news.date|date('d/m/Y') }}</p>
  48.                                         </div>
  50.                                         <h2 class="uk-margin-small-top" data-apk-href="{{ link }}">{{ (news.titre|nl2br)|raw }}</h2>
  51.                                         <p class="uk-margin-remove">{{ (news.description|nl2br)|raw }}</p>
  52.                                         <div class="uk-text-right uk-margin-top">
  53.                                             <a href="{{ link }}" class="uk-button uk-button-orange uk-margin-top">{{ "Lire plus"|trans }}</a>
  54.                                         </div>
  55.                                     </div>
  56.                                 </div>
  57.                             </div>
  59.                         </div>
  60.                     </div>
  62.                 {% else %}
  63.                     <div class="uk-width-1-3@m uk-width-1-2@s">
  64.                         <div class="apk-animate">
  65.                             <div class="apk-content-second">
  66.                             
  67.                                 <div class="uk-position-relative" data-apk-href="{{ link }}">
  68.                                     {{ news.image.thumbnail('news-image').html()|raw }}
  70.                                     {% if news.categorie %}
  71.                                         <div class="uk-position-top-left apk-badge">{{ news.categorie }}</div>
  72.                                     {% endif %}
  73.                                 </div>
  75.                                 <div class="apk-date">
  76.                                     <div class="uk-flex uk-flex-center">
  77.                                         <img src="/static/img/pictos/horloge.svg" width="25" style="width:25px; height:auto; margin-right:10px;" alt="">
  78.                                         <p class="uk-margin-remove">{{ news.date|date('d/m/Y') }}</p>
  79.                                     </div>
  80.                                 </div>
  81.                                 
  82.                                 <div class="apk-content-infos">
  83.                                     <h3 class="uk-margin-top" data-apk-href="{{ link }}">{{ (news.titre|nl2br)|raw }}</h3>
  85.                                     <div class="uk-text-right">
  86.                                         <a href="{{ link }}" class="uk-button uk-button-orange">{{ "Lire plus"|trans }}</a>
  87.                                     </div>
  88.                                 </div>
  90.                             </div>
  91.                         </div>
  92.                     </div>
  93.                 {% endif %}
  95.             {% endfor %}
  96.             </div>
  98.             {% if paginationVariables.pageCount > 1 %}
  99.             <div class="uk-flex uk-flex-right uk-margin-medium-top">
  100.                 {% include 'includes/pagination.html.twig' %}
  101.             </div>
  102.             {% endif %}
  104.         </div>
  105.     </div>
  107. </main>
  108. {% endblock %}
  110. {% block inlinescripts %}
  112. {% endblock inlinescripts %}