{namespace n=GeorgRinger\Blog\ViewHelpers}<!--
	=====================
		Partials/List/Item.html
-->

<div class="media margin-clear">
        <div class="media-body">
                <h6 class="media-heading">
                    <n:link blogItem="{blogItem}" settings="{settings}" title="{blogItem.title}" >
                        {blogItem.title}
                    </n:link>
                </h6>
                <p class="small margin-clear"><i class="fa fa-calendar pr-10"></i>
                    <time datetime="{f:format.date(date:blogItem.datetime, format:'M j, Y')}">
                            <f:format.date format="M j, Y">{blogItem.datetime}</f:format.date>
                            <meta itemprop="datePublished" content="{f:format.date(date:blogItem.datetime, format:'M j, Y')}" />
                    </time>
                </p>
                <div class="overlay-container">
                        <f:if condition="{blogItem.falMediaPreviews}">
                                <f:then>
                                        <n:link blogItem="{blogItem}" settings="{settings}" title="{blogItem.title}">
                                                <f:alias map="{mediaElement: blogItem.falMediaPreviews.0}">
                                                        <f:if condition="{mediaElement.originalResource.type} == 2">
                                                                <f:image image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" maxWidth="555" maxHeight="555"/>
                                                        </f:if>
                                                        <f:if condition="{mediaElement.originalResource.type} == 4">
                                                                <f:render partial="Detail/FalMediaVideo" arguments="{mediaElement: mediaElement}"/>
                                                        </f:if>
                                                        <f:if condition="{mediaElement.originalResource.type} == 5">
                                                                <f:image image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" maxWidth="555" maxHeight="555"/>
                                                        </f:if>
                                                </f:alias>
                                        </n:link>
                                </f:then>
                                <f:else>
                                    <f:if condition="{blogItem.teaser}">
                                            <f:then>
                                                    <p class="margin-clear text-left pv-20">{blogItem.teaser -> f:format.crop(maxCharacters: '200', respectWordBoundaries:'1') -> f:format.stripTags()}</p>
                                            </f:then>
                                            <f:else>
                                                    <p class="margin-clear text-left">{blogItem.bodytext -> f:format.crop(maxCharacters: '200', respectWordBoundaries:'1') -> f:format.stripTags()}</p>
                                            </f:else>
                                    </f:if>
                                </f:else>
                        </f:if>

                        <n:link blogItem="{blogItem}" settings="{settings}" title="{blogItem.title}" class="overlay-link small">
                            <i class="fa fa-link"></i>
                        </n:link>
                </div>
        </div>
        <hr>
</div>