rss for every category

site/_includes/-header.njk

@@ -19,10 +19,10 @@
   {%- if cover %}
   <div class="cover">
     <img src="{{ cover | url }}" alt="" loading="eager">
-    <h1>{{ title }}</h1>
+    <h1>{{ title }}{% if rssUrl %}<a class="rss" href="{{rssUrl}}"></a>{% endif %}</h1>
   </div>
   {%- else %}
-    <h1>{{ title }}</h1>
+    <h1>{{ title }}{% if rssUrl %}<a class="rss" href="{{rssUrl}}"></a>{% endif %}</h1>
   {%- endif %}
   <div class="header-meta">
     {%- if date and not omitMetadata -%}

site/_includes/collection.njk

@@ -1,7 +1,17 @@
 ---
 layout: "base.njk"
 eleventyComputed:
-  title: "{{ page.fileSlug | capitalize }}"
+  tag: "{{ page.fileSlug }}"
+  title: "{{ tag | capitalize }}"
+  rssUrl: "
+  {%- if tag == 'posts' -%}
+  /feed.xml
+  {%- else -%}
+    {%- if tag != 'music' -%}
+      /feeds/{{tag}}
+    {%- endif -%}
+  {%- endif -%}
+  "
 ---
 
 {%- from "components/collectionList.njk" import collectionList with context -%}
@@ -9,11 +19,10 @@ eleventyComputed:
   <section data-pagefind-body>
     {{ content | safe }}
   </section>
-  {% set tag = page.fileSlug %}
   {% if collections[tag] %}
     {% if tag === "posts" %}
       {% include "-taglist.njk" %}
     {% endif %}
     {{ collectionList(tag) }}
   {% endif %}
-</main>
+</main>

site/_includes/css/site.css

@@ -515,6 +515,21 @@ h4 {
 h1 {
   margin-bottom: 0;
 }
+a.rss {
+  float: right;
+  height: 1lh;
+  width: 1lh;
+  margin: 0 0 0 0.5rem;
+  --glowColor: #F80A;
+  background: url("/icons/rss.svg");
+  border-radius: 0.25em;
+  opacity: 0.25;
+  transition: 5s opacity;
+  &:hover {
+    opacity: 1;
+    transition: none;
+  }
+}
 .header-meta {
   font-size: var(--s-1);
   > * + *:not(:empty)::before {