custom/plugins/SteincoTheme/src/Resources/views/storefront/page/product-detail/index.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/page/product-detail/index.html.twig' %}
  3. {% block base_content %}
  5.     {% set isRolle = (page.product is sc_rolle()) %}
  6.     {% set isZubehoer = (page.product is sc_zubehoer()) %}
  7.     {% block page_product_detail %}
  9. {# (page.product.tags|first).name|default('Kein Tag vorhanden') #}
  10.         {# dump( page.product) #}
  12.     {% set properties = page.product.extensions.properties.property_options %}
  13.     {% set imgPhoto = "" %}
  14.     {% set img2D = "" %}
  15.     {% set imgFitting = "" %}
  16.     {% set img3D = (isRolle or isZubehoer) ? "check" : null %}
  17.     {% set mediaItems = page.product.media %}
  19.     {% set altPhoto = "" %}
  20.     {% set alt2D = "" %}
  21.     {% set altFitting = "" %}
  23.     {% set pos = 0 %}
  25.     {% for image in mediaItems|sort((a, b) => a.position <=> b.position) %}
  26.         {% set pos = pos + 1 %}
  27.         {% if pos == 1 %}
  28.             {# the photo #}
  29.             {% set imgPhoto = image.media.url %}
  30.         {% endif %}
  31.         {% if pos == 2 %}
  32.             {# the 2d drawing  #}
  33.             {% set img2D = image.media.url %}
  34.             {% set alt2D = altPhoto ~ ", " ~ "steinco.productDetail.drawing.2D"|trans|sw_sanitize %}
  35.         {% endif %}
  36.         {% if pos == 3 %}
  37.             {# the fitting drawing  #}
  38.             {% set imgFitting = image.media.url %}
  39.             {% if isZubehoer %}
  40.                 {% set altFitting = altPhoto ~ ", " ~ "steinco.application"|trans|sw_sanitize %}
  41.             {% else %}
  42.                 {% set altFitting = altPhoto ~ ", " ~ "steinco.productDetail.drawing.fitting"|trans|sw_sanitize %}
  43.             {% endif %}
  44.         {% endif %}
  45.     {% endfor %}
  47.     {% if showPrices %}
  48.         {# create a JS array to hold all prices #}
  49.         <script>
  50.             {% set prices = page.product.calculatedPrices %}
  51.             {% set quantity = 1 %}
  52.             const priceScale = [];
  53.             {% for price in prices|sort((a, b) => a.quantity <=> b.quantity) %}
  54.                 priceScale.push([{{ quantity }}, '{{ price.unitPrice|currency }}']);
  55.                 {% set quantity = price.quantity + 1 %} {# start der nächsten Rabattstufe #}
  56.             {% endfor %}
  57.         </script>
  58.     {%  endif %}
  60.     {# TODO: page reload triggered by id 'sc-productDetailPage' always fires: "div id="sc-productDetailPage" class="row ge scsw-product-detail mt-5" #}
  61.     {% block sc_page_info %}
  62.     {# set <sc-page-info> to generate seo-path independent links in the language menu #}
  63.         {# this is done in steinco.js (TYPO3), function adjustLang(snippet) #}
  64.     <sc-page-info path="{{path('frontend.home.page')}}detail/{{page.product.id}}"/>
  65.     {% endblock %}
  66.     <div id="sc-productDetailPage" class="row ge scsw-product-detail mt-5">
  68.             <div class="col-xl-6 col-lg-6 col-md-12 col-12 scsw-pd-image">
  70.                 {% block page_product_detail_main %}
  71.                     {# removed #}
  72.                 {%  endblock %}
  73.                 {% block page_product_detail_media %}
  74.                     {% if mediaItems|length > 0 %}
  76.                         <div
  77.                             style="width: 100%; height: auto;">
  79.                             {# define the image fullscreen overlay #}
  80.                             <div
  81.                                 id="scswOverlay" class="scsw-img-overlay">
  83.                                 {# Button to close the overlay navigation #}
  84.                                 <div id="scswOverlayHeading" class="scsw-overlay-heading" style="display: none;">
  85.                                     <h2>
  86.                                         {% sw_include '@SteincoTheme/storefront/utilities/sc-product-title.html.twig' with { prod: product } %}
  87.                                         <span style="font-weight: 400">
  88.                                             {{ "steinco.product"|trans|sw_sanitize }}:
  89.                                             {{page.product.productNumber}}
  90.                                         </span>
  91.                                     </h2>
  92.                                     <a href="#0" class="scsw-closebtn" onclick="closeOverlay();">&times;</a>
  93.                                 </div>
  94.                                 <div id="scswOverlayActions" class="scsw-overlay-actions">
  95.                                     {% set classBtnDownload = "btn btn-block btn-buy" %}
  96.                                     {% set onClick = "onclick" %}
  97.                                     {% if not context.customer %}
  98.                                         {% set classBtnDownload = classBtnDownload ~ " disabled" %}
  99.                                         {% set onClick = "noclick" %}
  100.                                     {% else %}
  101.                                         {% set classBtnDownload = classBtnDownload ~ " btn-primary" %}
  102.                                     {% endif %}
  103.                                     <h4>{{ "steinco.cad.downloadTitle"|trans|striptags }}</h4>
  104.                                     <select id="scswCadFormats" class="scsw-cad-formats"></select>
  105.                                     <button id="scswCadDownload" class="{{classBtnDownload}}" {{onClick}}="downloadCadFile(this, '{{page.product.productNumber}}', '{{ "steinco.cad.limit"|trans|striptags }}');" title="{{ "steinco.cad.download"|trans|striptags }}" aria-label="{{ "steinco.cad.download"|trans|striptags }}">
  106.                                         {{ "steinco.cad.download"|trans|striptags }}
  107.                                     </button>
  108.                                     {% if not context.customer %}
  109.                                         <div class="account-menu-login">
  110.                                             <a href="{{ path('frontend.account.login.page') }}" title="{{ "account.loginSubmit"|trans|striptags }}" class="btn btn-primary account-menu-login-button">
  111.                                                 {{ "account.loginSubmit"|trans|sw_sanitize }}
  112.                                             </a>
  114.                                             <div class="account-menu-register">
  115.                                                 {{ "account.orRegister"|trans|sw_sanitize }}
  116.                                                 <a href="{{ path('frontend.account.login.page') }}" title="{{ "account.orRegisterLink"|trans|striptags }}">{{ "account.orRegisterLink"|trans|striptags }}</a>
  117.                                             </div>
  118.                                         </div>
  119.                                     {% endif %}
  120.                                 </div>
  121.                                 {# overlay content #}
  122.                                 <div id="scswOverlayImageContainer" class="scsw-overlay-img">
  123.                                     <iframe id="scswOverlayRender3D" class="scsw-overlay-render3D" src="" scrolling="no" seamless="seamless" frameborder="0"></iframe>
  124.                                     <img id="scswOverlayImage" src="" alt="" style="max-height: 100%; max-width: 100%; width: auto; height: auto; padding: 5%; margin: auto;" onclick="closeOverlay();">
  125.                                 </div>
  126.                             </div>
  128.                             {% set altPhoto =         page.product.productNumber ~ ", "
  129.                                                      ~ properties["Rolle_Bauart_Kundenfilter"].value|e ~ ", ∅ "
  130.                                                     ~ properties["Rad_Durchmesser_mm"].value|e ~ "steinco.property.mm"|trans ~ ", " 
  131.                                                     ~ properties["Rad_Lager_Kundenfilter"].value|e ~ ", " 
  132.                                                     ~ properties["Rad_Bereifung"].value|e ~ ", " 
  133.                                                     ~ properties["Befestigung_Abmessungen_Gruppe"].value|e  %}
  135.                             {% if imgPhoto %}
  136.                                 {# the photo #}
  137.                                 <img id="scswImagePhoto" src="{{imgPhoto}}" alt="{{altPhoto}}" style="display:none;">
  138.                             {% endif %}
  139.                             {% if img2D %}
  140.                                 {# the 2d drawing  #}
  141.                                 <img id="scswImage2D" src="{{img2D}}" alt="{{alt2D}} " style="display:none;">
  142.                             {% endif %}
  143.                             {% if imgFitting %}
  144.                                 {# the fitting drawing  #}
  145.                                 <img id="scswImageFitting" src="{{imgFitting}}" alt="{{altFitting}}" style="display:none;">
  146.                             {% endif %}
  148.                             <div id="scswDetailImageContainer">
  149.                                 <span class="scsw-similar-image-details" onclick="openOverlay();">{{ "steinco.similarImage"|trans }}</span>
  150.                                 <img class="scsw-detail-image" src="{{imgPhoto}}" alt="{{altPhoto}}" id="scswDetailImage" onclick="openOverlay();" style="width: 100%; height: auto;">
  151.                             </div>
  152.                         </div>
  154.                     {% endif %}
  155.                     {# replaced #}
  156.                     {# pdf dwonload #}
  157.                 {% endblock %}
  158.             </div>
  159.             <div
  160.                 class="col-xl-6 col-lg-6 col-md-12 col-12 scsw-pd-description">
  161.                 {# title, icons, decription, add to cart #}
  162.                 {% block page_product_detail_headline %}
  163.                     <div class="product-detail-headline scsw-detail-headline mb-3">
  164.                         <h1 style="line-height: 1.5rem;    padding-bottom: 1rem;">
  165.                             {% sw_include '@SteincoTheme/storefront/utilities/sc-product-title.html.twig' with { prod: page.product } %}
  166.                             <span style="font-weight: 400;font-size: 1.5rem;"><br/>
  167.                                 {% if isRolle %}
  168.                                     {% sw_include '@SteincoTheme/storefront/utilities/sc-product-subtitle.html.twig' with { prod: page.product } %}
  169.                                 {% endif %}
  170.                                 {% if properties['Auslaufteil'].value == 'Auslaufartikel' %}
  171.                                     <div style="padding: 0.3rem; margin-top: 0.5rem;" class="scsw-intra">{{ "steinco.discontinuedArticle"|trans }}</div>
  172.                                 {% elseif properties['Status_Prodsystem'].value|default('Katalog') != 'Katalog' %}
  173.                                     <div style="padding: 0.3rem; margin-top: 0.5rem;" class="scsw-intra">{{ "steinco.noStandardProduct"|trans }}</div>
  174.                                 {% endif %}
  175.                             </span>
  176.                             {% if showPrices %}
  177.                                 <span style="font-weight: 400;font-size: 1rem;">
  178.                                     {% sw_include '@SteincoTheme/storefront/page/product-detail/availability.html.twig' with {
  179.                                         prod: page.product,
  180.                                         showQuantity: true
  181.                                     } %}
  182.                                 </span>
  183.                             {% endif %}
  184.                         </h1>
  185.                         {# % sw_include '@Storefront/storefront/page/product-detail/headline.html.twig' % #}
  186.                     </div>
  187.                 {% endblock %}
  189.                 {# Branchen-Icons #}
  190.                 {% if not isZubehoer %}
  191.                     <div class="scsw-images-branche">
  193.                         {% set props = page.product.extensions.properties %}
  195.                         {%  if isRolle %}
  196.                             {#
  197.                                 SELECT
  198.                                     CONCAT('{% set allowed_', id, ' = ["', id, '", "', GROUP_CONCAT(text ORDER BY Sprache_IsoAlpha2 ASC SEPARATOR '", "'), '"] %}') AS twig_set_statement
  199.                                 FROM
  200.                                     Beschreibungen
  201.                                 WHERE
  202.                                     id LIKE 'BR\_%'
  203.                                 GROUP BY
  204.                                     id;
  205.                             #}
  206.                             {% set allowed_Br_Betriebsausstattung = ["Br_Betriebsausstattung", "Betriebsausstattung", "Factory equipment", "Factory equipment", "Equipamiento empresarial", "Équipement professionnel", "Attrezzature industriali", "Производственное оборудование", "Factory equipment"] %}
  207.                             {% set allowed_Br_Buero_u_Labor = ["Br_Buero_u_Labor", "Büro & Labor", "Office & laboratory", "Office & laboratory", "Oficinas y laboratorios", "Bureaux & laboratoires", "Uffici e laboratori", "Офисы и лаборатории", "Office & laboratory"] %}
  208.                             {% set allowed_Br_Grosskueche = ["Br_Grosskueche", "Großküchenlogistik", "Central kitchen logistics", "Central kitchen logistics", "Logística de cocinas industriales", "Logistique Restauration collective", "Logistica per cucine industriali", "Логистика пищеблоков", "Central kitchen logistics"] %}
  209.                             {% set allowed_Br_Ladenbau = ["Br_Ladenbau", "Ladenbau", "Shop fitting", "Shop fitting", "Establecimientos comerciales", "Construction de magasins", "Arredamento commerciale", "Торговые помещения", "Shop fitting"] %}
  210.                             {% set allowed_Br_Luftfahrt = ["Br_Luftfahrt", "Luftfahrt", "Aviation", "Aviation", "Aeronáutica", "Aéronautique", "Aeronautica", "Воздушный транспорт", "Aviation"] %}
  211.                             {% set allowed_Br_Medizintechnik = ["Br_Medizintechnik", "Medizintechnik", "Medical equipment", "Medical equipment", "Dispositivos médicos", "Matériel médical", "Tecnologie medicali", "Медицинская техника", "Medical equipment"] %}
  213.                             {% if intersect(props.branchen, allowed_Br_Medizintechnik) %}
  214.                                 <a href="{{path('frontend.home.page')}}search/Branche/Medizintechnik" style="text-decoration: none;">
  215.                                     <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Medizintechnik-white.svg','@SteincoTheme') }}"
  216.                                     alt="{{ "steinco.icons.Medizintechnik.alt"|trans}}"/>
  217.                                 </a>
  218.                             {% endif %}
  219.                             {% if intersect(props.branchen, allowed_Br_Grosskueche) %}
  220.                                 <a href="{{path('frontend.home.page')}}search/Branche/Großküchenlogistik" style="text-decoration: none;">
  221.                                     <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Lebensmittel-white.svg','@SteincoTheme') }}"
  222.                                     alt="{{ "steinco.icons.Grosskuechenlogistik.alt"|trans}}"/>
  223.                                 </a>
  224.                             {% endif %}
  225.                             {% if intersect(props.branchen, allowed_Br_Ladenbau) %}
  226.                                 <a href="{{path('frontend.home.page')}}search/Branche/Ladenbau" style="text-decoration: none;">
  227.                                     <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Ladenbau-white.svg','@SteincoTheme') }}"
  228.                                     alt="{{ "steinco.icons.Ladenbau.alt"|trans}}"/>
  229.                                 </a>
  230.                             {% endif %}
  231.                             {% if intersect(props.branchen, allowed_Br_Betriebsausstattung) %}
  232.                                 <a href="{{path('frontend.home.page')}}search/Branche/Betriebsausstattung" style="text-decoration: none;">
  233.                                     <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Betriebsausstattung-white.svg','@SteincoTheme') }}"
  234.                                     alt="{{ "steinco.icons.Betriebsausstattung.alt"|trans}}"/>
  235.                                 </a>
  236.                             {% endif %}
  237.                             {% if intersect(props.branchen, allowed_Br_Buero_u_Labor) %}
  238.                                 <a href="{{path('frontend.home.page')}}search/Branche/Büro & Labor" style="text-decoration: none;">
  239.                                     <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Labor-white.svg','@SteincoTheme') }}"
  240.                                     alt="{{ "steinco.icons.Buero.Labor.alt"|trans}}"/>
  241.                                 </a>
  242.                             {% endif %}
  243.                             {% if intersect(props.branchen, allowed_Br_Luftfahrt) %}
  244.                                 <a href="{{path('frontend.home.page')}}search/Branche/Luftfahrt" style="text-decoration: none;">
  245.                                     <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Luftfahrt-white.svg','@SteincoTheme') }}"
  246.                                     alt="{{ "steinco.icons.Luftfahrt.alt"|trans}}"/>
  247.                                 </a>
  248.                             {% endif %}
  249.                         {% else %}
  250.                             {# Rad: Alle Branchen anzeigen, kein Link, da es keinen passenden Filter gibt #}
  251.                             <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Medizintechnik-white.svg','@SteincoTheme') }}"
  252.                                  alt="{{ "steinco.icons.Medizintechnik.alt"|trans}}"/>
  253.                             <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Lebensmittel-white.svg','@SteincoTheme') }}"
  254.                                  alt="{{ "steinco.icons.Grosskuechenlogistik.alt"|trans}}"/>
  255.                             <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Ladenbau-white.svg','@SteincoTheme') }}"
  256.                                  alt="{{ "steinco.icons.Ladenbau.alt"|trans}}"/>
  257.                             <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Betriebsausstattung-white.svg','@SteincoTheme') }}"
  258.                                  alt="{{ "steinco.icons.Betriebsausstattung.alt"|trans}}"/>
  259.                             <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Labor-white.svg','@SteincoTheme') }}"
  260.                                  alt="{{ "steinco.icons.Buero.Labor.alt"|trans}}"/>
  261.                             <img class="scsw-img-branche" src="{{ asset('assets/icons/industries/Icon-Luftfahrt-white.svg','@SteincoTheme') }}"
  262.                                  alt="{{ "steinco.icons.Luftfahrt.alt"|trans}}"/>
  263.                         {% endif %}
  264.                         {# <div>{{path('frontend.home.page')|replace({',': '•', '/': '|'})}}</div> #}
  265.                     </div>
  266.                 {% endif %}
  267.                 {# description #}
  268.                 <div class="scsw-pd-text mt-3 mb-2" style="line-height: 1rem;">
  269.                     <steinco-article>
  270.                         <strong>{{ "steinco.product"|trans|sw_sanitize }}:</strong>
  271.                         {{ page.product.productNumber }}
  272.                         {% if page.product.ean is not sc_empty %}
  273.                             <br/>{{ "steinco.gtin_ean"|trans|sw_sanitize }}:
  274.                             {{ page.product.ean }}
  275.                         {% endif %}
  276.                         {% if page.product.customFields.custom_product_ctn is not sc_empty %}
  277.                             <br/>{{ "steinco.ctn"|trans|sw_sanitize }}:
  278.                             {{ page.product.customFields.custom_product_ctn }}
  279.                         {% endif %}
  280.                     </steinco-article>
  281.                 </div>
  282.                 <div class="scsw-pd-text mb-4">
  283.                     <steinco-article>
  284.                         <strong>{{ "component.product.feature.label.description"|trans|sw_sanitize }}</strong>
  285.                     </steinco-article>
  286.                     {{ page.product.translated.description|raw }}
  287.                 </div>
  289.                 {% if properties['Beratungspflicht'] %}
  290.                     {% if properties['Beratungspflicht'].value is sc_yes %}
  291.                         <div class="scsw-pd-needs-consulting mb-4">
  292.                             {{ "steinco.needsConsulting"|trans({'%article%': page.product.productNumber})|raw }}
  293.                         </div>
  294.                     {% endif %}
  295.                 {% endif %}
  297.                 {# add to cart #}
  298.                 {% block page_product_detail_buy %}
  299.                     {% sw_include '@Storefront/storefront/component/product/card/wishlist.html.twig' with {
  300.                         showText: true,
  301.                         size: 'md',
  302.                         productId: page.product.id
  303.                     } %}
  304.                 {%  endblock %}
  306.             </div>
  308.             <div class="pb-2 pt-4" style="width: 100%; padding: 3rem 1rem 0 !important;">
  309.                 <h5
  310.                     class="scsw-link-button-group">
  311.                     {#% if imgPhoto  %}
  312.                                             <a href="#0" onclick="setDetailPhoto();" class="scsw-link-button">
  313.                                                 <span class="nowrap">{{ "steinco.productDetail.image"|trans|sw_sanitize }}</span></a>
  314.                                         {% endif %#}
  315.                     {% set style = 'style="border: 1px solid var( --sc-black-20); width: 11rem; margin-bottom: 0.5rem;"' %}
  316.                     {% if img2D  %}
  317.                         <button href="#0" onclick="setDetail2DImage();" {{ style|raw }} class="btn scsw-link-button">
  318.                             <img class="scsw-link-button-icon" src="{{ asset('assets/icons/symbols/icon-2d-x2.png','@SteincoTheme') }}"/>
  319.                             <span class="nowrap scsw-2d">{{ "steinco.productDetail.drawing.2D"|trans|sw_sanitize }}</span>
  320.                         </button>
  321.                     {% endif %}
  322.                     {% if imgFitting  %}
  323.                         <button href="#0" onclick="setDetailFitting();" {{ style|raw }} class="btn scsw-link-button">
  324.                             {% if isZubehoer %}
  325.                                 <img class="scsw-link-button-icon" src="{{ asset('assets/icons/symbols/icon-settings-x2.png','@SteincoTheme') }}"/>
  326.                                 <span class="nowrap">{{ "steinco.application"|trans|sw_sanitize }}</span>
  327.                             {% else %}
  328.                                 <img class="scsw-link-button-icon" src="{{ asset('assets/icons/symbols/icon-2d-x2.png','@SteincoTheme') }}"/>
  329.                                 <span class="nowrap">{{ "steinco.productDetail.drawing.fitting"|trans|sw_sanitize }}</span>
  330.                             {% endif %}
  331.                         </button>
  332.                     {% endif %}
  333.                     {% if img3D  %}
  334.                         {% set errMsg %}{{ 'steinco.noCADData'|trans({'%prodnr%': page.product.productNumber})|sw_sanitize|e('js') }}{% endset %}
  335.                         <button {{ style|raw }} class="btn scsw-link-button" href="#0" onclick="openOverlay3D('{{page.product.productNumber}}', '{{errMsg}}');">
  336.                             <img class="scsw-link-button-icon" src="{{ asset('assets/icons/symbols/icon-3d-x2.png','@SteincoTheme') }}"/>
  337.                             <span class="nowrap">{{ "steinco.productDetail.drawing.3D"|trans|sw_sanitize }}</span>
  338.                         </button>
  339.                     {% endif %}
  340.                     {# Später notwendig: Übergabe an PDF set currentPath = seoUrl('frontend.detail.page', {'productId': page.product.id}) #}
  341.                     {# <button onclick="location.href='{{ path('frontend.home.page') }}pdf/{{ page.product.productNumber }}?url={{ currentPath }}'" {{ style|raw }} class="btn scsw-link-button"> #}
  342.                     <button onclick="location.href='{{ path('frontend.home.page') }}pdf/{{ page.product.productNumber }}'" {{ style|raw }} class="btn scsw-link-button">
  343.                         <img class="scsw-link-button-icon" src="{{ asset('assets/icons/symbols/icon-pdf-x2.png','@SteincoTheme') }}"/>
  344.                         <span class="nowrap">{{ "steinco.productDetail.pdf"|trans|sw_sanitize }}</span>
  345.                     </button>
  346.                 </h5>
  347.             </div>
  348.             {% block page_product_detail_tabs %}
  349.                 {% set showVariants = false %}
  350.                 <div class="col-xl-12 offset-xl-0 col-md-12 offset-md-0 sc-tab-container ge ge_tabs_container">
  351.                     <nav id="scswDetailsTab" class="nav nav-tabs mb-1" role="tablist" style="float: left; width: 100%; border-top: 1px solid lightgray; margin-top: 1.5rem; padding-top: 1rem;">
  353.                         <a id="tab-td" class="nav-item nav-link scsw-tab-link active" href="#tab-content-td" data-toggle="tab" role="tab" aria-controls="tab-content-td" aria-selected="true">
  354.                             {{ "steinco.technicalData"|trans|sw_sanitize }}
  355.                         </a>
  356.                         <a id="tab-te" class="nav-item nav-link scsw-tab-link" href="#tab-content-te" data-toggle="tab" role="tab" aria-controls="tab-content-te" aria-selected="false">
  357.                             {{ "steinco.technicalCharacteristics"|trans|sw_sanitize }}
  358.                         </a>
  359.                         {% if showVariants %}
  360.                             <a id="tab-va" class="nav-item nav-link scsw-tab-link" href="#tab-content-va" data-toggle="tab" role="tab" aria-controls="tab-content-va" aria-selected="false">
  361.                                 {{ "steinco.variants"|trans|sw_sanitize }}
  362.                             </a>
  363.                         {% endif %}
  364.                         {% if showPrices %}
  365.                             <a id="tab-pr" class="nav-item nav-link scsw-tab-link" href="#tab-content-pr" data-toggle="tab" role="tab" aria-controls="tab-content-pr" aria-selected="false">
  366.                                 {{ "steinco.prices.prices"|trans|sw_sanitize }}
  367.                             </a>
  368.                         {% endif %}
  369.                     </nav>
  370.                     <div>
  371.                         <div id="scswDetailsTab" class="tab-content">
  372.                             <div id="tab-content-td" class="tab-pane fade ge ge_tabs_tab show active" role="tabpanel" aria-labelledby="tab-td" style="float: left;">
  373.                                 {% sw_include '@Storefront/storefront/page/product-detail/properties.html.twig'
  374.                                                 with { subset: isRolle ? "td" : (isZubehoer ? "tz" : "tr") } %}
  375.                             </div>
  376.                             <div id="tab-content-te" class="tab-pane fade ge ge_tabs_tab" role="tabpanel" aria-labelledby="tab-te" style="float: left;">
  377.                                 {% sw_include '@Storefront/storefront/page/product-detail/properties.html.twig' with { subset: "te" } %}
  378.                             </div>
  379.                             {% if showVariants %}
  380.                                 <div id="tab-content-va" class="tab-pane fade xyz ge ge_tabs_tab" role="tabpanel" aria-labelledby="tab-va" style="float: left;">
  381.                                     {% sw_include '@Storefront/storefront/utilities/alert.html.twig' with {
  382.                                             type:"info",
  383.                                             content: 'steinco.text.noVariants'|trans|sw_sanitize
  384.                                     } %}
  385.                                     {% sw_include '@Storefront/storefront/page/product-detail/properties.html.twig' with { subset: "all" } %}
  386.                                 </div>
  387.                             {% endif %}
  388.                             {% if showPrices %}
  389.                                 <div id="tab-content-pr" class="tab-pane fade ge ge_tabs_tab" role="tabpanel" aria-labelledby="tab-pr" style="float: left;">
  390.                                     {% sw_include '@Storefront/storefront/page/product-detail/properties.html.twig' with { subset: "pr" } %}
  391.                                 </div>
  392.                             {% endif %}
  393.                         </div>
  394.                     {% endblock %}
  395.                 </div>
  397.             {%  endblock %}
  398.         {%  endblock %}