<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">
<f:layout name="Default" />
<f:section name="content">
    <div class="row">
        <f:for each="{dates}" as="date">
            <div class="col-sm-12 col-md-6 col-lg-4 col-xl-4">
                <f:comment>
                    <!--
                    <f:link.action action="show" arguments="{date : date}"></f:link.action>
                    -->
                </f:comment>
                <div class="menu-tile">
                    <f:if condition="{date.event.images}">
                        <f:then>
                            <f:link.action pageUid="{settings.showPID}" action="show" controller="Event" arguments="{event: event}">
                                <f:image src="{date.event.images.originalResource.originalFile.uid}" alt="" width="480c" height="320c" class="img-fluid img-thumbnail"/>
                            </f:link.action>
                        </f:then>
                        <f:else>
                            <img src="https://dummyimage.com/480x320/ddd/ccc" alt="Dummy" width="480" height="320" class="img-fluid img-thumbnail"/>
                        </f:else>
                    </f:if>
                </div>
                <div class="caption">
                    <div class="caption-text mt-3">
                        {date.event.region.title} | <f:format.date format="d. m. Y - H:i">{date.start}</f:format.date>
                        <h4>{date.event.title}</h4>
                        <p>{date.event.teaser}</p>
                        <f:if condition="{date.event.highlight}">
                            <f:then>
                                <b>Hightlight</b>
                            </f:then>
                        </f:if>
                    </div>
                </div>
            </div>
        </f:for>
    </div>
</f:section>
</html>