{namespace neos=Neos\Neos\ViewHelpers}
{namespace poi=Newland\Toubiz\Poi\Neos\ViewHelpers}
{namespace vh=Newland\NeosViewHelpers\ViewHelpers}

<f:if condition="{poi:context.targetNode(article: article)}">
    <f:then>
        <neos:link.node node="{poi:context.targetNode(article: article)}"
                        arguments="{
                            --newland_toubiz_poi_neos-list: {
                                '@package': 'newland.toubiz.poi.neos',
                                '@controller': 'pointofinterests',
                                '@action': 'show',
                                article: article
                            }
                        }"
                        class="tb-teaser">

            <f:render section="content" arguments="{_all}" />
        </neos:link.node>
    </f:then>

    <f:else>
        <a href="#0" class="tb-teaser">
            <f:render section="content" arguments="{_all}" />
        </a>
    </f:else>
</f:if>

<f:section name="content">
    <f:if condition="{article.media.0}">
        <f:then>
            <div class="tb-teaser__image-wrapper">
                <img src="{article.media.0.sourceUri}"
                     alt="{article.media.0.title}"
                     class="tb-teaser__image" />
            </div>
        </f:then>
        <f:else>
            <div class="tb-teaser__image-wrapper">
                <div class="tb-teaser__image-fallback">
                    <svg class="c-icon">
                        <use xlink:href="#icon-image"></use>
                    </svg>
                </div>
            </div>
        </f:else>
    </f:if>

    <div class="tb-teaser__text">
        <p class="tb-teaser__topline">
            <strong>{article.categories.0.title}</strong>

            <f:if condition="{article.city} !== ''">
                • {article.city}
            </f:if>
        </p>

        <h3 class="tb-teaser__title">
            {article.name}
        </h3>

        <f:if condition="{article.attributes.gastronomyStyle}">
            <ul class="tb-teaser__characteristics">
                <f:for each="{vh:collection.slice(collection: article.attributes.gastronomyStyle, offset: 0, length: 2)}"
                       as="item">

                    <li class="tb-teaser__characteristics-item">{item}</li>
                </f:for>
            </ul>
        </f:if>
    </div>
</f:section>