bookshelf style

This commit is contained in:
2023-04-24 12:54:51 -05:00
parent 7a38cdaaf5
commit 938dae2586
2 changed files with 29 additions and 13 deletions

View File

@@ -666,10 +666,21 @@ a {
.bookshelf { .bookshelf {
width: 360px; width: 360px;
padding: 10px; padding: 10px;
border: solid 2px #553;
background-image: url("https://wallpapercave.com/wp/wp4292426.jpg");
}
.bookshelfHeader {
color: lightgray;
margin: .5em;
border-bottom: solid black 3px;
margin-right: 5em;
}
.bookContainer {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
flex-wrap: wrap; flex-wrap: wrap;
background-color: #a58a45;
} }
.book { .book {
@@ -686,7 +697,9 @@ a {
.book h4 { .book h4 {
font-size: x-small; font-size: x-small;
color: black; color: lightgray;
margin-bottom: 0;
text-align: center;
} }
.bookReview { .bookReview {

View File

@@ -1,6 +1,8 @@
{% macro bookshelf(books) %} {% macro bookshelf(books) %}
<a href="/books"> <a href="/books">
<div class="bookshelf"> <div class="bookshelf">
<h5 class="bookshelfHeader">I read things:</h5>
<div class="bookContainer">
{% for i in books.selection %} {% set book = books.books[i] %} {% for i in books.selection %} {% set book = books.books[i] %}
<a href="/books#'{{i}}'"> <a href="/books#'{{i}}'">
<div class="book"> <div class="book">
@@ -13,5 +15,6 @@
</a> </a>
{% endfor %} {% endfor %}
</div> </div>
</div>
</a> </a>
{% endmacro %} {% endmacro %}