{% extends "templates/base.html" %}

{% block contained-main-content %}
<div class="row">
  <div class="col-sm-8 blog-main">

    <h1>{{ page-data.site-title }}</h1>
    <p class="lead">{{ page-data.site-description }}</p>

    <div class="row">
      <div class="col-sm-12">

        <div class="headliner well">

          <h2>
            <a href="{{ headliner.url }}">{{ headliner.title }}</a>
          </h2>
          {% if headliner.subtitle %}
            <h4>{{ headliner.subtitle }}</h4>
          {% endif %}
          {% if headliner.excerpt %}
            <h3>{{ headliner.excerpt|safe }}</h3>
          {% endif %}
          <div class="row">
            <div class="col-sm-4">
              <p>Date: {{ headliner.datestamp }}</p>
            </div>
            <div class="col-sm-4">
              <p>Author: {{ headliner.author }}</p>
            </div>
            <div class="col-sm-4">
              <p>Category: {{ headliner.category }}</p>
            </div>
          </div>

        </div>

      </div>
    </div>

    {% for row in posts-data %}
    <div class="row row-full-height subheadliner">
      {% for column in row %}
      <div class="col-sm-6 well subheadliner">

          <h2>
            <a href="{{ column.url }}">{{ column.title }}</a>
          </h2>
          {% if column.subtitle %}
            <h4>{{ column.subtitle }}</h4>
          {% endif %}
          {% if column.excerpt %}
            <h3>{{ column.excerpt|safe }}</h3>
          {% endif %}
          <p>Date: {{ column.datestamp }}</p>
          <p>Author: {{ column.author }}</p>
          <p>Category: {{ column.category }}</p>

      </div>
      {% endfor %}
    </div>
    {% endfor %}

    <div class="clearfix">
      <a href="/blog/archives/" class="btn btn-tales-one">Read more</a>
    </div>

  </div>

  <aside class="col-md-4 blog-aside">

    <div class="aside-widget">
      <header>
        <h3>Featured Excursionists</h3>
      </header>
      <div class="body">
        <ul class="tales-list">
          <li><a href="/blog/archives/2017-06/16-170908/the-lower-48-challenge.html">The Lower-48 Challenge</a></li>
          <li><a href="/blog/archives/2016-07/31-114941/knucklehead-at-sturgis.html">Knucklehead at Sturgis</a></li>
        </ul>
      </div>
    </div>

    <div class="aside-widget tags-widget">
      <header>
        <h3>Tags</h3>
      </header>
      <div class="body">
        <ul>
          {% for tag in tags %}
          <li>
            <a href="{{ page-data.base-path }}/tags/#{{tag}}">{{ tag }}</a>
          </li>
          {% endfor %}
        </ul>
      </div>
    </div>

    <div class="aside-widget">
      <header>
        <h3>FRMX on Twitter</h3>
      </header>
      <p>
        <a class="twitter-timeline" data-lang="en" data-width="350" data-height="600" data-link-color="#c68533" href="https://twitter.com/ForgottenRdsMX">FRMX on Twitter</a> <script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
      </p>
    </div>

</div>
{% endblock %}