From 6ef069cadcf58cb26e2f9c0183d3d6beb2ffdc80 Mon Sep 17 00:00:00 2001
From: Ruben <sneexy@disroot.org>
Date: Mon, 7 Apr 2025 11:26:39 -0500
Subject: [PATCH] more page accessibility fixes

---
 blog/index.html     | 20 ++++++++++----------
 colors.css          |  2 +-
 donate/index.html   | 20 ++++++++++----------
 home.css            |  4 ++--
 index.html          | 20 ++++++++++----------
 me/index.html       | 40 +++++++++++++++++++---------------------
 me/ruben/index.html | 20 ++++++++++----------
 script.js           | 22 ++++++++++++----------
 8 files changed, 74 insertions(+), 74 deletions(-)

diff --git a/blog/index.html b/blog/index.html
index f51741e..fc27d6c 100644
--- a/blog/index.html
+++ b/blog/index.html
@@ -29,7 +29,7 @@
 <div class="navbar">
     <a class="nav-base nav-baselink" href="/"><span class="tabler--grid-dots"></span> synth download!</a>
     <details class="nav-base nav-baselink-mobile">
-        <summary><span class="tabler--grid-dots"></span> s <div class="dot" style="background-color: var(--background) !important;"></div> d!</summary>
+        <summary><span class="tabler--grid-dots"></span> s <span aria-hidden="true" class="dot" style="background-color: var(--background) !important;"></span> d!</summary>
         <ul>
             <li>
                 <a href="/"><span class="tabler--home"></span> home</a>
@@ -88,20 +88,20 @@
 <!-- webrings and credits -->
 <footer>
     <details open id="footer" class="window">
-        <summary aria-hidden="true">
+        <summary>
             <a href="#footer">footer</a>
         </summary>
 
         <section>
-            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
             <section class="inner-footer">
-                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" alt="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" alt="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
-                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" alt="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
-                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" alt="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
-                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" alt="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
+                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
+                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" aria-label="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
+                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" aria-label="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
+                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" aria-label="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
+                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
             </section>
             <p style="padding-bottom: 14px;"><a href="https://synthspecies.com">Synth species</a> created by <a href="https://www.furaffinity.net/user/vader-san">Vader-San</a>, synth.download is not affiliated with the creator in any way.</p>
             <p>made with <span class="rainbow">love</span>, <span class="rainbow">lack of sleep</span> and <span class="rainbow">procrastination</span></p>
diff --git a/colors.css b/colors.css
index 14b295b..5940049 100644
--- a/colors.css
+++ b/colors.css
@@ -19,7 +19,7 @@ it doesn't have a name, call it "synth.download color scheme official real"
     --green: #86b300;
     --blue: #4cbf99;
     --purple: #a37acc;
-    --red: #f34646;
+    --red: #ec3838;
 
     /* extended catppuccin based colors */
     --flamingo: #ff7d7d;
diff --git a/donate/index.html b/donate/index.html
index d039982..29af384 100644
--- a/donate/index.html
+++ b/donate/index.html
@@ -28,7 +28,7 @@
 <div class="navbar">
     <a class="nav-base nav-baselink" href="/"><span class="tabler--grid-dots"></span> synth download!</a>
     <details class="nav-base nav-baselink-mobile">
-        <summary><span class="tabler--grid-dots"></span> s <div class="dot" style="background-color: var(--background) !important;"></div> d!</summary>
+        <summary><span class="tabler--grid-dots"></span> s <span aria-hidden="true" class="dot" style="background-color: var(--background) !important;"></span> d!</summary>
         <ul>
             <li>
                 <a href="/"><span class="tabler--home"></span> home</a>
@@ -88,20 +88,20 @@
 <!-- webrings and credits -->
 <footer>
     <details open id="footer" class="window">
-        <summary aria-hidden="true">
+        <summary>
             <a href="#footer">footer</a>
         </summary>
 
         <section>
