category.html

---
layout: landing
title: Categories
description: Recent posts listed by category.
---

<div class="ui inverted purple vertical segment">
  <div class="ui very relaxed stackable page grid">
    <div class="row">
      <div class="column">
          {% include site-categories.html %}
      </div>
    </div> <!-- /row -->
  </div>
</div>

{% for category in site.categories %}
  {% capture inverted %}{{ forloop.index | modulo:2 }}{% endcapture %}
  <div class="ui {% if inverted == '0' %}inverted purple {% endif %}vertical segment">
    <div class="ui very relaxed stackable page grid">
      <div class="row">
        <div class="column">
          <a id="{{ category.first }}"></a>
          <h1 class="left aligned ui {% if inverted == '0' %}inverted {% endif %}header">
          {{ category.first | capitalize }}
          </h1>
        </div>
      </div>

      <div class="row">
        <div class="column">
          <div class="ui {% if inverted == '0' %}inverted {% endif %}animated selection list">
          {% for post in site.categories[category.first] %}
            <a class="item" href="{{ post.url }}">
              <div class="recent-posts-title">{{ post.title }}</div>
              {% if post.image %}
              <div class="thumb-img">
                <img class="ui rounded image" src="{{ post.image }}" alt="{{ post.title }}">
              </div>
              {% else %}
              <small> {{post.excerpt}} </small>
              {% endif %}
              <div class="right floated"><small>{{ post.date | date: "%b %-d, %Y" }}</small></div>
            </a>
          {% endfor %}
          </div>
        </div>
      </div>
    </div>
  </div>
{% endfor %}