Create Nunjucks macro for site feed link

src/_includes/global/macros.njk

@@ -1,13 +1,18 @@
 {%- macro modEntry(params) -%}
-    ### {{ params.title }}
-    <div class="mod-entry">
-        <img src="/assets/projects/{{ params.bannerFile }}" alt="Banner of {{ params.title }} mod" loading="lazy">
-        <p>{{ params.desc }}</p>
-        <h4>Download the mod:</h4>
-        <div class="mod-entry__downloads">
-            {%- for download in params.downloads -%}
-                <a class="link-btn" href="{{ download.url }}">{{ download.site }}</a>
-            {%- endfor -%}
-        </div>
+### {{ params.title }}
+<div class="mod-entry">
+    <img src="/assets/projects/{{ params.bannerFile }}" alt="Banner of {{ params.title }} mod" loading="lazy">
+    <p>{{ params.desc }}</p>
+    <h4>Download the mod:</h4>
+    <div class="mod-entry__downloads">
+        {%- for download in params.downloads -%}
+            <a class="link-btn" href="{{ download.url }}">{{ download.site }}</a>
+        {%- endfor -%}
     </div>
+</div>
+{%- endmacro -%}
+
+{%- macro siteFeedLink(linkText) -%}
+<a href="{{ sitemeta.feedPath }}">
+    <svg  class="inline-icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M0 64C0 46.3 14.3 32 32 32c229.8 0 416 186.2 416 416c0 17.7-14.3 32-32 32s-32-14.3-32-32C384 253.6 226.4 96 32 96C14.3 96 0 81.7 0 64zM0 416a64 64 0 1 1 128 0A64 64 0 1 1 0 416zM32 160c159.1 0 288 128.9 288 288c0 17.7-14.3 32-32 32s-32-14.3-32-32c0-123.7-100.3-224-224-224c-17.7 0-32-14.3-32-32s14.3-32 32-32z"/></svg>{{ linkText }}</a>
 {%- endmacro -%}

src/_includes/main/changelogs.njk

@@ -22,7 +22,8 @@ articleElement: true
     </ul>
 </nav>
 
-<p>To get notified of the updates on this website, you can subscribe to the <a href="{{ sitemeta.feedPath }}">{{ sitemeta.siteName }} RSS feed</a>, which contains new articles, blog posts and website changelogs.</p>
+{% from "global/macros.njk" import siteFeedLink %}
+<p>To get notified of the updates on this website, you can subscribe to its {{ siteFeedLink("RSS feed") }}, which contains new articles, blog posts and website changelogs.</p>
 
 {{ content | safe }}
 

src/_includes/main/footer.njk

@@ -3,8 +3,9 @@
 {% block footerContent %}
     <h2 class="visually-hidden">Footer Navigation:</h2>
     {% set currentUrl %}{{ page.url }}{% endset %}
+    {% from "global/macros.njk" import siteFeedLink %}
     <ul class="inline-nav footer__links">
-        <li><a href="{{ sitemeta.feedPath }}">RSS Feed</a></li>
+        <li>{{ siteFeedLink("RSS Feed") }}</li>
         <li><a
             {% if currentUrl === "/sitemap/" %}aria-current="page"{% endif %}
             href="/sitemap/

src/assets/css/utility.css

@@ -16,9 +16,11 @@
 }
 
 .inline-icon {
+    display: inline-block;
     vertical-align: -10%;
     height: 1em;
     fill: currentColor;
+    padding-inline-end: .25em;
 }
 
 .inline-list {

src/index.njk

@@ -57,7 +57,8 @@ eleventyComputed:
         {%- endfor %}
         <p><a href="/changelogs">View all site changelogs</a></p>
     </div>
-    <p>You can subscribe to the <a href="{{ sitemeta.feedPath }}">{{ sitemeta.siteName }} RSS feed</a> to get notified of the updates on this website, including new articles, blog posts and website changelogs.</p>
+    {% from "global/macros.njk" import siteFeedLink %}
+    <p>You can subscribe to the {{ siteFeedLink(sitemeta.siteName + " RSS feed") }} to get notified of the updates on this website, including new articles, blog posts and website changelogs.</p>
 
     {% include "main/statuscafe.njk" %}
 </section>