{% sw_extends '@Storefront/storefront/page/content/index.html.twig' %}
{% block layout_head_stylesheet %}
{{ parent() }}
{% if page.extensions.premsProductDiscounts %}
{% endif %}
{% endblock %}
{% block base_flashbags %}
{{ parent() }}
{% if page.extensions.premsProductDiscounts %}
<div class="flashbags container">
{% for productDiscount in page.extensions.premsProductDiscounts.all %}
{% if productDiscount.showDiscountInfoboxInListing and not productDiscount.isUpprice %}
<style type="text/css">
.prems-listing-discount-{{ productDiscount.id }}.alert {
background-color: {{ productDiscount.listingInfoboxTextColor }}
}
.prems-listing-discount-{{ productDiscount.id }}.alert .icon {
color: {{ productDiscount.detailpageInfoboxBackgroundColor }}
}
.prems-listing-discount-{{ productDiscount.id }} .alert-content-container {
background-color: {{ productDiscount.detailpageInfoboxBackgroundColor }}; color: {{ productDiscount.listingInfoboxTextColor }}
}
.prems-listing-discount-{{ productDiscount.id }} .alert-content-container h2 {
color: {{ productDiscount.listingInfoboxTextColor }}
}
</style>
<div role="alert" class="prems-listing-discount-{{ productDiscount.id }} alert alert-has-icon">
{% sw_icon 'info' %}
<div class="alert-content-container">
<div class="alert-content">
<h2>{{ productDiscount.translated.listingInfoboxTitle }}</h2>
<p>{{ productDiscount.translated.listingInfoboxText|raw }}</p>
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
{% endif %}
{% endblock %}