blog.html

---
layout: centered
title: Blog
permalink: /blog/
theme: red-orange
navitem: nav-blog
redirect_to: https://blog.liri.io/
---

<style>
  .liri-card-wide.mdl-card {
    width: 512px;
    margin-bottom: 16px;
  }

  .liri-card-wide > .mdl-card__title {
    color: #fff;
    height: 176px;
  }

  .liri-card-wide > .mdl-card__menu {
    color: #fff;
  }

  .right {
    text-align: right;
  }
</style>

{% for post in site.posts %}
  {% assign author = site.data.authors[post.author] %}
  <div class=" mdl-card mdl-shadow--2dp mdl-cell mdl-cell--6-col mdl-cell--1-offset-tablet">
    <div class="mdl-card__title no-padding-bottom">
      <h2 class="mdl-card__title-text">{{ post.title }}</h2>
    </div>
    <div class="mdl-card__supporting-text mdl-card--expand no-padding-top no-padding-bottom primary-text">
      <p class="secondary-text">{{ post.date | date_to_string }} • {{ author.name }}</p>
      <p>{{ post.excerpt }}</p>
    </div>
    <div class="mdl-card__actions mdl-card--border">
      <a class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect" href="{{ site.baseurl }}{{ post.url }}">Read More</a>
      <!--<span class="right">-->
        <!--<span>{{ post.date | date_to_string }} • {{ author.name }}</span>-->
      <!--</span>-->
    </div>
    <div class="mdl-card__menu">
      <button class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
        <i class="material-icons">share</i>
      </button>
    </div>
  </div>
{% endfor %}