-            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
             <section class="inner-footer">
-                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" alt="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" alt="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
-                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" alt="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
-                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" alt="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
-                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" alt="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
+                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
+                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" aria-label="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
+                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" aria-label="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
+                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" aria-label="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
+                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
             </section>
             <p style="padding-bottom: 14px;"><a href="https://synthspecies.com">Synth species</a> created by <a href="https://www.furaffinity.net/user/vader-san">Vader-San</a>, synth.download is not affiliated with the creator in any way.</p>
             <p>made with <span class="rainbow">love</span>, <span class="rainbow">lack of sleep</span> and <span class="rainbow">procrastination</span></p>
diff --git a/home.css b/home.css
index 22a14b9..b14de07 100644
--- a/home.css
+++ b/home.css
@@ -36,10 +36,10 @@
             }
         }
         div:first-child {
-            background-color: color-mix(in srgb, var(--yellow) 20%, transparent);
+            background-color: color-mix(in srgb, var(--yellow) 15%, transparent);
         }
         div:last-child {
-            background-color: color-mix(in srgb, var(--sapphire) 20%, transparent);
+            background-color: color-mix(in srgb, var(--sapphire) 15%, transparent);
             margin-left: 1.5em;
         }
     }
diff --git a/index.html b/index.html
index 1701fb6..fe2dc78 100644
--- a/index.html
+++ b/index.html
@@ -27,7 +27,7 @@
 <div class="navbar">
     <a class="nav-base nav-baselink" href="/"><span class="tabler--grid-dots"></span> synth download!</a>
     <details class="nav-base nav-baselink-mobile">
-        <summary><span class="tabler--grid-dots"></span> s <div class="dot" style="background-color: var(--background) !important;"></div> d!</summary>
+        <summary><span class="tabler--grid-dots"></span> s <span aria-hidden="true" class="dot" style="background-color: var(--background) !important;"></span> d!</summary>
         <ul>
             <li>
                 <a href="/"><span class="tabler--home"></span> home</a>
@@ -220,20 +220,20 @@
 <!-- webrings and credits -->
 <footer>
     <details open id="footer" class="window">
-        <summary aria-hidden="true">
+        <summary>
             <a href="#footer">footer</a>
         </summary>
 
         <section>
-            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
             <section class="inner-footer">
-                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" alt="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" alt="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
-                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" alt="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
-                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" alt="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
-                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" alt="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
+                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
+                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" aria-label="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
+                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" aria-label="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
+                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" aria-label="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
+                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
             </section>
             <p style="padding-bottom: 14px;"><a href="https://synthspecies.com">Synth species</a> created by <a href="https://www.furaffinity.net/user/vader-san">Vader-San</a>, synth.download is not affiliated with the creator in any way.</p>
             <p>made with <span class="rainbow">love</span>, <span class="rainbow">lack of sleep</span> and <span class="rainbow">procrastination</span></p>
diff --git a/me/index.html b/me/index.html
index 343ff4a..37a8b1d 100644
--- a/me/index.html
+++ b/me/index.html
@@ -30,7 +30,7 @@
 <div class="navbar">
     <a class="nav-base nav-baselink" href="/"><span class="tabler--grid-dots"></span> synth download!</a>
     <details class="nav-base nav-baselink-mobile">
-        <summary><span class="tabler--grid-dots"></span> s <div aria-hidden="true" class="dot" style="background-color: var(--background) !important;"></div> d!</summary>
+        <summary><span class="tabler--grid-dots"></span> s <span aria-hidden="true" class="dot" style="background-color: var(--background) !important;"></span> d!</summary>
         <ul>
             <li>
                 <a href="/"><span class="tabler--home"></span> home</a>
@@ -64,8 +64,6 @@
 </div>
 
 <!-- simple introduction -->
-<div aria-hidden="true"></div>
-
 <details open id="sneexy" class="window">
     <summary>
         <div aria-hidden="true">
