custom/plugins/DecomTheme/src/Resources/views/storefront/page/product-detail/cross-selling/tabs.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/page/product-detail/cross-selling/tabs.html.twig' %}
  3. {% block page_product_detail_cross_selling_tabs_inner %}
  4.     <div class="card card-tabs" data-cross-selling="true">
  5.         {% block page_product_detail_cross_selling_tabs_navigation %}
  6.             <div class="card-header product-detail-tab-navigation product-cross-selling-tab-navigation">
  7.                 {% block page_product_detail_cross_selling_tabs_navigation_container %}
  8.                     <ul class="nav nav-tabs product-detail-tab-navigation-list"
  9.                         id="product-detail-cross-selling-tabs"
  10.                         role="tablist">
  11.                         {% for item in crossSellings %}
  12.                             {% set id = item.crossSelling.id %}
  13.                             {% if item.crossSelling.active and item.getProducts().elements %}
  14.                                 <li class="nav-item">
  15.                                     <a class="nav-link product-detail-tab-navigation-link{% if loop.first %} active{% endif %}"
  16.                                        id="cs-{{ id }}-tab"
  17.                                        data-toggle="tab"
  18.                                        href="#cs-{{ id }}-tab-pane"
  19.                                        role="tab"
  20.                                        aria-controls="cs-{{ id }}-tab-pane"
  21.                                        aria-selected="true">
  22.                                         {{ item.crossSelling.translated.name }}
  23.                                         <span class="product-detail-tab-navigation-icon">
  24.                                             {% sw_icon 'arrow-medium-right' style {'pack':'solid'} %}
  25.                                         </span>
  26.                                     </a>
  27.                                 </li>
  28.                             {% endif %}
  29.                         {% endfor %}
  30.                     </ul>
  31.                 {% endblock %}
  32.             </div>
  33.         {% endblock %}
  35.         {% block page_product_detail_cross_selling_tabs_content %}
  36.             <div class="product-detail-tabs-content card-body">
  37.                 {% block page_product_detail_cross_selling_tabs_content_container %}
  38.                     <div class="tab-content">
  39.                         {% for item in crossSellings %}
  40.                             {% set id = item.crossSelling.id %}
  41.                             {% if item.crossSelling.active and item.getProducts().elements %}
  42.                                 <div class="tab-pane fade show{% if loop.first %} active{% endif %}"
  43.                                      id="cs-{{ id }}-tab-pane"
  44.                                      role="tabpanel"
  45.                                      aria-labelledby="cs-{{ id }}-tab">
  46.                                         {% set config = {
  47.                                             'title': {
  48.                                                 'value': item.crossSelling.name
  49.                                             },
  50.                                             'border': {
  51.                                                 'value': false
  52.                                             },
  53.                                             'rotate': {
  54.                                                 'value': false
  55.                                             },
  56.                                             'products': {
  57.                                                 'value': item.getProducts()
  58.                                             },
  59.                                             'boxLayout': {
  60.                                                 'value': 'standard'
  61.                                             },
  62.                                             'elMinWidth': {
  63.                                                 'value': '260px'
  64.                                             },
  65.                                             'navigation': {
  66.                                                 'value': true
  67.                                             },
  68.                                             'displayMode': {
  69.                                                 'value': 'minimal'
  70.                                             },
  71.                                             'verticalAlign': {
  72.                                                 'value': 'top'
  73.                                             },
  74.                                         } %}
  76.                                         {% sw_include "@Storefront/storefront/element/cms-element-product-slider.html.twig" with {
  77.                                             sliderConfig: config,
  78.                                             element: {
  79.                                                 'data': {
  80.                                                     'products': {
  81.                                                         elements: item.getProducts()
  82.                                                     }
  83.                                                 },
  84.                                                 type: 'product-slider'
  85.                                             }
  86.                                         } %}
  87.                                 </div>
  88.                             {% endif %}
  89.                         {% endfor %}
  90.                     </div>
  91.                 {% endblock %}
  92.             </div>
  93.         {% endblock %}
  94.     </div>
  95. {% endblock %}