{% sw_extends '@Storefront/storefront/element/cms-element-moorl-foundation-listing.html.twig' %}
{# Just define item layouts here #}
{% block moorl_foundation_listing_item %}
{% set itemContent %}
<div class="moorl-listing-item-{{ config.itemLayout.value }}">
{% block moorl_testimonial_item %}
<div class="cms-element-testimonial-listing-item">
<div class="" style="{{ contentCss|join(';') }}">
{% block moorl_testimonial_item_inner %}
{% block moorl_testimonial_item_avatar %}
{% if item.avatar.url %}
{% sw_thumbnails 'moorl-listing-item-image-thumbnails' with {
media: item.avatar,
attributes: {
'alt': title,
'class': "is-#{config.displayMode.value}"
}
} %}
{% else %}
{% sw_icon 'placeholder' style {
'size': 'fluid'
} %}
{% endif %}
{% endblock %}
{% block moorl_testimonial_item_rating %}
{% if item.ratingMax > 0 %}
<div class="rating">
{% for i in 1..item.ratingMax %}
{% if item.rating >= i %}
{% sw_icon 'star' style {pack:'fas'} %}
{% else %}
{% sw_icon 'star' style {pack:'far'} %}
{% endif %}
{% endfor %}
</div>
{% endif %}
{% endblock %}
{% block moorl_testimonial_item_blockquote %}
<blockquote class="{% if config.showQuotes.value %}show-quotes{% endif %}">
{{ item.translated.teaser }}
</blockquote>
{% endblock %}
{% block moorl_testimonial_item_name %}
<h3>{{ item.translated.name }} <span>{{ item.translated.role }}</span></h3>
{% endblock %}
{% endblock %}
</div>
</div>
{% endblock %}
</div>
{% endset %}
<li class="{{ listingColumns }}">
{% if item.link %}
<a itemprop="mainEntityOfPage" href="{{ item.link }}" {% if config.urlNewTab.value %}target="_blank"
rel="noopener"{% endif %}
class="moorl-listing-item-wrapper{% if config.itemHasBorder.value %} has-border{% endif %}"
style="{{ itemCss|join(';')|raw }}"
title="{{ title }}">
{{ itemContent }}
</a>
{% else %}
<div class="moorl-listing-item-wrapper{% if config.itemHasBorder.value %} has-border{% endif %}"
style="{{ itemCss|join(';')|raw }}">
{{ itemContent }}
</div>
{% endif %}
</li>
{% endblock %}