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

<article class="blogpost articletype-{newsItem.type}{f:if(condition: newsItem.istopnews, then: ' topnews')}">
        <n:excludeDisplayedNews newsItem="{newsItem}"/>
        
        <div class="row grid-space-10">
            <f:if condition="{newsItem.falMediaPreviews}">
                <div class="col-md-4">
                        <div class="overlay-container">
                            
                                    <f:alias map="{mediaElement: newsItem.falMediaPreviews.0}">
                                            <f:if condition="{mediaElement.originalResource.type} == 2">
                                                    <f:image class="media-object" image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" width="340c" height="200c"/>
                                            </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 class="media-object" image="{mediaElement}" title="{mediaElement.originalResource.title}" alt="{mediaElement.originalResource.alternative}" width="340c" height="200c"/>
                                            </f:if>
                                            <n:link newsItem="{newsItem}" settings="{settings}" title="{newsItem.title}" class="overlay-link">
                                                <i class="fa fa-link"></i>
                                            </n:link>
                                    </f:alias> 
                                
                        </div>
                </div>
            </f:if>
       
                <div class="{f:if(condition: newsItem.falMediaPreviews, then: 'col-md-8', else: 'col-md-12')}">
                        <header>
                            <h3 class="no-last-word">
                                <n:link newsItem="{newsItem}" settings="{settings}" title="{newsItem.title}">
                                    {newsItem.title}
                                </n:link>
                            </h3>

                            <div class="post-info">
                                <span class="post-date">
                                        <i class="icon-calendar"></i>
                                        <span class="date"><f:format.date format="d, F Y">{newsItem.datetime}</f:format.date></span>
                                </span>
                                <span class="submitted"><i class="icon-user-1"></i>
                                    Created by <f:if condition="{newsItem.author}"> <f:then>{newsItem.author}</f:then><f:else>GESCI</f:else></f:if>
                                </span>
                                
                                <span class="categories"><i class="icon-tags"></i>{newsItem.firstCategory.title}</span>
                            </div>
                        </header>
                        <div class="blogpost-content">
                            <f:if condition="{newsItem.teaser}">
                                    <f:then>
                                            <p>{newsItem.teaser -> f:format.crop(maxCharacters: '300', respectWordBoundaries:'1') -> f:format.stripTags()}</p>
                                    </f:then>
                                    <f:else>
                                            <p>{newsItem.bodytext -> f:format.crop(maxCharacters: '300', respectWordBoundaries:'1') -> f:format.stripTags()}</p>
                                    </f:else>
                            </f:if>
                        </div>
                </div>
        </div>
        <footer class="clearfix">
                <div class="tags pull-left"><i class="icon-tags"></i>
                    <f:for each="{newsItem.tags}" as="tag">
                        {tag.title}, 
                    </f:for>
                </div>
            <div class="link pull-right"><i class="icon-link"></i><n:link newsItem="{newsItem}" settings="{settings}" class="more" title="{newsItem.title}">
                <f:translate key='LLL:fileadmin/templates/gesci/Theme/Lang/locallang.xlf:Read_More' />
                </n:link> </div>
        </footer>
</article>