---
layout: default
route: blog
---

{% include blog-hero.html %}

  <section class="section">
    <div class="container">
      {% for post in site.posts %}
        <article class="box article">
          <div class="columns">
            <div class="column is-narrow">
              <a class="article-image is-{{ post.color }}" href="{{ post.url }}">
                <span class="article-overlay"></span>
                <span class="article-icon">
                  <span class="icon">
                    <i class="fa fa-{{ post.icon }}"></i>
                  </span>
                </span>
                <strong class="article-title">
                  {{ post.name }}
                </strong>
              </a>
            </div>
            <div class="column">
              <div class="columns">
                <div class="column">
                  <p class="subtitle">
                    {{ post.date | date_to_string }}
                  </p>
                  <h2 class="title">
                    <a href="{{ post.url }}">
                      {{ post.title }}
                    </a>
                  </h2>
                </div>
                <div class="column">
                  <div class="content is-medium">
                    {{ post.introduction | markdownify }}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </article>
      {% endfor %}
    </div>
  </section>