templates/snippets/last-news.html.twig line 1

Open in your IDE?
  1. {% extends "layout-snippets.html.twig" %}
  3. {% block snippets %}
  6. <section>
  7.     <div class="apk-news apk-last-news">
  8.         <div class="uk-container">
  9.             <div class="uk-grid-small uk-flex uk-flex-middle uk-grid" uk-grid>
  10.                 <div class="uk-width-expand">
  11.                     <h2 class="uk-h2 apk-underlined apk-underlined-blue2 uk-margin-remove-bottom">
  12.                         {{ pimcore_textarea('lastNewsTitle', { 'nl2br' : true}) }}
  13.                     </h2>
  14.                 </div>
  15.                 <div class="uk-width-auto uk-visible@s">
  16.                     <a class="uk-button uk-button-large uk-button-orange2 c-orange1 uk-flex uk-flex-middle uk-flex-center" href="{{path('newsList')}}">
  17.                         <span>{{ "Tous les articles"|trans }}</span>
  18.                         <img width="16" height="22" uk-svg class="uk-margin-small-left" src="/static/img/pictos/double_arrow.svg" alt="{{ "Double Arrow"|trans }}">
  19.                     </a>
  20.                 </div>
  21.             </div>
  22.             <div class="uk-child-width-1-3@m uk-child-width-1-2@s uk-margin-medium-top uk-grid" uk-grid uk-height-match="target: .apk-content">
  23.                 {% set i = 1 %}
  24.                 {% for news in newsListing %}
  25.                 
  26.                     {# AFFICHAGE DE 4 NEWS AU LIEU DE 3 SUR TABLETTE #}
  27.                     <div class="{% if i > 3 %} uk-hidden@m uk-visible@s {% endif %}">
  28.                         <div class="apk-news-container">
  29.                             <div class="apk-media uk-cover-container">
  30.                                 <a href="{{path('newsDetail', {"slug":news.getSlug()})}}">
  31.                                     <img class="uk-cover" uk-cover src="{{news.getImage().getThumbnail('news-thumb')| raw}}" alt="{{ news.getTitle() }}">
  32.                                 </a>
  33.                             </div>
  34.                             <div class="apk-content">
  35.                                 <p class="apk-date uk-text-lowercase uk-margin-small-top uk-margin-small-bottom">
  36.                                     {{ convert_date(news.getPublishDate(), 'd F Y', app.request.locale) }}
  37.                                 </p>
  38.                                 <a href="{{path('newsDetail', {"slug":news.getSlug()})}}">
  39.                                     <h3 class="uk-h3 uk-margin-remove">{{news.getTitle()}}</h3>
  40.                                 </a>
  41.                                 <p class="apk-font-16 uk-margin-remove-top">{{news.getShortText() |raw}}</p>
  42.                             </div>
  43.                             <div class="apk-action uk-margin-top">
  44.                                 <a class="uk-flex uk-flex-middle" href="{{path('newsDetail', {"slug":news.getSlug()})}}">
  45.                                     {{'Lire plus' | trans}}
  46.                                     <img width="10" height="20" uk-svg class="uk-margin-small-left" src="/static/img/pictos/double_arrow.svg" alt="{{ "Double Arrow"|trans }}">
  47.                                 </a>
  48.                             </div>
  49.                         </div>
  50.                     </div>
  52.                 {% set i = i + 1 %}
  53.                 {% endfor %}
  54.             </div>
  55.             <div class="uk-margin-medium-top uk-text-center uk-hidden@s">
  56.                 <a class="uk-button uk-button-large uk-button-orange2 c-orange1 uk-flex uk-flex-middle uk-flex-center uk-flex-inline" href="path('news')">
  57.                     <span>{{ "Tous les articles"|trans }}</span>
  58.                     <img width="16" height="22" uk-svg class="uk-margin-small-left" src="/static/img/pictos/double_arrow.svg" alt="{{ "Double Arrow"|trans }}">
  59.                 </a>
  60.             </div>
  61.         </div>
  62.     </div>
  63. </section>
  66. {% endblock %}