books.html

---
layout: default
---

{{ content }}

{% assign books=site.books %}

<h2>{{page.list_title | default: "Books" }}</h2>

{% if books.size > 0 %}

  {% for book in books reversed %}
      {% assign currentdate = book.date | date: "%Y" %}
      {% if currentdate != date %}
      {% unless forloop.first %}</ul>{% endunless %}
       <h1 id="y{{book.date | date: "%Y"}}">{{ currentdate }}</h1>

     <ul>
     {% assign date = currentdate %}
     {% endif %}

        <figure class="book-cover">

        <a href="{{ book.url | relative_url }}">

        {% if book.cover %}

        <img alt="{{ book.title }} cover" src="{{ site.baseurl }}/images/covers/{{ book.cover }}" style="height:200px" />

        {% elsif book.olid %}

        <img alt="{{ book.title }} cover" src="http://covers.openlibrary.org/b/olid/{{ book.olid }}-L.jpg?default=false" style="height:200px" />

        {% elsif book.isbn %}

        <img alt="{{ book.title }} cover" src="http://covers.openlibrary.org/b/isbn/{{ book.isbn }}-L.jpg?default=false" style="height:200px" />

        {% endif %}

        {% if book.status %}
          {% assign status = book.status | upcase | strip %}

          {% if status  == "READING" %}

            <figcaption class="reading">{{ status }}</figcaption>

          {% elsif status  == "FINISHED" %}

             <figcaption class = "finished">{{ status }}</figcaption>

          {% elsif status  == "QUEUED" %}

             <figcaption class = "queued">{{ status }}</figcaption>

          {% elsif status  == "ABANDONED" %}

            <figcaption class="abandoned">{{ status }}</figcaption>

            {% elsif status  == "INTERESTED" %}

              <figcaption class="interested">{{ status }}</figcaption>


            {% else %}

            <figcaption class="uncategorized"> UNCATEGORIZED </figcaption>


        {% endif %}
            {% else %}

            <figcaption class="uncategorized"> UNCATEGORIZED </figcaption>

      {% endif %}
        </a>
        </figure>


  {% if forloop.last %}</ul>{% endif %}
{% endfor %}


{% endif %}

<style>
  figure {
    display: inline-block;
    text-align: center;
    margin: 8px; /* adjust as needed */

  }

  figure img {
    vertical-align: bottom;

  }

  .reading{
    font-family: monospace;
    color: #23212D;
    text-transform: uppercase;
    background-color: #f89406;

  }

  .finished{
    font-family: monospace;
    color: #23212D;
    text-transform: uppercase;
    background-color: #62c462;

  }


  .queued{
    font-family: monospace;
    color: #23212D;
    text-transform: uppercase;
    background-color: #9e76b5;

  }

  .abandoned{
    font-family: monospace;
    color: #23212D;
    text-transform: uppercase;
    background-color: #ee5f5b;

  }

  .interested{
    font-family: monospace;
    color: #23212D;
    text-transform: uppercase;
    background-color: #7691db;

  }

  .uncategorized{
    font-family: monospace;
    color: #23212D;
    text-transform: uppercase;
    background-color: #b0abb3;

  }

  /* mouse over link */
a:hover {
  color: #23212D;
}

  }
</style>