From 5b8b95472c7f6b913e5ff8b71954d7b393c4aadf Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Sun, 30 Jun 2024 14:21:17 +0800
Subject: [PATCH] Create template for webrings

---
 src/_includes/main/webrings.njk | 48 +++++++++++++++++++++++
 src/pages/links.njk             | 67 +++++----------------------------
 2 files changed, 58 insertions(+), 57 deletions(-)
 create mode 100644 src/_includes/main/webrings.njk

diff --git a/src/_includes/main/webrings.njk b/src/_includes/main/webrings.njk
new file mode 100644
index 00000000..0bd98ab3
--- /dev/null
+++ b/src/_includes/main/webrings.njk
@@ -0,0 +1,48 @@
+<ul class="web-btn-wrapper">
+    <li>
+        <nav class="webring">
+            <p class="webring__name"><a href="https://cs.sjoy.lol/">CSS JOY Webring</a></p>
+            <ul class="webring__links">
+                <li class="webring__link">
+                    <a href="https://webri.ng/webring/cssjoy/previous?via=https://leilukin.com/">Previous Site</a>
+                </li>
+                <li class="webring__link">
+                    <a href="https://webri.ng/webring/cssjoy/random?via=https://leilukin.com/">Random Site</a>
+                </li>
+                <li class="webring__link">
+                    <a href="https://webri.ng/webring/cssjoy/next?via=https://leilukin.com/">Next Site</a>
+                </li>
+            </ul>
+        </nav>
+    </li>
+    <li>
+        <div id='DykeWrite-Web2'> <script type="text/javascript" src="https://dykewrite.neocities.org/webring/onionring-variables.js"></script> <script type="text/javascript" src="https://dykewrite.neocities.org/webring/onionring-widget.js"></script> </div>
+        <link rel="stylesheet" href="https://dykewrite.neocities.org/webring/onionring.css">
+    </li>
+    <li>
+        <div id='focusfirst-webring'>
+            <script type="text/javascript" src="https://owlsroost.xyz/webring/onionring-variables.js"></script>
+            <script type="text/javascript" src="https://owlsroost.xyz/webring/onionring-widget.js"></script>
+            <noscript><a href='https://owlsroost.xyz/index.html'><img src="https://owlsroost.xyz/webring/focusfirst.png" alt="Focus First Index"></a></noscript>
+        </div>
+    </li>
+    <li>
+        <journal-ring icon="lavender"></journal-ring><script async src="https://cdn.jsdelivr.net/gh/js044/nenrikido@main/static/js/misc/journalring.js"></script>
+    </li>
+    <li>
+        <div style="border: none; display: inline-flex">
+            <a href="https://isaacfish.neocities.org/webring/25.html">
+                <img src="/assets/buttons/webrings/queercoded-left.png" alt="left arrow" loading="lazy">
+            </a>&nbsp;
+            <a href="https://isaacfish.neocities.org/webring/">
+                <img src="/assets/buttons/webrings/queercoded.png" alt="queer coded webring" title="The Queer Coded Webring" loading="lazy">
+            </a>&nbsp;
+            <a href="https://isaacfish.neocities.org/webring/27.html">
+                <img src="/assets/buttons/webrings/queercoded-right.png" alt="right arrow" loading="lazy">
+            </a>
+        </div>
+    </li>
+    <li>
+        <script src="https://transring.neocities.org/ring.js" data-widget="nb"></script>
+    </li>
+</ul>
\ No newline at end of file
diff --git a/src/pages/links.njk b/src/pages/links.njk
index 48e4a0ac..c003e284 100644
--- a/src/pages/links.njk
+++ b/src/pages/links.njk
@@ -114,57 +114,14 @@ eleventyNavigation:
 </section>
 
 <section class="content__section">
-    <h2>My Web Groups</h2>
-
-    <h3>Webrings</h3>
-    <ul class="web-btn-wrapper">
-        <li>
-            <nav class="webring">
-                <p class="webring__name"><a href="https://cs.sjoy.lol/">CSS JOY Webring</a></p>
-                <ul class="webring__links">
-                    <li class="webring__link">
-                        <a href="https://webri.ng/webring/cssjoy/previous?via=https://leilukin.com/">Previous Site</a>
-                    </li>
-                    <li class="webring__link">
-                        <a href="https://webri.ng/webring/cssjoy/random?via=https://leilukin.com/">Random Site</a>
-                    </li>
-                    <li class="webring__link">
-                        <a href="https://webri.ng/webring/cssjoy/next?via=https://leilukin.com/">Next Site</a>
-                    </li>
-                </ul>
-            </nav>
-        </li>
-        <li>
-            <div id='DykeWrite-Web2'> <script type="text/javascript" src="https://dykewrite.neocities.org/webring/onionring-variables.js"></script> <script type="text/javascript" src="https://dykewrite.neocities.org/webring/onionring-widget.js"></script> </div>
-            <link rel="stylesheet" href="https://dykewrite.neocities.org/webring/onionring.css">
-        </li>
-        <li>
-            <div id='focusfirst-webring'>
-                <script type="text/javascript" src="https://owlsroost.xyz/webring/onionring-variables.js"></script>
-                <script type="text/javascript" src="https://owlsroost.xyz/webring/onionring-widget.js"></script>
-                <noscript><a href='https://owlsroost.xyz/index.html'><img src="https://owlsroost.xyz/webring/focusfirst.png" alt="Focus First Index"></a></noscript>
-            </div>
-        </li>
-        <li>
-            <journal-ring icon="lavender"></journal-ring><script async src="https://cdn.jsdelivr.net/gh/js044/nenrikido@main/static/js/misc/journalring.js"></script>
-        </li>
-        <li>
-            <div style="border: none; display: inline-flex">
-                <a href="https://isaacfish.neocities.org/webring/25.html">
-                    <img src="/assets/buttons/webrings/queercoded-left.png" alt="left arrow" loading="lazy">
-                </a>&nbsp;
-                <a href="https://isaacfish.neocities.org/webring/">
-                    <img src="/assets/buttons/webrings/queercoded.png" alt="queer coded webring" title="The Queer Coded Webring" loading="lazy">
-                </a>&nbsp;
-                <a href="https://isaacfish.neocities.org/webring/27.html">
-                    <img src="/assets/buttons/webrings/queercoded-right.png" alt="right arrow" loading="lazy">
-                </a>
-            </div>
-        </li>
-        <li>
-            <script src="https://transring.neocities.org/ring.js" data-widget="nb"></script>
-        </li>
+    <h2>Link Exchanges</h2>
+    <ul>
+        <li><a href="https://theretrosaga.com/">The Retro Saga</a></li>
     </ul>
+</section>
+
+<section class="content__section">
+    <h2>My Web Groups</h2>
 
     <h3>Directories</h3>
     <ul class="web-btn-wrapper">
@@ -216,11 +173,7 @@ eleventyNavigation:
 
     <h3>Fanlistings</h3>
     <p>Check out <a href="https://fan.leilukin.com/">Beehive, my fanlisting collective</a> to see all fanlistings I own, have joined and have applied to join!</p>
-</section>
 
-<section class="content__section">
-    <h2>Link Exchanges</h2>
-    <ul>
-        <li><a href="https://theretrosaga.com/">The Retro Saga</a></li>
-    </ul>
-</section>
+    <h3>Webrings</h3>
+    {% include "main/webrings.njk" %}
+</section>
\ No newline at end of file