@@ -163,17 +161,17 @@
         <h2><a href="#links">links</a></h2>
         <p>my links to all of my public facing socials and contacts. if i know you well, you may ask me for anything more private, like signal or matrix, etc. <small>fastest way to get this is by checking my pinned post if you follow me/we're mutuals on fedi.</small></span></p>
         <div class="socials-contacts-list">
-            <a class="fedi-icon" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--orange) 25%, transparent); color: var(--orange);" alt="Fediverse/Mastodon"><span class="tabler--universe" style="pointer-events: none;"></span></a>
-            <a class="fedi-icon-2" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--teal) 25%, transparent); color: var(--teal);" alt="Fediverse/Mastodon" aria-hidden="true"><span class="tabler--brand-mastodon" style="pointer-events: none;"></span></a>
-            <a href="mailto:&#x73;&#x6e;&#x65;&#x65;&#x78;&#x79;&#x40;&#x73;&#x79;&#x6e;&#x74;&#x68;&#x2e;&#x64;&#x6f;&#x77;&#x6e;&#x6c;&#x6f;&#x61;&#x64;" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" alt="Email"><span class="tabler--mail" style="pointer-events: none;"></span></a>
-            <a href="https://listenbrainz.org/user/Sneexy" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" alt="ListenBraniz"><span class="tabler--brand-metabrainz" style="pointer-events: none;"></span></a>
-            <a href="https://www.last.fm/user/sneexy_is_gay" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" alt="Last.fm"><span class="tabler--brand-lastfm" style="pointer-events: none;"></span></a>
-            <a href="https://git.gay/sneexy" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" alt="Git"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-            <a href="https://github.com/sneexy-boi" style="background-color: color-mix(in srgb, var(--lavender) 25%, transparent); color: var(--lavender);" alt="GitHub"><span class="tabler--brand-github" style="pointer-events: none;"></span></a>
-            <a href="https://archive.org/details/@sneexy" style="background-color: color-mix(in srgb, var(--foreground) 25%, transparent); color: var(--foreground);" alt="Internet Archive"><span class="tabler--building-bank" style="pointer-events: none;"></span></a>
+            <a class="fedi-icon" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--orange) 25%, transparent); color: var(--orange);" aria-label="Fediverse/Mastodon"><span class="tabler--universe" style="pointer-events: none;"></span></a>
+            <a class="fedi-icon-2" href="https://booping.synth.download/@sneexy" style="background-color: color-mix(in srgb, var(--teal) 25%, transparent); color: var(--teal);" aria-label="Fediverse/Mastodon" aria-hidden="true"><span class="tabler--brand-mastodon" style="pointer-events: none;"></span></a>
+            <a href="mailto:&#x73;&#x6e;&#x65;&#x65;&#x78;&#x79;&#x40;&#x73;&#x79;&#x6e;&#x74;&#x68;&#x2e;&#x64;&#x6f;&#x77;&#x6e;&#x6c;&#x6f;&#x61;&#x64;" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Email"><span class="tabler--mail" style="pointer-events: none;"></span></a>
+            <a href="https://listenbrainz.org/user/Sneexy" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="ListenBraniz"><span class="tabler--brand-metabrainz" style="pointer-events: none;"></span></a>
+            <a href="https://www.last.fm/user/sneexy_is_gay" style="background-color: color-mix(in srgb, var(--red) 25%, transparent); color: var(--red);" aria-label="Last.fm"><span class="tabler--brand-lastfm" style="pointer-events: none;"></span></a>
+            <a href="https://git.gay/sneexy" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="Git"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
+            <a href="https://github.com/sneexy-boi" style="background-color: color-mix(in srgb, var(--lavender) 25%, transparent); color: var(--lavender);" aria-label="GitHub"><span class="tabler--brand-github" style="pointer-events: none;"></span></a>
+            <a href="https://archive.org/details/@sneexy" style="background-color: color-mix(in srgb, var(--foreground) 25%, transparent); color: var(--foreground);" aria-label="Internet Archive"><span class="tabler--building-bank" style="pointer-events: none;"></span></a>
         </div>
         <p><span class="tabler--corner-down-right"></span> you may observe my <small>somewhat public</small> fediverse activity below:</p>
