{% macro bookshelf(books) %}
  <div class="bookshelf" onclick="goto('books')">
    <div class="flex">
      <h4 class="bookshelfHeader">Check out the things I read:</h4>
      <p class='nomargin'>See More >></p>
    </div>
    <div class="bookContainer">
      {% for i in books.selection[:4] %} {% set book = books.books[i] %}
      <a href="/books#'{{i}}'">
        <div class="book">
          <img
            alt="{{ i }} cover"
            src="{{ url_for('static', filename=('photos/books/' + book.filename))}}"
          />
          <h4>{{ i }}</h4>
        </div>
      </a>
      {% endfor %}
    </div>
  </div>
{% endmacro %}
