index.html

---
layout: default
title: Index
---

<div class="posts">
  {% for post in paginator.posts %}
    {% if post.pinned %}
      <div class="lead alert">
        <i class="fas fa-thumbtack"></i> &nbsp; Pinned Post 
      </div>
      <div class="post">
        <h1 class="post-title">
          <a href="{{ site.baseurl }}{{ post.url }}">
            {{ post.title }}
          </a>
        </h1>
        <div class="hr"></div>
        <span class="post-date">{{ post.date | date_to_long_string }}</span>
          {{ post.content }}
      </div>
      <hr>
    {% endif %}
  {% endfor %}

  {% for post in paginator.posts %}
    {% unless post.pinned %}
      {% if post == site.posts.first %}
        <div class="lead alert">
          <i class="fas fa-exclamation-circle"></i> &nbsp; Newest Post
        </div>
      {% endif %}
      <div class="post">
        <h1 class="post-title">
          <a href="{{ site.baseurl }}{{ post.url }}">
            {{ post.title }}
          </a>
        </h1>
        <div class="hr"></div>
        <span class="post-date">{{ post.date | date_to_long_string }}</span>
          {{ post.content }}
      </div>
      {% if post != paginator.posts.last %}
        <hr>
      {% endif %}
    {% endunless %}
  {% endfor %}
</div>
  
<div class="pagination">
  {% if paginator.next_page %}
    <a class="pagination-item older" href="{{ site.baseurl }}/page{{paginator.next_page}}"><i class="fas fa-arrow-left"></i> &nbsp; Older</a>
  {% else %}
    <span class="pagination-item older">Older</span>
  {% endif %}
  {% if paginator.previous_page %}
    {% if paginator.page == 2 %}
      <a class="pagination-item newer" href="{{ site.baseurl }}/">Newer &nbsp; <i class="fas fa-arrow-right"></i></a>
    {% else %}
      <a class="pagination-item newer" href="{{ site.baseurl }}/page{{paginator.previous_page}}">Newer &nbsp; <i class="fas fa-arrow-right"></i></a>
    {% endif %}
  {% else %}
    <span class="pagination-item newer">Newer</span>
  {% endif %}
</div>

<div class="only-mobile alert">
  <a href="#" class="underline">Back to Top &nbsp; <i class="fa fa-arrow-circle-up"></i></a>
</div>