templates/application/partial/articles.html.twig line 1

Open in your IDE?
  1. <style>
  2.     .tag__link.active {
  3.         background-color: rgba(var(--bodyColorRgb), 0.1);
  4.     }
  6.     .tag__link.active .tag__text {
  7.         color: var(--bodyColor);
  8.     }
  9. </style>
  11. <main class="main">
  12.     <div class="breadcrumb">
  13.         <div class="container">
  14.             <ol class="breadcrumb__list">
  15.                 <li class="breadcrumb__item"><a href="{{ path('home') }}" class="breadcrumb__link">Главная</a></li>
  16.                 <li class="breadcrumb__item active" aria-current="page">{{ page.name(app.request.locale) }}</li>
  17.             </ol>
  18.         </div>
  19.     </div>
  21.     <div class="page">
  22.         <div class="container">
  23.             <div class="page__header">
  24.                 <h1 class="page__title">{{ page.name(app.request.locale) }}</h1>
  25.             </div>
  27.             <div class="articles">
  28.                 <div class="articles__promo swiper a-carousel-single">
  29.                     <div class="swiper-wrapper">
  30.                         {% for topItem in topItems %}
  31.                             <div class="swiper-slide">
  32.                                 <div class="item-article-promo">
  33.                                     {% if topItem.image %}
  34.                                         <div class="item-article-promo__photo">
  35.                                             {{ include('application/partial/picture.html.twig', {image: topItem.image, width: 871, height: 566}) }}
  36.                                         </div>
  37.                                     {% endif %}
  38.                                     <div class="item-article-promo__detail">
  39.                                         <div class="item-article-promo__title">{{ topItem.name(app.request.locale) }}</div>
  40.                                         <div class="item-article-promo__descr">{{ topItem.shortText(app.request.locale) }}</div>
  41.                                         <div class="item-article-promo__btn">
  42.                                             <a href="{{ documentUrl(topItem) }}" class="btn btn--outline">
  43.                                                 <span class="btn__text">Читать далее</span>
  44.                                                 <span class="btn__icon">
  45.                                                         <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.146 3.133a.536.536 0 0 1 .708 0l5 4.546a.426.426 0 0 1 0 .642l-5 4.546a.536.536 0 0 1-.708 0 .426.426 0 0 1 0-.643L9.793 8 5.146 3.776a.426.426 0 0 1 0-.643z"/></svg>
  46.                                                     </span>
  47.                                             </a>
  48.                                         </div>
  49.                                     </div>
  50.                                 </div>
  51.                             </div>
  52.                         {% endfor %}
  53.                     </div>
  54.                     <div class="btn-prev"><svg width="20" height="20" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.854 12.867a.536.536 0 0 1-.708 0l-5-4.546a.426.426 0 0 1 0-.642l5-4.546a.536.536 0 0 1 .708 0 .426.426 0 0 1 0 .643L6.207 8l4.647 4.224a.426.426 0 0 1 0 .643z"/></svg></div>
  55.                     <div class="btn-next"><svg width="20" height="20" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.146 3.133a.536.536 0 0 1 .708 0l5 4.546a.426.426 0 0 1 0 .642l-5 4.546a.536.536 0 0 1-.708 0 .426.426 0 0 1 0-.643L9.793 8 5.146 3.776a.426.426 0 0 1 0-.643z"/></svg></div>
  56.                     <div class="swiper-pagination"></div>
  57.                 </div>
  59.                 <div class="articles__tag tag">
  60.                     <ul class="tag__list">
  61.                         {% if tag %}
  62.                             <li class="tag__item">
  63.                                 <a href="{{ path(itemsRouteName) }}" class="tag__link">
  64.                                     <span class="tag__text">Все</span>
  65.                                 </a>
  66.                             </li>
  67.                         {% endif %}
  68.                         {% for t in tags %}
  69.                             <li class="tag__item">
  70.                                 <a href="{{ path(itemsRouteName, {tag: t.url}) }}" class="tag__link {% if tag and t.id == tag.id %}active{% endif %}">
  71.                                     <span class="tag__text">{{ t.name(app.request.locale) }}</span>
  72.                                 </a>
  73.                             </li>
  74.                         {% endfor %}
  75.                     </ul>
  76.                 </div>
  78.                 <div id="items" class="articles__row">
  79.                     {{ include('application/blog/list.html.twig') }}
  80.                 </div>
  82.                 <div id="pagination">
  83.                     {{ include('application/partial/pagination.html.twig') }}
  84.                 </div>
  85.             </div>
  86.         </div>
  87.     </div>
  89. </main>