AverageMarcus/next-book
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Tweaked cats and layout

Browse Source 
Signed-off-by: Marcus Noble <github@marcusnoble.co.uk>
This commit is contained in:
Marcus Noble
2025-05-06 14:40:47 +01:00
parent 4b9fb0afe6
commit a7c18eea37
2 changed files with 45 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
templates/index.html
View File

@@ -19,7 +19,8 @@
main {
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-columns: repeat(12, 1fr);
margin: 8px 16px;
}
.category {
@@ -54,12 +55,43 @@
<h1>Next Book</h1>
<p>Suggestions for the next book to read from your Storygraph to-read pile</p>
</header>
<div class="container">
<main>
{{ $cat := "Fiction" }}
{{ $book := index . $cat }}
<div class="category" style="grid-column: span 4;">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
</a>
<a href="{{ $book.Link }}" target="_blank">{{ $book.Name }}</a>
<div class="rating">⭐ {{ $book.Rating }}</div>
</div>
{{ $cat := "Non-Fiction" }}
{{ $book := index . $cat }}
<div class="category" style="grid-column: span 4;">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
</a>
<a href="{{ $book.Link }}" target="_blank">{{ $book.Name }}</a>
<div class="rating">⭐ {{ $book.Rating }}</div>
</div>
{{ $cat := "Comics" }}
{{ $book := index . $cat }}
<div class="category" style="grid-column: span 4;">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
</a>
<a href="{{ $book.Link }}" target="_blank">{{ $book.Name }}</a>
<div class="rating">⭐ {{ $book.Rating }}</div>
</div>
<main>
{{ $cat := "Fiction" }}
{{ $book := index . $cat }}
<div class="category" style="grid-column: span 3;">
{{ range $cat, $book := .}}
{{ if or (eq $cat "Fiction") (eq $cat "Non-Fiction") (eq $cat "Comics") }}
{{ continue }}
{{ end }}
<div class="category">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
@@ -67,34 +99,7 @@
<a href="{{ $book.Link }}" target="_blank">{{ $book.Name }}</a>
<div class="rating">⭐ {{ $book.Rating }}</div>
</div>
{{ $cat := "Non-Fiction" }}
{{ $book := index . $cat }}
<div class="category" style="grid-column: span 3;">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
</a>
<a href="{{ $book.Link }}" target="_blank">{{ $book.Name }}</a>
<div class="rating">⭐ {{ $book.Rating }}</div>
</div>
{{ range $cat, $book := .}}
{{ if or (eq $cat "Fiction") (eq $cat "Non-Fiction") }}
{{ continue }}
{{ end }}
<div class="category">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
</a>
<a href="{{ $book.Link }}" target="_blank">{{ $book.Name }}</a>
<div class="rating">⭐ {{ $book.Rating }}</div>
</div>
{{ end }}
</main>
</div>
{{ end }}
</main>
</body>
</html>