Add RSS icon to feed link

helenclx · Sep 15, 2024 · 7b6505d · 7b6505d
1 parent ec72ea4
commit 7b6505d
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/src/_includes/global/footer.njk b/src/_includes/global/footer.njk
@@ -6,7 +6,11 @@
 
     <h2 class="visually-hidden">Footer Navigation:</h2>
     <ul class="inline-list">
-        <li><a href="{{ sitemeta.feedPath }}">RSS Feed</a></li>
+        <li>
+            <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>RSS Feed
+            </a>
+        </li>
     {%- for statement in collections.statements -%}
         <li><a
             {% if entry.url == page.url %}aria-current="page"{% endif %}

diff --git a/src/assets/css/utility.css b/src/assets/css/utility.css
@@ -10,10 +10,12 @@
 .text-bold { font-weight: 700; }
 
 .inline-icon {
+    display: inline-block;
     vertical-align: -10%;
     height: 0.9em;
     fill: currentColor;
 }
+a > .inline-icon { padding-inline-end: .25em; }
 
 .grid-center {
     display: grid;