<{*
	<{assign var="blog_posts" value=$webshop->getBlogPosts(100, $get.offset)}>
*}>

<{section name="i" loop=$blog_posts}>
	<{assign var="blog_post" value=$blog_posts[i]}>
	<{assign var="images" value=$blog_post->getImages()}>

	<article class="post">

		<figure class="post-img">
			<{if $images}>
				<{section name="j" loop=$images max=1}>
					<a href="<{$blog_post->getRemoteUrl()|escape}>">
						<img src="<{$images[j]->getSrc(1200, 300, 'box')}>" alt="" <{$images[j]->getHtmlSize(1200, 300, 'box')}>/>
						<div class="hover-icon"></div>
					</a>
				<{/section}>
			<{else}>
				<a href="images/blog-01-big.jpg" class="mfp-image" title="First Image Title">
					<img src="images/blog-01.jpg" alt=""/>
					<div class="hover-icon"></div>
				</a>
			<{/if}>
		</figure>

		<section class="date">
			<span class="day"><{$blog_post->getCreated()|date_format:"%d"}></span>
			<span class="month"><{$blog_post->getCreated()|date_format:"%b"}></span>
		</section>

		<section class="post-content">

			<header class="meta">
				<h2><a href="<{$blog_post->getRemoteUrl()|escape}>"><{$blog_post->getTitle()|escape}></a></h2>
				<span><i class="fa fa-user"></i>Af <{$blog_post->getUserName()|escape}></span>
				<span><i class="fa fa-calendar"></i><{$blog_post->getCreated()|date_format:"%d-%m-%Y"}></span>
			</header>

			<{$blog_post->getBody()|strip_tags|truncate:500}>

			<div class="clear-fix"></div>

			<a href="<{$blog_post->getRemoteUrl()|escape}>" class="button color">Læs mere</a>

		</section>

	</article>

<{/section}>