{% extends 'layout.html' %}
{% load bookwyrm_tags %}
{% block content %}

<div class="block">
    <h1 class="title has-text-centered">{{ site.name }}: Social Reading and Reviewing</h1>
</div>

<section class="tile is-ancestor">
    <div class="tile is-7 is-parent">
        <div class="tile is-child block">
            {% include 'snippets/about.html' %}
        </div>
    </div>
    <div class="tile is-5 is-parent">
        <div class="tile is-child box has-background-primary-light">
            {% if site.allow_registration %}
            <h2 class="title">Join {{ site.name }}</h2>
            <form name="register" method="post" action="/user-register">
                {% include 'snippets/register_form.html' %}
            </form>
            {% else %}
            <h2 class="title">This instance is closed</h2>
            <p>Contact an administrator to get an invite</p>
            {% endif %}
        </div>
    </div>
</section>

<section class="tile is-ancestor">
    <div class="tile is-vertical">
        <div class="tile is-parent">
            <div class="tile is-child box has-background-white-ter">
                <div class="columns">
                    <div class="column is-narrow">
                        {% include 'snippets/book_cover.html' with book=books.2 size="large" %}
                        {% include 'snippets/stars.html' with rating=books.2.review__rating__avg %}
                    </div>
                    <div class="column">
                        {% include 'snippets/book_titleby.html' with book=books.2 %}
                        <blockquote class="content">{{ books.2|book_description|to_markdown|safe|truncatewords_html:50 }}</blockquote>
                    </div>
                </div>
            </div>
        </div>
        <div class="tile">
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'snippets/book_cover.html' with book=books.0 %}
                    {% include 'snippets/book_titleby.html' with book=books.0 %}
                    {% include 'snippets/stars.html' with rating=books.0.review__rating__avg %}
                </div>
            </div>
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'snippets/book_cover.html' with book=books.1 %}
                    {% include 'snippets/book_titleby.html' with book=books.1 %}
                    {% include 'snippets/stars.html' with rating=books.1.review__rating__avg %}
                </div>
            </div>
        </div>
    </div>
    <div class="tile is-vertical">
        <div class="tile">
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'snippets/book_cover.html' with book=books.4 %}
                    {% include 'snippets/book_titleby.html' with book=books.4 %}
                    {% include 'snippets/stars.html' with rating=books.4.review__rating__avg %}
                </div>
            </div>
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'snippets/book_cover.html' with book=books.5 %}
                    {% include 'snippets/book_titleby.html' with book=books.5 %}
                    {% include 'snippets/stars.html' with rating=books.5.review__rating__avg %}
                </div>
            </div>
        </div>
        <div class="tile is-parent">
            <div class="tile is-child box has-background-white-ter">
                <div class="columns">
                    <div class="column is-narrow">
                        {% include 'snippets/book_cover.html' with book=books.3 size="large" %}
                        {% include 'snippets/stars.html' with rating=books.3.review__rating__avg %}
                    </div>
                    <div class="column">
                        {% include 'snippets/book_titleby.html' with book=books.3 %}
                        <blockquote class="content">{{ books.3|book_description|to_markdown|safe|truncatewords_html:50 }}</blockquote>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

{% endblock %}