feat: add spoiler warning

src/_includes/layouts/book.html

@@ -10,6 +10,13 @@ layout: "layouts/base"
     <h1>{{ title }}</h1>
     {% if pullquote %}<p class="text-fadeText flow-space-0.25">{{ pullquote }}</p>{% endif %}
 </header>
+{% if hasSpoilers %}
+    <section class="bg-surface radius-0.5 p-1">
+        <span class="text-secondary">{% include "svgs/triangle-exclamation.svg" %}</span>
+        <strong>Warning!</strong>
+        The following may contain spoilers!
+    </section>
+{% endif %}
 {% if content %}
     <section class="flow">
         {{ content | safe }}

src/_includes/layouts/game.html

@@ -8,8 +8,15 @@ layout: "layouts/base"
 <header class="flow flow-space-1">
     {{ format(page.date) }}
     <h1>{{ title }}</h1>
-    <p class="text-fadeText flow-space-0.25">{{ pullquote }}</p>
+    {% if pullquote %}<p class="text-fadeText flow-space-0.25">{{ pullquote }}</p>{% endif %}
 </header>
+{% if hasSpoilers %}
+    <section class="bg-surface radius-0.5 p-1">
+        <span class="text-secondary">{% include "svgs/triangle-exclamation.svg" %}</span>
+        <strong>Warning!</strong>
+        The following may contain spoilers!
+    </section>
+{% endif %}
 {% if content %}
     <section class="flow">
         {{ content | safe }}

src/_includes/layouts/movie.html

@@ -10,13 +10,20 @@ layout: "layouts/base"
     <h1>{{ title }}</h1>
     <p class="text-fadeText flow-space-0.25">{{ pullquote }}</p>
 </header>
+{% if hasSpoilers %}
+    <section class="bg-surface radius-0.5 p-1">
+        <span class="text-secondary">{% include "svgs/triangle-exclamation.svg" %}</span>
+        <strong>Warning!</strong>
+        The following may contain spoilers!
+    </section>
+{% endif %}
 {% if watchHistory.length > 1 %}
     <p>
         <span class="text-primary">{% include "svgs/circle-info.svg" %}</span>
         I've seen this movie <strong>{{ watchHistory.length }}</strong> {{ "time" | pluralize(watchHistory) }}!
     </p>
 {% endif %}
-{% if favourite %}
+{% if favourite or isFavourite %}
     <p>
         <span class="text-secondary">{% include "svgs/star.svg" %}</span>
         This is one of my favourite movies!

src/_includes/layouts/show.html

@@ -10,6 +10,13 @@ layout: "layouts/base"
     <h1>{{ title }}</h1>
     <p class="text-fadeText flow-space-0.25">{{ pullquote }}</p>
 </header>
+{% if hasSpoilers %}
+    <section class="bg-surface radius-0.5 p-1">
+        <span class="text-secondary">{% include "svgs/triangle-exclamation.svg" %}</span>
+        <strong>Warning!</strong>
+        The following may contain spoilers!
+    </section>
+{% endif %}
 {% if content %}
     <section class="flow">
         {{ content | safe }}

src/_includes/svgs/triangle-exclamation.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16 15H0V12L7 0H9L16 12V15ZM7 4H9V9H7V4ZM7 11H9V13H7V11Z" fill="currentColor"/>
+</svg>