moviewyrm/bookwyrm/templates/annual_summary/layout.html
2021-12-21 14:44:21 +01:00

184 lines
7.2 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% extends 'layout.html' %}
{% load i18n %}
{% load static %}
{% block title %}{% blocktrans %}{{ year }} in the books{% endblocktrans %}{% endblock %}
{% block head_links %}
<link rel="stylesheet" href="{% static "css/vendor/dm_serif_display.css" %}">
{% endblock %}
{% block content %}
<div class="columns">
{% with year=paginated_years|first %}
<div class="column">
<a href="{% url 'annual-summary' year %}">
<span class="icon icon-arrow-left" aria-hidden="true"></span>
{% blocktrans %}{{ year }} in the books{% endblocktrans %}
</a>
</div>
{% endwith %}
{% with year=paginated_years|last %}
{% if year %}
<div class="column has-text-right">
<a href="{% url 'annual-summary' year %}">
{% blocktrans %}{{ year }} in the books{% endblocktrans %}
<span class="icon icon-arrow-right" aria-hidden="true"></span>
</a>
</div>
{% endif %}
{% endwith %}
</div>
<h1 class="title is-1 is-serif has-text-centered mb-5">
📚✨
{% blocktrans %}{{ year }} <em>in the books</em>{% endblocktrans %}
✨📚
</h1>
{% if not books %}
<p class="has-text-centered is-size-5">{% blocktrans %}Sadly you didn't finish any book in {{ year }}{% endblocktrans %}</p>
{% else %}
<div class="columns is-mobile">
<div class="column is-8 is-offset-2 has-text-centered">
<h2 class="title is-3 is-serif">
{% blocktrans %}In {{ year }}, you read {{ books_total }} books<br />for a total of {{ pages_total }} pages!{% endblocktrans %}
</h2>
<p class="subtitle is-5">{% trans "Thats great!" %}</p>
<p class="title is-4 is-serif">
{% blocktrans %}That makes an average of {{ pages_average }} pages per book.{% endblocktrans %}
</p>
{% if no_page_number %}
<p class="subtitle is-6">{% blocktrans %}({{ no_page_number }} books dont have pages){% endblocktrans %}</p>
{% endif %}
</div>
</div>
{% if book_pages_lowest and book_pages_highest %}
<div class="columns is-mobile is-align-items-center mt-5">
<div class="column is-2 is-offset-1">
<a href="{{ book_pages_lowest.local_path }}">{% include 'snippets/book_cover.html' with book=book_pages_lowest cover_class='is-w-auto-tablet is-h-l-mobile' %}</a>
</div>
<div class="column is-3">
{% trans "Your shortest read this year" %}
<p class="title is-4 is-serif is-italic">
<a href="{{ book_pages_lowest.local_path }}" class="has-text-link-dark">
{{ book_pages_lowest.title }}
</a>
</p>
{% if book_pages_lowest.authors.exists %}
<p class="subtitle is-5 mb-2">{% trans "by" %}
{% include 'snippets/authors.html' with book=book_pages_lowest %}
</p>
{% endif %}
<p class="subtitle is-6">
{% with pages=book_pages_lowest.pages %}
{% blocktrans %}<strong>{{ pages }}</strong> pages{% endblocktrans%}
{% endwith %}
</p>
</div>
<div class="column is-2">
<a href="{{ book_pages_highest.local_path }}">{% include 'snippets/book_cover.html' with book=book_pages_highest cover_class='is-w-auto-tablet is-h-l-mobile' %}</a>
</div>
<div class="column is-3">
{% trans "and the longest read" %}
<p class="title is-4 is-serif is-italic">
<a href="{{ book_pages_lowest.local_path }}" class="has-text-link-dark">
{{ book_pages_highest.title }}
</a>
</p>
{% if book_pages_highest.authors.exists %}
<p class="subtitle is-5 mb-2">{% trans "by" %}
{% include 'snippets/authors.html' with book=book_pages_highest %}
</p>
{% endif %}
<p class="subtitle is-6">
{% with pages=book_pages_highest.pages %}
{% blocktrans %}<strong>{{ pages }}</strong> pages{% endblocktrans%}
{% endwith %}
</p>
</div>
</div>
{% endif %}
<div class="columns">
<div class="column is-one-fifth is-offset-two-fifths">
<hr />
</div>
</div>
<div class="columns">
<div class="column has-text-centered">
<h2 class="title is-3 is-serif">
{% blocktrans %}You left {{ ratings_total }} ratings, <br />your average rating is {{ rating_average }}{% endblocktrans %}
</h2>
</div>
</div>
<div class="columns is-align-items-center">
<div class="column is-3 is-offset-3">
<a href="{{ book_rating_highest.book.local_path }}">{% include 'snippets/book_cover.html' with book=book_rating_highest.book cover_class='is-w-auto-tablet is-h-l-mobile' %}</a>
</div>
<div class="column is-4">
{% trans "Your best rated review" %}
<p class="title is-4 is-serif is-italic">
<a href="{{ book_rating_highest.book.local_path }}" class="has-text-link-dark">
{{ book_rating_highest.book.title }}
</a>
</p>
{% if book_rating_highest.book.authors.exists %}
<p class="subtitle is-5 mb-2">{% trans "by" %}
{% include 'snippets/authors.html' with book=book_rating_highest.book %}
</p>
{% endif %}
<p class="subtitle is-6">
{% with rating=book_rating_highest.rating|floatformat %}
{% blocktrans %}Your rating: <strong>{{ rating }}</strong>{% endblocktrans%}
{% endwith %}
</p>
</div>
</div>
<div class="columns">
<div class="column is-one-fifth is-offset-two-fifths">
<hr />
</div>
</div>
<div class="columns">
<div class="column has-text-centered">
<h2 class="title is-3 is-serif">
{% blocktrans %}All the books you read in 2021{% endblocktrans %}
</h2>
</div>
</div>
<div class="columns">
<div class="column is-10 is-offset-1">
<div class="books-grid">
{% for book in books %}
{% if book.id in best_ratings_books_ids %}
<a href="{{ book.local_path }}" class="has-text-centered is-big">
{% include 'snippets/book_cover.html' with book=book cover_class='is-w-auto' %}
<span class="book-title is-serif is-size-5">
{{ book.title }}
</span>
</a>
{% else %}
<a href="{{ book.local_path }}" class="has-text-centered">
{% include 'snippets/book_cover.html' with book=book cover_class='is-w-auto' %}
<span class="book-title is-serif is-size-6">
{{ book.title }}
</span>
</a>
{% endif %}
{% endfor %}
</div>
</div>
</div>
{% endif %}
{% endblock %}