{% sw_extends '@Storefront/storefront/component/product/card/box-standard.html.twig' %}
{% block component_product_box_badges %}{% endblock %}
{% block component_product_box_content %}
<div class="card-body">
{% sw_include '@Storefront/storefront/component/product/card/meta.html.twig' %}
<div class="row extended-product-box">
<div class="col-md-4">
<div class="product-image-wrapper">
{# fallback if display mode is not set #}
{% set displayMode = displayMode ?: 'standard' %}
{# set display mode 'cover' for box-image with standard display mode #}
{% if layout == 'image' and displayMode == 'standard' %}
{% set displayMode = 'cover' %}
{% endif %}
<a href="{{ seoUrl('frontend.detail.page', {'productId': id}) }}"
title="{{ name }}"
class="product-image-link is-{{ displayMode }}">
{% if cover.url %}
{% set attributes = {
'class': 'product-image is-'~displayMode,
'alt': (cover.translated.alt ?: name),
'title': (cover.translated.title ?: name)
} %}
{% if displayMode == 'cover' or displayMode == 'contain' %}
{% set attributes = attributes|merge({ 'data-object-fit': displayMode }) %}
{% endif %}
{% sw_thumbnails 'product-image-thumbnails' with {
media: cover,
sizes: sizes
} %}
{% else %}
<div class="product-image-placeholder">
{% sw_icon 'placeholder' style {
'size': 'fluid'
} %}
</div>
{% endif %}
</a>
</div>
</div>
<div class="col-md-8 product-info">
<div class="row">
<div class="col-sm-8 col-md-12 col-lg-8">
<a href="{{ seoUrl('frontend.detail.page', {'productId': id}) }}"
class="product-name"
title="{{ name }}">
{{ name }}
</a>
<div class="mpa--item-description">
{% if product.productNumber %}
<meta itemprop="productID" content="{{ product.id }}"/>
<p><strong>{{ "detail.productNumberLabel"|trans|sw_sanitize }}</strong> {{product.productNumber }}</p>
{% endif %}
{% if product.manufacturer %}
<p><strong>Hersteller:</strong> {{ product.manufacturer.translated.name }}</p>
{% endif %}
{% if page.metaInformation.metaTitle %}
<p><strong>passende Marke:</strong> {{ page.metaInformation.metaTitle }}</p>
{% endif %}
{% if product.translated.customFields.custom_custom_fields_part_number %}
<p><strong>Teilenummer:</strong> {{ product.translated.customFields.custom_custom_fields_part_number }}</p>
{% endif %}
{% if product.translated.customFields.custom_custom_fields_scope_delivery %}
<div class="mpa--scope-delivery">
<h6>Lieferumfang:</h6>
{{ product.translated.customFields.custom_custom_fields_scope_delivery|raw }}
</div>
{% endif %}
</div>
</div>
<div class="col-sm-4 col-md-12 col-lg-4">
<div class="mpa--product-price-area">
{% sw_include '@Storefront/storefront/component/product/card/price-unit.html.twig' %}
<div class="product-detail-tax-container">
{% if context.taxState == "gross" %}
{% set taxText = "general.grossTaxInformation"|trans|sw_sanitize %}
{% else %}
{% set taxText = "general.netTaxInformation"|trans|sw_sanitize %}
{% endif %}
<p class="product-detail-tax">
{{ taxText }}
<a class="product-detail-tax-link"
href="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}"
title="{{ taxText }}"
data-toggle="modal"
data-url="{{ path('frontend.cms.page',{ id: config('core.basicInformation.shippingPaymentInfoPage') }) }}">
Versandkosten
</a>
</p>
</div>
<div class="product-detail-delivery-information">
{% sw_include '@Storefront/storefront/component/delivery-information.html.twig' %}
</div>
</div>
</div>
<div class="col-12">
{% sw_include '@Storefront/storefront/component/product/card/action.html.twig' %}
</div>
</div>
</div>
</div>
</div>
{% endblock %}