{% extends "base.html" %}

{% block head %}
{{ super() }}
{% if article.description %}
<meta name="description" content="{{article.description}}" />
{% endif %}

{% if article.tags or article.category or article.keywords %}
<meta name="keywords" content="{{ [article.tags|join(', '), article.category, article.keywords]|join(', ') }}" />
{% endif %}
{% endblock %}

{% block content %}
<header id="banner">
    {% for p in pages %}
        {% if p.title == 'header' %}
            <div id="title">{{ p.content }}</div>
        {% endif %}
    {% endfor %}
</header>

<section id="content" class="body h-entry">
	<div class="entry-title p-name">
		{{ article.title }}
	</div>
	<div class="article-info">
		<div class="featured-image u-photo">
            {% if article.featured_image %}
            {% set thumb_size ='/thumb'%}
            <a href="{{ article.featured_image }}">
            {% if article.featured_image.endswith('.gif') %}
                {% set thumb_size =''%}
            {% endif %}
            <img src="{{ article.featured_image | replace('images','images'+thumb_size) }}">
            </a>
            {% endif %}
		</div>
		<div class="event-details">
			{% if article.event_start %}
			<div>{{ article.event_start }}</div>
			{% endif %}
		</div>
		<div class="post-info">
			<a rel="author" class="p-author h-card" href="{{article.url}}">{{article.author}}</a>
			<time class="dt-published">{{article.date| strftime('%d %B %Y')}}</time>
			{% if article.category %}
			<div class="categories">
				<span itemprop="articleSection">
					<a href="{{ article.category.url }}" rel="category">{{ article.category }}</a>
				</span>
			</div>
			{% endif %}
			{% if article.translations %}
				<div class="article-translation">
				{% for translation in article.translations %}
					{% if translation.lang == 'nl' %}<a href="{{ translation.url }}">Lees dit artikel in het Nederlands</a>
					{% endif %}
					{% if translation.lang == 'en' %}<a href="{{ translation.url }}">Read this article in English</a>
					{% endif %}
				{% endfor %}
				</div>
			{% endif %}
		</div>
	</div>
<div class="entry-content-container">
	<div class="entry-content e-content">
		{{ article.content }}
	<div class="separator"><hr></div>
	</div><!-- /.entry-content -->
</div><!-- /.entry-content-container -->
</section>
{% endblock %}