{% extends 'landing/landing_layout.html' %}
{% load i18n %}
{% block panel %}

<div class="block is-hidden-tablet">
    <h2 class="title has-text-centered">{% trans "Recent Books" %}</h2>
</div>

<section class="tile is-ancestor">
    <div class="tile is-vertical is-6">
        <div class="tile is-parent">
            <div class="tile is-child box has-background-white-ter">
                {% include 'landing/large-book.html' with book=books.has_description.0 %}
            </div>
        </div>
        <div class="tile">
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'landing/small-book.html' with book=books.no_description.0 %}
                </div>
            </div>
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'landing/small-book.html' with book=books.no_description.1 %}
                </div>
            </div>
        </div>
    </div>
    <div class="tile is-vertical is-6">
        <div class="tile">
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'landing/small-book.html' with book=books.no_description.2 %}
                </div>
            </div>
            <div class="tile is-parent is-6">
                <div class="tile is-child box has-background-white-ter">
                    {% include 'landing/small-book.html' with book=books.no_description.3 %}
                </div>
            </div>
        </div>
        <div class="tile is-parent">
            <div class="tile is-child box has-background-white-ter">
                {% include 'landing/large-book.html' with book=books.has_description.1 %}
            </div>
        </div>
    </div>
</section>

{% endblock %}