{% extends "base.html" %}
{% load wagtailcore_tags navigation_tags wagtailimages_tags %}

{% block content %}
    {% include "base/include/header-index.html" %}

    <div class="container">
    {% if tag %}
        <div class="row">
            <div class="col-md-12">
                <ul class="tags index">
                        <li>{{ tag }}</li>
                </ul>
            </div>
        </div>
    {% endif %}

        <div class="row row-eq-height blog-list">
            {% for blog in blogs %}
                <li class="col-md-3 blog-list-item">
                <a href="{% pageurl blog %}">
                    <div class="image">
                        {% image blog.image fill-850x550-c50 as image %}
                        <img src="{{ image.url }}" width="{{ image.width }}" height="{{ image.height }}" alt="{{ image.alt }}" class="" />
                    </div>
                    <div class="text">
                        <h2 class="blog-list-title">{{ blog.title }}</h2>
                        <p>{{ blog.introduction|truncatewords:15 }}</p>
                    </div>

                    <div class="small footer">
                        {{ blog.date_published }} by
                        {% for author in blog.authors %}
                            {{ author }}{% if not forloop.last %}, {% endif %}
                        {% endfor %}
                    </div>
                    
                    </a>
                </li>
            {% endfor %}
        </div>
    </div>
{% endblock content %}