Merge pull request #1710 from joachimesque/summary-images-fixes

Summary images fixes
This commit is contained in:
Mouse Reeve 2021-12-28 12:00:38 -08:00 committed by GitHub
commit 4159776771
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 19 additions and 9 deletions

View file

@ -612,8 +612,8 @@ ol.ordered-list li::before {
.books-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(10em, 1fr));
gap: 1.5rem;
grid-template-columns: repeat(2, 1fr);
gap: 1rem;
align-items: end;
justify-items: stretch;
}
@ -622,7 +622,6 @@ ol.ordered-list li::before {
grid-column: span 2;
grid-row: span 2;
justify-self: stretch;
padding: 1.5rem 1.5rem 0;
}
.books-grid .book-cover {
@ -638,6 +637,17 @@ ol.ordered-list li::before {
min-height: calc(2 * var(--height-basis));
}
@media only screen and (min-width: 769px) {
.books-grid {
gap: 1.5rem;
grid-template-columns: repeat(auto-fit, minmax(10em, 1fr));
}
.books-grid > .is-big {
padding: 1.5rem 1.5rem 0;
}
}
/* Copy
******************************************************************************/

View file

@ -130,7 +130,7 @@
{% if book_pages_lowest and book_pages_highest %}
<div class="columns 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>
<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' size='xxlarge' %}</a>
</div>
<div class="column is-3">
{% trans "Their shortest read this year…" %}
@ -151,7 +151,7 @@
</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>
<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' size='xxlarge' %}</a>
</div>
<div class="column is-3">
{% trans "…and the longest" %}
@ -189,8 +189,8 @@
</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 class="column is-2 is-offset-4">
<a href="{{ book_rating_highest.book.local_path }}">{% include 'snippets/book_cover.html' with book=book_rating_highest.book cover_class='is-w-xl-tablet is-h-l-mobile' size='xxlarge' %}</a>
</div>
{% if book_rating_highest %}
<div class="column is-4">
@ -224,7 +224,7 @@
<div class="columns">
<div class="column has-text-centered">
<h2 class="title is-3 is-serif">
{% blocktrans %}All the books {{ display_name }} read in 2021{% endblocktrans %}
{% blocktrans %}All the books {{ display_name }} read in {{ year }}{% endblocktrans %}
</h2>
</div>
</div>
@ -242,7 +242,7 @@
</a>
{% else %}
<a href="{{ book.local_path }}" class="has-text-centered has-text-success-dark">
{% include 'snippets/book_cover.html' with book=book cover_class='is-w-auto' size='large' %}
{% include 'snippets/book_cover.html' with book=book cover_class='is-w-auto' size='xlarge' %}
<span class="book-title is-serif is-size-6">
{{ book.title }}
</span>