added no ai webring links to main page

src/lib/components/ring.svelte

@@ -8,7 +8,8 @@
         listLink,
         prevSymbol,
         nextSymbol,
-        highlightEmoji,
+        highlightEmojiLeft,
+        highlightEmojiRight,
     }: {
         ringName: string;
         ringLink: string;
@@ -18,14 +19,22 @@
         listLink?: string;
         prevSymbol: string;
         nextSymbol: string;
-        highlightEmoji: string;
+
+        // Emoji to be used as highlight next to the title
+        highlightEmojiLeft: string;
+
+        /** 
+         * Emoji to be used as highlight to the right of the title. If
+         * not set, will default to highlightEmojiLeft.
+         */
+        highlightEmojiRight?: string;
     } = $props();
 </script>
 
 <div class="webring-container">
     <div class="webring-row">
         <span>〔</span>
-        <a href="{ringLink}">{highlightEmoji} {ringName} {highlightEmoji}</a>
+        <a href="{ringLink}">{highlightEmojiLeft} {ringName} {highlightEmojiRight ?? highlightEmojiLeft}</a>
         <span>〕</span>
     </div>
     <div class="webring-row">

src/routes/+page.svelte

@@ -89,7 +89,7 @@
             randLink="https://webring.bucketfish.me/redirect.html?to=random&name=denizk0461"
             prevSymbol="⥼"
             nextSymbol="⥽"
-            highlightEmoji="🏳️‍🌈" />
+            highlightEmojiLeft="🏳️‍🌈" />
         
         <!-- gamedev webring -->
         <Webring
@@ -101,7 +101,20 @@
             listLink="https://www.rainbowcemetery.com/devring/list.php?id=18"
             prevSymbol="&lt;"
             nextSymbol="&gt;"
-            highlightEmoji="👾" />
+            highlightEmojiLeft="👾"
+            highlightEmojiRight="🎮" />
+        
+        <!-- no ai webring -->
+        <Webring
+            ringName="no ai webring"
+            ringLink="https://baccyflap.com/noai"
+            prevLink="https://baccyflap.com/noai/?prv&s=dzk"
+            nextLink="https://baccyflap.com/noai/?nxt&s=dzk"
+            randLink="https://baccyflap.com/noai/?rnd"
+            prevSymbol="&lt;"
+            nextSymbol="&gt;"
+            highlightEmojiLeft="🚫"
+            highlightEmojiRight="🤖" />
     </div>
 
     <GalleryRow entries={galleryTopRow} />
@@ -139,6 +152,8 @@
         align-items: center;
         justify-content: center;
         margin: 16px 0;
+        flex-wrap: wrap;
+        gap: 8px;
     }
 
     .gradient-title {
@@ -152,11 +167,4 @@
         -webkit-text-fill-color: transparent;
         padding-bottom: 12px;
     }
-
-    @media screen and (max-width: 700px) {
-        .webring-container {
-            flex-direction: column;
-            gap: 16px;
-        }
-    }
 </style>