-        <iframe src="https://booping.synth.download/embed/user-timeline/9zy33jqk7ljg0001?header=false&maxHeight=800&rounded=false&border=false" data-misskey-embed-id="v1_902c0e81-d9d7-4c03-af0e-a6e71c21e95b" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="border: none; width: 100%; max-width: 500px; height: 300px; color-scheme: light dark;"></iframe>
+        <iframe aria-hidden="true" src="https://booping.synth.download/embed/user-timeline/9zy33jqk7ljg0001?header=false&maxHeight=800&rounded=false&border=false" data-misskey-embed-id="v1_902c0e81-d9d7-4c03-af0e-a6e71c21e95b" loading="lazy" referrerpolicy="strict-origin-when-cross-origin" style="border: none; width: 100%; max-width: 500px; height: 300px; color-scheme: light dark;"></iframe>
     </section>
 </details>
 
@@ -209,20 +207,20 @@
 <!-- webrings and credits -->
 <footer>
     <details open id="footer" class="window">
-        <summary aria-hidden="true">
+        <summary>
             <a href="#footer">footer</a>
         </summary>
 
         <section>
-            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
             <section class="inner-footer">
-                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" alt="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" alt="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
-                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" alt="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
-                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" alt="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
-                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" alt="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
+                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
+                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" aria-label="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
+                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" aria-label="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
+                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" aria-label="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
+                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
             </section>
             <p style="padding-bottom: 14px;"><a href="https://synthspecies.com">Synth species</a> created by <a href="https://www.furaffinity.net/user/vader-san">Vader-San</a>, synth.download is not affiliated with the creator in any way.</p>
             <p>made with <span class="rainbow">love</span>, <span class="rainbow">lack of sleep</span> and <span class="rainbow">procrastination</span></p>
diff --git a/me/ruben/index.html b/me/ruben/index.html
index e712fe0..19ed1d6 100644
--- a/me/ruben/index.html
+++ b/me/ruben/index.html
@@ -27,7 +27,7 @@
 <div class="navbar">
     <a class="nav-base nav-baselink" href="/"><span class="tabler--grid-dots"></span> synth download!</a>
     <details class="nav-base nav-baselink-mobile">
-        <summary><span class="tabler--grid-dots"></span> s <div class="dot" style="background-color: var(--background) !important;"></div> d!</summary>
+        <summary><span class="tabler--grid-dots"></span> s <span aria-hidden="true" class="dot" style="background-color: var(--background) !important;"></span> d!</summary>
         <ul>
             <li>
                 <a href="/"><span class="tabler--home"></span> home</a>
@@ -192,20 +192,20 @@
 <!-- webrings and credits -->
 <footer>
     <details open id="footer" class="window">
-        <summary aria-hidden="true">
+        <summary>
             <a href="#footer">footer</a>
         </summary>
 
         <section>
-            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
-            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" alt="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" alt="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://fediring.net/previous?host=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://fediring.net">Fediring</a> <a href="https://fediring.net/next?host=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://keithhacks.cyou/furryring.php?prev=synth.download" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://keithhacks.cyou/furryring.php">furryring</a> <a href="https://keithhacks.cyou/furryring.php?next=synth.download" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
+            <p class="fediring"><b><a href="https://stellophiliac.github.io/roboring/sneexy/previous" aria-label="Previous"><span class="tabler--arrow-left" style="pointer-events: none;"></span></a> <a href="https://stellophiliac.github.io/roboring">roboring</a> <a href="https://stellophiliac.github.io/roboring/sneexy/next" aria-label="Next"><span class="tabler--arrow-right" style="pointer-events: none;"></span></a></b></p>
             <section class="inner-footer">
