{%  extends "base.html" %}

{% load wagtailcore_tags %}

{% block body_class %}helvetica{% endblock %}

{% block content %}

<section class="mw7 center">
  <h1 class="ph3 ph0-l">{{ page.title }}</h1>

  {% for post in blogpages %}
    {% with post=post.specific %}
      <article class="pv4 bt bb b--black-10 ph3 ph0-l">
        <a class="db pv4 ph3 ph0-l no-underline black dim" href="{% pageurl post %}" >
          <div class="flex flex-column flex-row-ns">
            <div class="w-100 w-60-ns pr3-ns order-2 order-1-ns">
              <h1 class="f3 mt0 lh-title">{{ post.title }}</h1>
              <p class="f5 f4-l lh-copy">{{ post.intro }}</p>
            </div>
            <div class="pl3-ns order-1 order-2-ns mb4 mb0-ns w-100 w-40-ns">
              <img src="http://mrmrs.github.io/photos/cpu.jpg" class="db"
                   alt="Photo of a dimly lit room with a computer interface terminal.">
            </div>
          </div>
          <p class="f6 lh-copy gray mv0">By <span class="ttu">{{ post.owner }}</span></p>
          <time class="f6 db gray">{{ post.date|date }}</time>
        </a>
      </article>
    {% endwith %}
  {% endfor %}

</section>


{% endblock %}