feat: everything is related

src/includes/partials/blocks/associated-media.liquid

@@ -0,0 +1,65 @@
+{% comment %} render related artists {% endcomment %}
+{%- if artists -%}
+  <p id="artists" class="music">
+    {% tablericon "headphones" "Related artist(s)" %}
+    Related artist(s)
+  </p>
+  <ul>
+    {% for artist in artists %}
+      <li><a href="{{ artist.url }}">{{ artist.name }}</a>{%- if artist.total_plays > 0 -%}: <strong class="highlight-text">{{ artist.total_plays }} plays</strong>{%- endif -%}</li>
+    {% endfor %}
+  </ul>
+  <hr />
+{%- endif -%}
+{% comment %} render related books {% endcomment %}
+{%- if books -%}
+  <p id="books" class="books">
+    {% tablericon "books" "Related book(s)" %}
+    Related book(s)
+  </p>
+  <ul>
+    {% for book in books %}
+      <li><a href="{{ book.url }}">{{ book.title }}</a> by {{ book.author }}</li>
+    {% endfor %}
+  </ul>
+  <hr />
+{%- endif -%}
+{% comment %} render related genres {% endcomment %}
+{%- if genres -%}
+  <p id="genres" class="music">
+    {% tablericon "headphones" "Genre(s)" %}
+    Related genre(s)
+  </p>
+  <ul>
+    {% for genre in genres %}
+      <li><a href="{{ genre.url }}">{{ genre.name }}</a></li>
+    {% endfor %}
+  </ul>
+  <hr />
+{%- endif -%}
+{% comment %} render related movies {% endcomment %}
+{%- if movies -%}
+  <p id="movies" class="movies">
+    {% tablericon "movie" "Related movie(s)" %}
+    Related movie(s)
+  </p>
+  <ul>
+    {% for movie in movies %}
+      <li><a href="{{ movie.url }}">{{ movie.title }}</a> ({{ movie.year }})</li>
+    {% endfor %}
+  </ul>
+  <hr />
+{%- endif -%}
+{% comment %} render related shows {% endcomment %}
+{%- if shows -%}
+  <p id="tv" class="tv">
+    {% tablericon "device-tv-old" "Related show(s)" %}
+    Related show(s)
+  </p>
+  <ul>
+    {% for show in shows %}
+      <li><a href="{{ show.url }}">{{ show.title }}</a> ({{ show.year }})</li>
+    {% endfor %}
+  </ul>
+  <hr />
+{%- endif -%}

src/includes/partials/blocks/badge-grid.liquid

@@ -1,18 +1,18 @@
 <div class="badge-grid">
   {%- for badge in badges limit: 8 -%}
-  <a href="{{ badge.url }}">
-    <img srcset="
-        https://cdn.coryd.dev/{{ badge.image }}?class=w50 50w,
-        https://cdn.coryd.dev/{{ badge.image }}?class=w100 100w,
-        https://cdn.coryd.dev/{{ badge.image }}?class=w200 200w,
-      " sizes="(max-width: 450px) 88px,
-        (max-width: 850px) 176px,
-        (max-width: 1000px) 352px,
-        704px" src="https://cdn.coryd.dev/{{ badge.image }}?class=w200" alt="{{ badge.image_alt }}" loading="lazy"
-      decoding="async"
-      width="88"
-      height="31"
-    />
-  </a>
+    <a href="{{ badge.url }}">
+      <img srcset="
+          https://cdn.coryd.dev/{{ badge.image }}?class=w50 50w,
+          https://cdn.coryd.dev/{{ badge.image }}?class=w100 100w,
+          https://cdn.coryd.dev/{{ badge.image }}?class=w200 200w,
+        " sizes="(max-width: 450px) 88px,
+          (max-width: 850px) 176px,
+          (max-width: 1000px) 352px,
+          704px" src="https://cdn.coryd.dev/{{ badge.image }}?class=w200" alt="{{ badge.image_alt }}" loading="lazy"
+        decoding="async"
+        width="88"
+        height="31"
+      />
+    </a>
   {%- endfor -%}
 </div>