templates/_parts/about/_about-item.html.twig line 1

Open in your IDE?
  1. {% set class = class|default('') %}
  2. {% set item = item|default(null) %}
  3. <li class="about-item {{ class }}" id="project-item-{{ item.id }}">
  4.     {% if item.title %}
  5.         <h2 class="about-item__title text__black-text">
  6.             {{ item.title }}
  7.         </h2>
  8.     {% endif %}
  9.     {% set itemTabs = item.tabs.toArray() %}
  10.     {% if itemTabs|length %}
  11.         {% if itemTabs|length > 1 %}
  12.             <div class="about-item__tabs tabs tabs__minor">
  13.                 <ul class="about-item__tabs-list smart-tabs tabs__list" data-smart-tabs>
  14.                     {% for itemTab in itemTabs %}
  15.                         <li class="about-item__tab smart-tab tabs__item {% if loop.first %}_active{% endif %}">
  16.                             <a href="#project-item-tab-{{ itemTab.id }}"
  17.                                class="about-item__tab-link tabs__link"
  18.                                data-tab-link
  19.                             >
  20.                                 <span class="tabs__text text__small">
  21.                                     {{ itemTab.name }}
  22.                                 </span>
  23.                             </a>
  24.                         </li>
  25.                     {% endfor %}
  26.                 </ul>
  27.             </div>
  28.         {% endif %}
  29.         <div class="about-item__contents">
  30.             {% for itemTab in itemTabs %}
  31.                 {% set slides = itemTab.slides.toArray() %}
  32.                 {# старый размер, когда они ± одинаковые #}
  33.                 {% set sliderThumb = 'about_slide_thumb' %}
  34.                 {% set pictureThumb = 'about_slide_thumb' %}
  35.                 {# новый размер, когда они прям разные #}
  36.                 {% if itemTab.verticalSlider %}
  37.                     {% set sliderThumb = 'about_slide_thumb_vertical' %}
  38.                     {% set pictureThumb = 'about_picture_thumb_vertical' %}
  39.                 {% endif %}
  40.                 <ul id="project-item-tab-{{ itemTab.id }}"
  41.                     class="about-item__content smart-content
  42.                            {% if loop.first %}_active{% endif %}
  43.                            {% if not slides|length %}about-item__content_no-slider{% endif %}"
  44.                     data-smart-content
  45.                 >
  46.                     <div class="about-item__description-top text__body">
  47.                         {{ itemTab.descriptionTop }}
  48.                     </div>
  49.                     <div class="{% if itemTab.verticalSlider %}about-item__slider-wrapper{% endif %}">
  50.                         {% if slides|length %}
  51.                             <div class="about-item__slider{% if itemTab.verticalSlider %} about-item__slider_vertical{% endif%} swiper" data-about-slider>
  52.                                 <ul class="about-item__slider-list swiper-wrapper">
  53.                                     {% for slide in slides %}
  54.                                         <li class="about-item__slide swiper-slide">
  55.                                             {% include '_parts/image/adaptive-image.html.twig' with {
  56.                                                 object: slide,
  57.                                                 field: 'imageFile',
  58.                                                 size: sliderThumb,
  59.                                                 alt: itemTab.name,
  60.                                                 class: 'about-item__image',
  61.                                                 classPicture: 'about-item__picture',
  62.                                             } %}
  63.                                         </li>
  64.                                     {% endfor %}
  65.                                 </ul>
  66.                                 <div class="about-item__pagination pagination swiper-pagination"
  67.                                      data-about-slider-pagination></div>
  68.                                 {% if slides|length > 1 %}
  69.                                     {% include '_parts/nav/arrow-left.html.twig' with {
  70.                                         class: 'about-item__arrow-left arrow_light',
  71.                                         dataset: 'data-about-slider-left',
  72.                                     } %}
  73.                                     {% include '_parts/nav/arrow-right.html.twig' with {
  74.                                         class: 'about-item__arrow-right arrow_light',
  75.                                         dataset: 'data-about-slider-right',
  76.                                     } %}
  77.                                 {% endif %}
  78.                             </div>
  79.                         {% endif %}
  80.                         {% set itemTabHasImage = itemTab is has_image('imageName') %}
  81.                         <div class="{% if not itemTab.verticalSlider %}about-item__bottom {% if itemTabHasImage %}about-item__bottom_with-image{% endif %}{% else %}about-item__vertical-bottom{% endif %}">
  82.                             {% if itemTabHasImage %}
  83.                                 <div class="about-item__single-image{% if itemTab.wideMobileImage %} about-item__single-image_wide{% endif %}">
  84.                                     {% include '_parts/image/adaptive-image.html.twig' with {
  85.                                         object: itemTab,
  86.                                         field: 'imageFile',
  87.                                         size: pictureThumb,
  88.                                         alt: itemTab.name,
  89.                                         class: 'about-item__image',
  90.                                         classPicture: 'about-item__picture',
  91.                                     } %}
  92.                                 </div>
  93.                             {% endif %}
  94.                             <div class="about-item__description-bottom text__body">
  95.                                 {{ itemTab.descriptionBottom }}
  96.                             </div>
  97.                         </div>
  98.                     </div>
  99.                 </ul>
  100.             {% endfor %}
  101.         </div>
  102.     {% endif %}
  103. </li>