More legible statuses on mobile

This commit is contained in:
Mouse Reeve 2020-11-05 08:21:00 -08:00
parent 738db165e5
commit 1c442f0dfe
3 changed files with 20 additions and 7 deletions

View file

@ -62,13 +62,26 @@ input.toggle-control:checked ~ .toggle-content {
.cover-container.is-medium { .cover-container.is-medium {
height: 150px; height: 150px;
} }
.cover-container.is-small {
height: 100px;
}
@media only screen and (max-width: 768px) {
.cover-container {
height: 200px;
width: max-content;
}
.cover-container.is-medium {
height: 100px;
}
.cover-container.is-small {
height: 70px;
}
}
.cover-container.is-medium .no-cover div { .cover-container.is-medium .no-cover div {
font-size: 0.9em; font-size: 0.9em;
padding: 0.3em; padding: 0.3em;
} }
.cover-container.is-small {
height: 100px;
}
.cover-container.is-small .no-cover div { .cover-container.is-small .no-cover div {
font-size: 0.7em; font-size: 0.7em;
padding: 0.1em; padding: 0.1em;

View file

@ -1,11 +1,11 @@
<div class="media"> <div class="columns">
<div class="media-left"> <div class="column is-narrow">
<div> <div>
<a href="/book/{{ book.id }}">{% include 'snippets/book_cover.html' with book=book %}</a> <a href="/book/{{ book.id }}">{% include 'snippets/book_cover.html' with book=book %}</a>
{% include 'snippets/shelve_button.html' with book=book %} {% include 'snippets/shelve_button.html' with book=book %}
</div> </div>
</div> </div>
<div class="media-content"> <div class="column">
<h3 class="title is-6">{% include 'snippets/book_titleby.html' with book=book %}</h3> <h3 class="title is-6">{% include 'snippets/book_titleby.html' with book=book %}</h3>
{% include 'snippets/book_description.html' with book=book %} {% include 'snippets/book_description.html' with book=book %}
</div> </div>