zedfrigg/bookwyrm
1
0
Fork 0
Code Activity

cover: Change the logic again:

Browse source 
- 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
Download patch file Download diff file Expand all files Collapse all files

2
bookwyrm/templates/book/book.html
View file

@ -48,7 +48,7 @@
<div class="columns">
<div class="column is-one-fifth">
{% include 'snippets/book_cover.html' with book=book cover_class='is-h-medium-mobile' %}
{% include 'snippets/book_cover.html' with book=book cover_class='is-h-m-mobile' %}
{% include 'snippets/rate_action.html' with user=request.user book=book %}
<div class="mb-3">

2
bookwyrm/templates/book/edit_book.html
View file

@ -170,7 +170,7 @@
<h2 class="title is-4">{% trans "Cover" %}</h2>
<div class="columns">
<div class="column is-narrow">
{% include 'snippets/book_cover.html' with book=book cover_class='is-h-small' %}
{% include 'snippets/book_cover.html' with book=book cover_class='is-h-s' %}
</div>
<div class="column is-narrow">
<div class="block">

8
bookwyrm/templates/book/editions.html
View file

@ -14,11 +14,11 @@
<div class="block">
{% for book in editions %}
<div class="columns is-gapless mb-6">
<div class="column is-2 is-flex align-r-tablet">
{% include 'snippets/book_cover.html' with book=book cover_class='is-h-medium' %}
<div class="column is-cover">
{% include 'snippets/book_cover.html' with book=book cover_class='is-w-m is-h-m align to-l-mobile' %}
</div>
<div class="column is-flex-grow-1 my-3-mobile mx-3-tablet">
<div class="column my-3-mobile ml-3-tablet mr-auto">
<h2 class="title is-5 mb-1">
<a href="/book/{{ book.id }}" class="has-text-black">
{{ book.title }}
@ -26,7 +26,7 @@
</h2>
{% with book=book %}
<div class="columns is-multiline is-gapless">
<div class="columns is-multiline is-gapless ml-3-tablet">
<div class="column is-half">
{% include 'book/publisher_info.html' %}
</div>