{% extends "base.html" %}
{% block head %}
  {{ super() }}
  {% for keyword in article.keywords %}
    <meta name="keywords" contents="{{keyword}}" />
  {% endfor %}

  {% for description in article.description %}
    <meta name="description" contents="{{description}}" />
  {% endfor %}

  {% for tag in article.tags %}
    <meta name="tags" contents="{{tag}}" />
  {% endfor %}
{% endblock %}

{% block extrahead %}
<style>

h1 {
    font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
    padding: 80px 50px;
    text-align: center;
    text-transform: uppercase;
    text-rendering: optimizeLegibility;
    color: #202020;
    letter-spacing: .1em;
    text-shadow:
        -1px -1px 1px #111,
        2px 2px 1px #eaeaea;
}

#main {
    text-align: justify;
    text-justify: inter-word;
}
#main h1 {
    padding: 10px;
}

.post-headline {
    padding: 15px;
    text-align: center;
}
</style>
{% if article.image %}
<style>
#illustration {
    max-width: 800px;
    align: center;
    margin: auto;
}
</style>
{% endif %}
{% endblock %}

{% block title %}{{ article.title }} - {{ SITENAME }}{% endblock %}

{% block content %}
<div id="main" class="posts">
<h1 class="post-title">{% if article.category == "Lectures" %}{{ article.title }} par {{ article.author }}{% else %}{{ article.title }}{% endif %}</h1>

<span class="post-date">
    {% if article.category == "Lectures" %}
    <span class="post-date">Lu en {{ article.read_on }}. Thèmes : {% if article.tags %}{% for tag in article.tags %}<a href="{{ SITEURL }}/{{ tag.url }}">{{ tag | escape }}</a> {% endfor %}{% endif %}. {% if article.link %}<a href="{{ article.link }}">Accéder en ligne.</a>{% endif %}</span>
    {% else %}
    {{ article.locale_date | capitalize }}, dans <a class="no-color" href="{{ article.category.url }}">{{ article.category }}</a>
    {% endif %}
</span>
<img id="illustration" class="illustration-{{ article.category }}" src="{{ article.image }}" />

<div class="post article">
    {% if article.headline %}
    <h2 class="post-headline">{{ article.headline }}</h2>
    {% endif %}
    {% if not article.hide_toc and article.table_of_contents %}
    <div id="toc_container">
      {{ article.table_of_contents }}
      </div>
    {% endif %}
    {% if article.category == "Notes" %}
    <em>Voici quelques notes prises autour d'un sujet donné. Je ne suis souvent pas l'auteur des contenus, et les notes peuvent parfois faire un peu « fouillis ». Faites avec ;-)</em>
    {% endif %}
    <h1>🌟</h1>
    {{ article.content }}
    {% if article.image and article.image_link and article.image_author and article.image_license %}
    <em>L'image d'illustration utilisée est un travail de <a href="{{ article.image_link }}">{{ article.image_author}}</a> proposé sous license {{ article.image_license }}. Merci !</em>
    {% endif %}
  </div>
</div>
{% endblock %}
