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

Fix mobile layout

Browse Source 
Signed-off-by: Marcus Noble <github@marcusnoble.co.uk>
This commit is contained in:
Marcus Noble
2025-05-17 15:59:56 +01:00
parent d2566e80d3
commit 7620f980c1
1 changed files with 15 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
templates/index.html
View File

@@ -43,10 +43,22 @@
padding: 6px;
}
main > .category:nth-of-type(1),
main > .category:nth-of-type(2),
main > .category:nth-of-type(3) {
grid-column: span 4;
}
@media screen and (max-width: 768px) {
main {
grid-template-columns: repeat(1, 1fr);
}
main > .category:nth-of-type(1),
main > .category:nth-of-type(2),
main > .category:nth-of-type(3) {
grid-column: span 2;
}
}
</style>
</head>
@@ -67,7 +79,7 @@
<main>
{{ $cat := "Fiction" }}
{{ $book := index .Books $cat }}
<div class="category" style="grid-column: span 4;">
<div class="category">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
@@ -77,7 +89,7 @@
</div>
{{ $cat := "Non-Fiction" }}
{{ $book := index .Books $cat }}
<div class="category" style="grid-column: span 4;">
<div class="category">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />
@@ -87,7 +99,7 @@
</div>
{{ $cat := "Comics" }}
{{ $book := index .Books $cat }}
<div class="category" style="grid-column: span 4;">
<div class="category">
<h3>{{ $cat }}</h3>
<a href="{{ $book.Link }}" target="_blank">
<img src="{{ $book.Image }}" alt="{{ $book.Name }} cover" style="height: 250px;" />