{% extends 'default' %}

{% block breadcrumb %}
    <div class="breadcrumb border-b border-grey-lighter mb-6 -mt-6 bg-grey-lightest">
        <div class="container mx-auto px-4">
            <ul class="flex pl-0 mb-0">
                <li class="list-reset flex items-center">
                    <a class="inline py-2" href="{{ site.url }}/">Home</a>
                    {% include "svg/chevron-right" with { class: 'text-grey-light mx-1', style: "height: 20px" } %}
                </li>
                <li class="list-reset flex items-center">
                    <a class="inline py-2" href="{{ site.url }}/blog">Blog</a>
                     {% include "svg/chevron-right" with { class: 'text-grey-light mx-1', style: "height: 20px" } %}
                </li>
                <li class="list-reset flex truncate">
                    <span class="inline py-2 truncate">{{ page.title }}</span>
                </li>
            </ul>
        </div>
    </div>
{% endblock %}

{% block content_wrapper %}
    {% include 'post/header' %}
    {% include 'post/intro-image' %}

    <div class="content mb-6">
        {% set limit = 'now'|date_modify('-12 months')|date('U') %}
        {% if page.date|date('U') < limit %}
            <div class="border-2 border-blue p-4 mb-4">
                <p class="mb-0">
                    <span class="font-bold">Warning:</span> This post is over a year old. I don't always update old posts with new information, so some of this information may be out of date.
                </p>
            </div>
        {% endif %}

        {% block excerpt %}{% endblock %}
        {% block content %}{% endblock %}
    </div>

    {% include 'post/twitter-link' %}
    {% include 'post/tags' %}
    {% include 'post/pager' %}
    {% include 'post/about-author' %}
{% endblock %}

{% block scripts %}
    <script>hljs.initHighlightingOnLoad();</script>
{% endblock %}