{% set spacingSelect %} 
    {{ pimcore_checkbox("checkSpacing", { 
        "reload": true 
    }) }} 
{% endset %} 
{% set noSpacingTop = '' %} 
{% set brickAnchorId = '' %} 
{% if pimcore_input("brickAnchorIdInput") is not empty %} 
    {% set brickAnchorId = pimcore_input("brickAnchorIdInput")|lowercase %} 
{% endif %} 
{% if pimcore_checkbox('checkSpacing').isChecked() %} 
    {% set noSpacingTop = 'no-offset-top' %} 
{% endif %} 
{% set UID = uniqid() %} 
{% set hasSliderSelect %} 
    {{ pimcore_select("hasSlider", { 
        "store": [ 
        ["has-slider", "Slider"], 
        ["no-slider", "Listenansicht"] 
        ], 
        "width": 300, 
        "reload": true 
    }) }} 
{% endset %} 
{% set colSelect %} 
    {{ pimcore_select("cols", { 
        "store": [ 
        ["xs-12 full", "1"], 
        ["xs-12 m-6 half", "2"], 
        ["xs-12 m-6 l-4 one-third", "3"] 
        ], 
        "width": 300, 
        "reload": true 
    }) }} 
{% endset %} 
 
{% set colsSelectResult = pimcore_select("cols").getData() %} 
{% if editmode %} 
    <div class="flex-col offset-bottom-single"> 
        <div class="col xs-12 m-6 l-3"> 
            <span class="hint">{{ 'admin.brick.hint.anchorId' |trans }}</span> 
            {{ pimcore_input("brickAnchorIdInput") }} 
        </div> 
        <div class="col xs-12 m-6 l-3"> 
            <div class="select-items"> 
                <div class="hint"> 
                    {{ 'admin.brick.hint.paddingTop' |trans }} 
                </div> 
                {{ spacingSelect }} 
            </div> 
        </div> 
        <div class="col xs-12 m-6 l-3"> 
            <span class="hint">{{ 'admin.brick.hint.selectCol' |trans }}</span> 
            {{ colSelect }} 
        </div> 
        <div class="col xs-12 m-6 l-3"> 
            <span class="hint">{{ 'admin.brick.hint.displayMode' |trans }}</span> 
            {{ hasSliderSelect }} 
        </div> 
    </div> 
{% endif %} 
 
{% set contentWidthSelectResult = pimcore_select("contentWidth") %} 
{% set BundleName =  document.module | replace ({'Bundle' : ''})%} 
 
{% set colsSelectResultClass %} 
    {% if colsSelectResult == 'xs-12 m-6 half' %} 
        half 
    {% elseif colsSelectResult == 'xs-12 full' %} 
        full 
    {% else %} 
        one-third 
    {% endif %} 
{% endset %} 
 
{% set sliderClass %} 
    {% if not editmode %} 
        {{ pimcore_select("hasSlider").getData() }} 
    {% endif %} 
{% endset %} 
 
{% if editmode %} 
<div class="admin teaser-panel-row"> 
{% endif %} 
 
    <div id="{{ brickAnchorId }}" class="section {{ noSpacingTop }}"> 
        <div class="panel has-background {{ sliderClass|spaceless }} {{ colsSelectResultClass|spaceless }}"> 
            <div class="main-content"> 
                <div class="panel-container"> 
                    <div class="panel-content"> 
                        <div class="flex-col panel-slider"> 
                            {% for i in pimcore_iterate_block(pimcore_block('contentblock')) %} 
                                {% set productLink = pimcore_href("selectProduct").getElement() %} 
                                <div class="col {{ colsSelectResult }}"> 
                                    {% if editmode %} 
                                        <div class="offset-bottom-single"> 
                                            <span class="hint"> 
                                        {{ 'admin.brick.hint.addProduct'|trans }}</span> 
                                            {{ pimcore_href("selectProduct", { 
                                                "types": ["object"], 
                                                "subtypes": { 
                                                    "types": ["object"], 
                                                }, 
                                                "classes": ["ProductFood", "ProductClothing", "Product"], 
                                                "width": 300, 
                                                "reload": true 
                                            }) }} 
                                        </div> 
                                    {% endif %} 
                                    {% if pimcore_href("selectProduct").isEmpty() != true %} 
                                        {% set detailViewUri    = pimcore_url( 
                                        { 
                                        "name": productLink.getName()|sanitized_url, 
                                        "articlenumber": productLink.getArticleNumber() 
                                        }, 
                                         "shopHandlerProductDetail" 
                                        ) %} 
                                    {% endif %} 
                                    <div class="teaser image-text"> 
                                        <div class="teaser-content"> 
                                            <div class="teaser-image"> 
                                                {% if pimcore_href("selectProduct").isEmpty() != true %} 
                                                <a href="{{ detailViewUri }}" aria-label="Open Details"> 
                                                    {% else %} 
                                                    <a href="{{ pimcore_link("productLink").getHref() }}" target="{{ pimcore_link("productLink").getTarget() }}" aria-label="Open Details"> 
                                                        {% endif %} 
                                                        <div class="image"> 
                                                            {% if colsSelectResult == 'xs-12 full' %} 
                                                                {{ pimcore_image("teaserImage", { 
                                                                    "title": "Drag your image here", 
                                                                    "thumbnail": "teaserImageFull" ~ bundleName 
                                                                }) }} 
                                                            {% elseif colsSelectResult == 'xs-12 m-6 half' %} 
                                                                {{ pimcore_image("teaserImage", { 
                                                                    "title": "Drag your image here", 
                                                                    "thumbnail": "teaserImageHalf" ~ bundleName 
                                                                }) }} 
                                                            {% elseif colsSelectResult == 'xs-12 m-6 l-4 one-third' %} 
                                                                {{ pimcore_image("teaserImage", { 
                                                                    "title": "Drag your image here", 
                                                                    "thumbnail": "teaserImage" ~ bundleName 
                                                                }) }} 
                                                            {% endif %} 
                                                        </div> 
                                                        {% if pimcore_href("selectProduct").isEmpty() != true %} 
                                                    </a> 
                                                    {% else %} 
                                                </a> 
                                                {% endif %} 
                                            </div> 
                                            <div class="teaser-text-box"> 
                                                <div class="title-box"> 
                                                    {% if pimcore_input("teaserHeadline") is not empty %} 
                                                        <h4> 
                                                            {{ pimcore_input("teaserHeadline", {'placeholder': 'Headline'})|trademark }} 
                                                        </h4> 
                                                    {% endif %} 
                                                </div> 
                                                <div class="content-box"> 
                                                    {% if pimcore_input("teaserContent") is not empty %} 
                                                        <p>{{ pimcore_input("teaserContent", {'placeholder': 'Teaser Content'})|trademark }}</p> 
                                                    {% endif %} 
                                                </div> 
                                                <div class="teaser-link"> 
                                                    {% if pimcore_href("selectProduct").isEmpty() != true %} 
                                                        <a class="button btn-default" href="{{ detailViewUri }}" aria-label="{{ 'Zum Produkt' |trans }}">{{ 'Zum Produkt' |trans }}</a> 
                                                    {% else %} 
                                                        {{ pimcore_link('productLink', {'class': "button btn-default"}) }} 
                                                    {% endif %} 
                                                </div> 
                                            </div> 
                                        </div> 
                                    </div> 
                                </div> 
                            {% endfor %} 
                        </div> 
                    </div> 
                </div> 
            </div> 
        </div> 
    </div> 
 
{% if editmode %} 
</div> 
{% endif %}