fix: layout of catalogue type pages

src/pages/books/favourites.html

@@ -5,11 +5,8 @@ permalink: "books/favourites/index.html"
 
 {% from "macros/media-grid.njk" import grid %}
 {% set data = collections.book | filterFavourites | reverse %}
-<a class="button" href="/books">
-    {% include "svgs/arrow-left.svg" %}
-Back to books</a>
 <section class="flow">
-    <h1>Favourite book</h1>
+    <h1>Favourite books</h1>
     <p>A collection of my favourite books!</p>
     {{ grid(data) }}
 </section>

src/pages/books/recent.html

@@ -5,8 +5,21 @@ permalink: "books/recent/index.html"
 
 {% from "macros/media-grid.njk" import grid %}
 {% set data = collections.book | reverse %}
+{% set tags = collections.book | allTagCounts(["book"]) | limit(5) %}
 <section class="flow">
     <h1>Recent books</h1>
     <p>A collection of books I've read.</p>
+    <h2>
+        <a href="../tags">Tags</a>
+    </h2>
+    <ul class="categories cluster list-none p-0 line-height-m">
+        {% for tag in tags %}
+            <li>
+                <a class="button" href="../tag/{{ tag.tag | slugify }}">
+                    {% include "svgs/frame.svg" %}
+                {{ tag.tag }}</a>
+            </li>
+        {% endfor %}
+    </ul>
     {{ grid(data) }}
 </section>

src/pages/books/tag.html

@@ -7,7 +7,7 @@ permalink: "books/tag/{{ tag | slugify }}/index.html"
 ---
 
 {% from "macros/media-grid.njk" import grid %}
-{% set data = collections.booksByTag[tag] %}
+{% set data = collections.booksByTag[tag] | reverse %}
 <header class="flow flow-space-1">
     <h1>Books</h1>
     <p class="text-fadeText flow-space-0.25">Tagged with "{{ tag }}"</p>

src/pages/games/index.html

@@ -25,7 +25,7 @@ permalink: "games/index.html"
         {% endfor %}
     </ul>
     <h2>
-        <a href="recent">Latest games</a>
+        <a href="recent">Recent games</a>
     </h2>
     {{ grid(data) }}
     <h2>

src/pages/games/recent.html

@@ -5,8 +5,21 @@ permalink: "games/recent/index.html"
 
 {% from "macros/media-grid.njk" import grid %}
 {% set data = collections.game | reverse %}
+{% set tags = collections.game | allTagCounts(["game"]) | limit(5) %}
 <section class="flow">
-    <h1>Latest games</h1>
+    <h1>Recent games</h1>
     <p>A collection of games I've played.</p>
+    <h2>
+        <a href="../tags">Tags</a>
+    </h2>
+    <ul class="categories cluster list-none p-0 line-height-m">
+        {% for tag in tags %}
+            <li>
+                <a class="button" href="../tag/{{ tag.tag | slugify }}">
+                    {% include "svgs/frame.svg" %}
+                {{ tag.tag }}</a>
+            </li>
+        {% endfor %}
+    </ul>
     {{ grid(data) }}
 </section>

src/pages/watching/movies/tag.html

@@ -7,7 +7,7 @@ permalink: "watching/movies/tag/{{ tag | slugify }}/index.html"
 ---
 
 {% from "macros/media-grid.njk" import grid %}
-{% set data = collections.moviesByTag[tag] %}
+{% set data = collections.moviesByTag[tag] | reverse %}
 <header class="flow flow-space-1">
     <h1>Movies</h1>
     <p class="text-fadeText flow-space-0.25">Tagged with "{{ tag }}"</p>

src/pages/watching/shows/tag.html

@@ -7,7 +7,7 @@ permalink: "watching/shows/tag/{{ tag | slugify }}/index.html"
 ---
 
 {% from "macros/media-grid.njk" import grid %}
-{% set data = collections.showsByTag[tag] %}
+{% set data = collections.showsByTag[tag] | reverse %}
 <header class="flow flow-space-1">
     <h1>Shows</h1>
     <p class="text-fadeText flow-space-0.25">Tagged with "{{ tag }}"</p>