-                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" alt="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
-                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" alt="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
-                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" alt="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
-                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" alt="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
-                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" alt="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
+                <a href="https://forged.synth.download/sneexy/pages" style="background-color: color-mix(in srgb, var(--maroon) 25%, transparent); color: var(--maroon);" aria-label="website source!"><span class="tabler--brand-git" style="pointer-events: none;"></span></a>
+                <a href="https://github.com/ayu-theme/ayu-colors" style="background-color: color-mix(in srgb, var(--accent) 25%, transparent); color: var(--accent);" aria-label="Ayu"><span class="tabler--palette" style="pointer-events: none;"></span></svg></a>
+                <a href="https://tabler.io" style="background-color: color-mix(in srgb, var(--blue) 25%, transparent); color: var(--blue);" aria-label="Tabler"><span class="tabler--brand-tabler" style="pointer-events: none;"></span></a>
+                <a href="https://www.jetbrains.com/lp/mono" style="background-color: color-mix(in srgb, var(--green) 25%, transparent); color: var(--green);" aria-label="JetBrains Mono"><span class="tabler--text-size" style="pointer-events: none;"></span></a>
+                <a href="https://www.lexend.com" style="background-color: color-mix(in srgb, var(--sapphire) 25%, transparent); color: var(--sapphire);" aria-label="Lexend"><span class="tabler--letter-case" style="pointer-events: none;"></span></i></a>
             </section>
             <p style="padding-bottom: 14px;"><a href="https://synthspecies.com">Synth species</a> created by <a href="https://www.furaffinity.net/user/vader-san">Vader-San</a>, synth.download is not affiliated with the creator in any way.</p>
             <p>made with <span class="rainbow">love</span>, <span class="rainbow">lack of sleep</span> and <span class="rainbow">procrastination</span></p>
diff --git a/script.js b/script.js
index 556ac3b..bf24b6b 100644
--- a/script.js
+++ b/script.js
@@ -5,10 +5,10 @@
 document.addEventListener("DOMContentLoaded", function () {
     let popup = document.getElementById("alt-popup");
 
-    // add popup to all elements with alt
+    // add popup to all elements with alt or aria-label
     function initializePopups() {
-        // find all elements with alt
-        const elementsWithAlt = document.querySelectorAll("[alt]");
+        // find all elements with alt or aria-label
+        const elementsWithAlt = document.querySelectorAll("[alt], [aria-label]");
 
         // add mouse events to each element
         elementsWithAlt.forEach((element) => {
@@ -19,12 +19,16 @@ document.addEventListener("DOMContentLoaded", function () {
 
     // show popup and position it near the cursor
     function showPopup(event) {
-        // get alt text
+        // get alt text or aria-label
         const altText = event.target.getAttribute("alt");
+        const ariaLabel = event.target.getAttribute("aria-label");
+        
+        // Use alt text if available, otherwise use aria-label
+        const displayText = altText || ariaLabel;
 
-        if (altText) {
-            // use alt text in popup
-            popup.textContent = altText;
+        if (displayText) {
+            // use text in popup
+            popup.textContent = displayText;
 
             // correct popup positioning away from cursor and make it visible
             popup.style.left = event.clientX + 20 + "px";
@@ -48,15 +52,13 @@ document.addEventListener("DOMContentLoaded", function () {
             });
         });
 
+        // Only set up the observer once
         if (document.body) {
             observer.observe(document.body, { childList: true, subtree: true });
         }
     }
 });
 
-// Start observing the document with the configured parameters
-observer.observe(document.body, { childList: true, subtree: true });
-
 // snippet that copies the html for my button(s)
 function copyButtonSneexy() {
     navigator.clipboard.writeText(