cover: Change the logic again:

- Work on feeds.
- Add `.is-cover` to modify the behaviours of columns.
- Only apply logic for dimensions on the cover container; too many contextual side effects otherwise.
- Add classes to dimension and align, including auto margins for flex.
- Rename classes in templates accordingly.
This commit is contained in:
Fabien Basmaison
2021-04-27 14:58:30 +02:00
parent 56d821970a
commit 8ddc292ee6
14 changed files with 294 additions and 73 deletions

View File

@ -4,20 +4,25 @@
{% load i18n %}
{% if not hide_book %}
{% with book=status.book|default:status.mention_books.first %}
<div class="columns is-mobile">
<div class="column is-narrow">
<div>
<a href="{{ book.local_path }}">{% include 'snippets/book_cover.html' with book=book cover_class='is-h-small' %}</a>
{% with book=status.book|default:status.mention_books.first %}
<div class="columns is-mobile is-gapless">
<a class="column is-cover is-narrow" href="{{ book.local_path }}">
{% include 'snippets/book_cover.html' with book=book cover_class='is-h-xs is-h-s-tablet' %}
</a>
<div class="column ml-3">
<h3 class="title is-6 mb-1">
{% include 'snippets/book_titleby.html' with book=book %}
</h3>
<p>
{{ book|book_description|to_markdown|default:""|safe|truncatewords_html:20 }}
</p>
{% include 'snippets/shelve_button/shelve_button.html' with book=book %}
</div>
</div>
</div>
<div class="column">
<h3 class="title is-6 mb-1">{% include 'snippets/book_titleby.html' with book=book %}</h3>
<p>{{ book|book_description|to_markdown|default:""|safe|truncatewords_html:20 }}</p>
{% include 'snippets/shelve_button/shelve_button.html' with book=book %}
</div>
</div>
{% endwith %}
{% endwith %}
{% endif %}
{% endspaceless %}