From fcd2c869cf645b8afecafc92b40fb0fa923c53bf Mon Sep 17 00:00:00 2001
From: Jordan Herzstein <jordanherzstein@gmail.com>
Date: Wed, 22 May 2024 21:36:05 -0400
Subject: [PATCH] auto updating site

---
 public/404.html                               | 62 ++++++++++++++++--
 public/about/index.html                       | 62 ++++++++++++++++--
 public/categories/index.html                  | 62 ++++++++++++++++--
 public/contact/index.html                     | 62 ++++++++++++++++--
 public/css/style.css                          |  6 ++
 public/index.html                             | 62 ++++++++++++++++--
 public/js/themes.js                           | 65 +++++++++++++++++++
 public/mysetup/index.html                     | 62 ++++++++++++++++--
 public/posts/adb_vanadium/index.html          | 62 ++++++++++++++++--
 public/posts/caps2esc/index.html              | 62 ++++++++++++++++--
 public/posts/eclipse_2024/index.html          | 62 ++++++++++++++++--
 public/posts/eclipse_2024_part2/index.html    | 62 ++++++++++++++++--
 public/posts/index.html                       | 62 ++++++++++++++++--
 .../index.html                                | 62 ++++++++++++++++--
 public/posts/new_domain/index.html            | 62 ++++++++++++++++--
 public/posts/nyaa_menu/index.html             | 62 ++++++++++++++++--
 public/posts/skiffdead/index.html             | 62 ++++++++++++++++--
 public/posts/summer_2023_projects/index.html  | 62 ++++++++++++++++--
 public/posts/thingstocome/index.html          | 62 ++++++++++++++++--
 public/tags/adb/index.html                    | 62 ++++++++++++++++--
 public/tags/android/index.html                | 62 ++++++++++++++++--
 public/tags/anime/index.html                  | 62 ++++++++++++++++--
 public/tags/clown-moment/index.html           | 62 ++++++++++++++++--
 public/tags/daylight-savings/index.html       | 62 ++++++++++++++++--
 public/tags/dns/index.html                    | 62 ++++++++++++++++--
 public/tags/eclipse/index.html                | 62 ++++++++++++++++--
 public/tags/emacs/index.html                  | 62 ++++++++++++++++--
 public/tags/email/index.html                  | 62 ++++++++++++++++--
 public/tags/github/index.html                 | 62 ++++++++++++++++--
 public/tags/grapheneos/index.html             | 62 ++++++++++++++++--
 public/tags/hugo/index.html                   | 62 ++++++++++++++++--
 public/tags/index.html                        | 62 ++++++++++++++++--
 public/tags/manga/index.html                  | 62 ++++++++++++++++--
 public/tags/namecheap/index.html              | 62 ++++++++++++++++--
 public/tags/openwrt/index.html                | 62 ++++++++++++++++--
 public/tags/personal/index.html               | 62 ++++++++++++++++--
 public/tags/porkbun/index.html                | 62 ++++++++++++++++--
 public/tags/projects/index.html               | 62 ++++++++++++++++--
 public/tags/proton/index.html                 | 62 ++++++++++++++++--
 public/tags/qubes-os/index.html               | 62 ++++++++++++++++--
 public/tags/skiff/index.html                  | 62 ++++++++++++++++--
 public/tags/switch/index.html                 | 62 ++++++++++++++++--
 public/tags/technology/index.html             | 62 ++++++++++++++++--
 public/tags/themes/index.html                 | 62 ++++++++++++++++--
 public/tags/tutorial/index.html               | 62 ++++++++++++++++--
 public/tags/updates/index.html                | 62 ++++++++++++++++--
 public/tags/x11/index.html                    | 62 ++++++++++++++++--
 themes/jugo/layouts/partials/footer.html      |  8 ++-
 themes/jugo/layouts/partials/head.html        | 34 +++++++++-
 themes/jugo/layouts/partials/header.html      | 19 ++++++
 themes/jugo/static/css/style.css              |  6 ++
 themes/jugo/static/js/themes.js               | 65 +++++++++++++++++++
 52 files changed, 2720 insertions(+), 273 deletions(-)
 create mode 100644 public/js/themes.js
 create mode 100644 themes/jugo/static/js/themes.js

diff --git a/public/404.html b/public/404.html
index 11661c8..9e23181 100644
--- a/public/404.html
+++ b/public/404.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -73,10 +122,11 @@ <h1 id="title">Error</h1>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/about/index.html b/public/about/index.html
index 5f470d9..3d0cc5e 100644
--- a/public/about/index.html
+++ b/public/about/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -78,10 +127,11 @@ <h1 id="about">About</h2>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/categories/index.html b/public/categories/index.html
index 599d7b0..eb8c38c 100644
--- a/public/categories/index.html
+++ b/public/categories/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -71,10 +120,11 @@ <h1>Categories</h1>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/contact/index.html b/public/contact/index.html
index e593254..9cd62c4 100644
--- a/public/contact/index.html
+++ b/public/contact/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -161,10 +210,11 @@ <h2 id="img-class-inline-header-src-images-contact-protonmail-dot-png-email-cont
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/css/style.css b/public/css/style.css
index da0bd4a..bbba97b 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -110,6 +110,12 @@ h1 {
     font-size: 2.3em;
     text-align:center;
 }
+
+#toggle-theme {
+    display:inline-block;
+    text-align:center;
+}
+
 h2 {
     line-height: 1.2;
     color:var(--color-h2);
diff --git a/public/index.html b/public/index.html
index f620f38..acc4d9d 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5,9 +5,39 @@
     <head>
 	<meta name="generator" content="Hugo 0.111.3"><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -21,19 +51,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -219,10 +268,11 @@ <h3>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/js/themes.js b/public/js/themes.js
new file mode 100644
index 0000000..c9b0ed6
--- /dev/null
+++ b/public/js/themes.js
@@ -0,0 +1,65 @@
+/*
+
+How to handle dark mode with CSS and JavaScript? (with SVG toggle button)
+
+Tutorial: https://youtu.be/GUSUA72t7p0
+
+Follow me on 𝕏 for more: https://twitter.com/HunorBorbely
+
+*/
+
+const lightIcon = document.getElementById("light-icon");
+const darkIcon = document.getElementById("dark-icon");
+
+// Check if dark mode is preferred
+const darkModeMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+
+// Get dark-mode from localStorage or use the value from the media query
+let darkMode = localStorage.getItem("dark-mode") ?? darkModeMediaQuery.matches;
+
+// Set dark-mode class on body if darkMode is true and set icon
+if (darkMode) {
+  document.body.classList.add("dark-mode");
+  darkIcon.setAttribute("display", "none");
+} else {
+  lightIcon.setAttribute("display", "none");
+}
+
+// Update on OS dark mode change
+darkModeMediaQuery.addEventListener("change", (e) => {
+  if (e.matches) {
+    darkMode = true;
+  } else {
+    darkMode = false;
+  }
+  document.body.classList.toggle("dark-mode");
+
+  if (darkMode) {
+    lightIcon.setAttribute("display", "block");
+    darkIcon.setAttribute("display", "none");
+  } else {
+    lightIcon.setAttribute("display", "none");
+    darkIcon.setAttribute("display", "block");
+  }
+});
+
+// Toggle dark mode on button click
+function toggleDarkMode() {
+  // Toggle darkMode variable
+  darkMode = !darkMode;
+
+  // Store darkMode variable in localStorage
+  localStorage.setItem("dark-mode", darkMode);
+
+  // Toggle dark-mode class on body
+  document.body.classList.toggle("dark-mode");
+
+  // Toggle light and dark icons
+  if (darkMode) {
+    lightIcon.setAttribute("display", "block");
+    darkIcon.setAttribute("display", "none");
+  } else {
+    lightIcon.setAttribute("display", "none");
+    darkIcon.setAttribute("display", "block");
+  }
+}
diff --git a/public/mysetup/index.html b/public/mysetup/index.html
index d6a4d51..53ae687 100644
--- a/public/mysetup/index.html
+++ b/public/mysetup/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -86,10 +135,11 @@ <h2 id="software">Software</h2>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/adb_vanadium/index.html b/public/posts/adb_vanadium/index.html
index 5774576..8790ba2 100644
--- a/public/posts/adb_vanadium/index.html
+++ b/public/posts/adb_vanadium/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -218,10 +267,11 @@ <h2 id="references">References</h2>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/caps2esc/index.html b/public/posts/caps2esc/index.html
index 41d3ac4..0d8e79b 100644
--- a/public/posts/caps2esc/index.html
+++ b/public/posts/caps2esc/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -146,10 +195,11 @@ <h2 id="references">References</h2>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/eclipse_2024/index.html b/public/posts/eclipse_2024/index.html
index 7f67402..17c9bb5 100644
--- a/public/posts/eclipse_2024/index.html
+++ b/public/posts/eclipse_2024/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -116,10 +165,11 @@ <h2 id="a-note-about-eclipse-glasses">A note about eclipse glasses</h2>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/eclipse_2024_part2/index.html b/public/posts/eclipse_2024_part2/index.html
index a9acf74..22717a1 100644
--- a/public/posts/eclipse_2024_part2/index.html
+++ b/public/posts/eclipse_2024_part2/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -94,10 +143,11 @@ <h1>Eclipse Sun Worm</h1>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/index.html b/public/posts/index.html
index deaf47d..edc58c4 100644
--- a/public/posts/index.html
+++ b/public/posts/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -389,10 +438,11 @@ <h3>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/light_theme_plus_i_hate_daylight_savings/index.html b/public/posts/light_theme_plus_i_hate_daylight_savings/index.html
index 4216926..29a98c5 100644
--- a/public/posts/light_theme_plus_i_hate_daylight_savings/index.html
+++ b/public/posts/light_theme_plus_i_hate_daylight_savings/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -113,10 +162,11 @@ <h2 id="references">References</h2>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/new_domain/index.html b/public/posts/new_domain/index.html
index f09058a..34517de 100644
--- a/public/posts/new_domain/index.html
+++ b/public/posts/new_domain/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -149,10 +198,11 @@ <h2 id="why-i-ended-my-frienship-with-namecheap">Why I ended my frienship with N
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/nyaa_menu/index.html b/public/posts/nyaa_menu/index.html
index ecc8c0d..5706a93 100644
--- a/public/posts/nyaa_menu/index.html
+++ b/public/posts/nyaa_menu/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -101,10 +150,11 @@ <h1>nyaa_menu</h1>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/skiffdead/index.html b/public/posts/skiffdead/index.html
index 703f0d9..282d022 100644
--- a/public/posts/skiffdead/index.html
+++ b/public/posts/skiffdead/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -110,10 +159,11 @@ <h1>Skiff is Dead 🤡</h1>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/summer_2023_projects/index.html b/public/posts/summer_2023_projects/index.html
index 97221bf..8f59451 100644
--- a/public/posts/summer_2023_projects/index.html
+++ b/public/posts/summer_2023_projects/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -165,10 +214,11 @@ <h2 id="references">References</h2>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/posts/thingstocome/index.html b/public/posts/thingstocome/index.html
index d40216b..abba213 100644
--- a/public/posts/thingstocome/index.html
+++ b/public/posts/thingstocome/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -92,10 +141,11 @@ <h1>Hugo and other site changes</h1>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/adb/index.html b/public/tags/adb/index.html
index 95368f8..05e800d 100644
--- a/public/tags/adb/index.html
+++ b/public/tags/adb/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/android/index.html b/public/tags/android/index.html
index aaa3a2d..8bd1b1f 100644
--- a/public/tags/android/index.html
+++ b/public/tags/android/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/anime/index.html b/public/tags/anime/index.html
index 8bfab7d..d62d05f 100644
--- a/public/tags/anime/index.html
+++ b/public/tags/anime/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -108,10 +157,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/clown-moment/index.html b/public/tags/clown-moment/index.html
index c8ac813..5cfa557 100644
--- a/public/tags/clown-moment/index.html
+++ b/public/tags/clown-moment/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/daylight-savings/index.html b/public/tags/daylight-savings/index.html
index 638258c..e168359 100644
--- a/public/tags/daylight-savings/index.html
+++ b/public/tags/daylight-savings/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -105,10 +154,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/dns/index.html b/public/tags/dns/index.html
index e13edb6..e76eed5 100644
--- a/public/tags/dns/index.html
+++ b/public/tags/dns/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -112,10 +161,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/eclipse/index.html b/public/tags/eclipse/index.html
index 236d88f..a8c142f 100644
--- a/public/tags/eclipse/index.html
+++ b/public/tags/eclipse/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -122,10 +171,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/emacs/index.html b/public/tags/emacs/index.html
index 0c6d056..cc0942d 100644
--- a/public/tags/emacs/index.html
+++ b/public/tags/emacs/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -108,10 +157,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/email/index.html b/public/tags/email/index.html
index 0f217e0..ef27a37 100644
--- a/public/tags/email/index.html
+++ b/public/tags/email/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -147,10 +196,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/github/index.html b/public/tags/github/index.html
index 52c84aa..4cb178e 100644
--- a/public/tags/github/index.html
+++ b/public/tags/github/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -105,10 +154,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/grapheneos/index.html b/public/tags/grapheneos/index.html
index 94b7c9b..84d738c 100644
--- a/public/tags/grapheneos/index.html
+++ b/public/tags/grapheneos/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/hugo/index.html b/public/tags/hugo/index.html
index dbec02f..0a9b649 100644
--- a/public/tags/hugo/index.html
+++ b/public/tags/hugo/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -105,10 +154,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/index.html b/public/tags/index.html
index a95a0b1..b12f946 100644
--- a/public/tags/index.html
+++ b/public/tags/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -98,10 +147,11 @@ <h1>Tags</h1>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/manga/index.html b/public/tags/manga/index.html
index 2bae69e..3352f35 100644
--- a/public/tags/manga/index.html
+++ b/public/tags/manga/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -108,10 +157,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/namecheap/index.html b/public/tags/namecheap/index.html
index 48f65ed..f0d4595 100644
--- a/public/tags/namecheap/index.html
+++ b/public/tags/namecheap/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -112,10 +161,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/openwrt/index.html b/public/tags/openwrt/index.html
index 9892ae6..83940ff 100644
--- a/public/tags/openwrt/index.html
+++ b/public/tags/openwrt/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/personal/index.html b/public/tags/personal/index.html
index 8d047ef..08c688b 100644
--- a/public/tags/personal/index.html
+++ b/public/tags/personal/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/porkbun/index.html b/public/tags/porkbun/index.html
index ab8be2f..86d8601 100644
--- a/public/tags/porkbun/index.html
+++ b/public/tags/porkbun/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -112,10 +161,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/projects/index.html b/public/tags/projects/index.html
index dc34052..89e0e7b 100644
--- a/public/tags/projects/index.html
+++ b/public/tags/projects/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -108,10 +157,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/proton/index.html b/public/tags/proton/index.html
index 6d65ab3..54fe982 100644
--- a/public/tags/proton/index.html
+++ b/public/tags/proton/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/qubes-os/index.html b/public/tags/qubes-os/index.html
index 3d4bbb6..eb38e6b 100644
--- a/public/tags/qubes-os/index.html
+++ b/public/tags/qubes-os/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/skiff/index.html b/public/tags/skiff/index.html
index 2fc26a1..ce54331 100644
--- a/public/tags/skiff/index.html
+++ b/public/tags/skiff/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/switch/index.html b/public/tags/switch/index.html
index 7ed07a0..f45b839 100644
--- a/public/tags/switch/index.html
+++ b/public/tags/switch/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -111,10 +160,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/technology/index.html b/public/tags/technology/index.html
index b16d338..460f63d 100644
--- a/public/tags/technology/index.html
+++ b/public/tags/technology/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -281,10 +330,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/themes/index.html b/public/tags/themes/index.html
index 532b805..06c8b5e 100644
--- a/public/tags/themes/index.html
+++ b/public/tags/themes/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -105,10 +154,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/tutorial/index.html b/public/tags/tutorial/index.html
index b95dad6..9faed8b 100644
--- a/public/tags/tutorial/index.html
+++ b/public/tags/tutorial/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -143,10 +192,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/updates/index.html b/public/tags/updates/index.html
index a782c79..fbc66cc 100644
--- a/public/tags/updates/index.html
+++ b/public/tags/updates/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -134,10 +183,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/public/tags/x11/index.html b/public/tags/x11/index.html
index b90b98f..47062a7 100644
--- a/public/tags/x11/index.html
+++ b/public/tags/x11/index.html
@@ -4,9 +4,39 @@
     
     <head><meta charset="UTF-8">
   
-<h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-hidden="true" class="bi bi-circle-halfbi bi-circle-half hi-svg-inline" fill="currentColor" height="0.8em" viewBox="0 0 16 16" width="0.8em" xmlns="http://www.w3.org/2000/svg">
-  <path d="M8 15A7 7 0 1 0 8 1zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16"/>
-</svg></a></h1><title>Jordan Herzstein</title> 
+<h1 id="title">Jordan Herzstein <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+ </a></h1><title>Jordan Herzstein</title> 
 </head>
     <header><div class="menubar">
   <div class="menu-container">
@@ -20,19 +50,38 @@ <h1>Jordan Herzstein <a onclick="switchTheme()" title="toggle theme"> <svg aria-
       -
       <a href="/contact">contact</a>
       
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       
@@ -108,10 +157,11 @@ <h4>
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
+
     <span class="link-buttons">
-      <a href="https://sadgrl.online">
-        <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/themes/jugo/layouts/partials/footer.html b/themes/jugo/layouts/partials/footer.html
index 1907156..1e2c077 100644
--- a/themes/jugo/layouts/partials/footer.html
+++ b/themes/jugo/layouts/partials/footer.html
@@ -12,10 +12,14 @@
       <a href="https://libreboot.org">
         <img src="/images/link-buttons/libreboot.gif"></a>
     </span>
-    <span class="link-buttons">
+<!--    <span class="link-buttons">
       <a href="https://sadgrl.online">
         <img src="/images/link-buttons/sadgrl.gif"></a>
-    </span>
+    </span> -->
+    <span class="link-buttons">
+      <a href="https://www.gnu.org/software/emacs/">
+        <img src="/images/link-buttons/gnu-emacs.gif"></a>
+    </span> 
     <span class="link-buttons">
       <a href="https://creativecommons.org/licenses/by-sa/4.0/">
         <img src="/images/link-buttons/by-sa.png"></a>
diff --git a/themes/jugo/layouts/partials/head.html b/themes/jugo/layouts/partials/head.html
index f7872ad..73e6e20 100644
--- a/themes/jugo/layouts/partials/head.html
+++ b/themes/jugo/layouts/partials/head.html
@@ -4,4 +4,36 @@
 "name" "circle-half"
 "size" "0.8em"
 }}  
-<h1>{{ .Site.Title }} <a onclick="switchTheme()" title="toggle theme"> {{ partial "icons/icon" $context }}</a></h1><title>{{.Site.Title}}</title> 
+<h1 id="title">{{ .Site.Title }} <a onclick="switchTheme()" title="toggle theme" id="toggle-theme">
+      <svg width="30" height="30" id="light-icon">
+        <circle cx="15" cy="15" r="6" fill="currentColor" />
+
+        <line
+          id="ray"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          x1="15"
+          y1="1"
+          x2="15"
+          y2="4"
+        ></line>
+
+        <use href="#ray" transform="rotate(45 15 15)" />
+        <use href="#ray" transform="rotate(90 15 15)" />
+        <use href="#ray" transform="rotate(135 15 15)" />
+        <use href="#ray" transform="rotate(180 15 15)" />
+        <use href="#ray" transform="rotate(225 15 15)" />
+        <use href="#ray" transform="rotate(270 15 15)" />
+        <use href="#ray" transform="rotate(315 15 15)" />
+      </svg>
+      <svg width="30" height="30" id="dark-icon">
+        <path
+          fill="currentColor"
+          d="
+          M 23, 5
+          A 12 12 0 1 0 23, 25
+          A 12 12 0 0 1 23, 5"
+        />
+      </svg>
+<!--    {{ partial "icons/icon" $context }} --> </a></h1><title>{{.Site.Title}}</title> 
diff --git a/themes/jugo/layouts/partials/header.html b/themes/jugo/layouts/partials/header.html
index c2c3518..a262c88 100644
--- a/themes/jugo/layouts/partials/header.html
+++ b/themes/jugo/layouts/partials/header.html
@@ -11,19 +11,38 @@
       <a href="/contact">contact</a>
       <!-- -
       <a onclick="switchTheme()">theme</a> -->
+<script>
+</script>
       <script>
+	const lightIcon = document.getElementById("light-icon");
+	const darkIcon = document.getElementById("dark-icon");
+
 	var i = "theme"
 	var m = (localStorage.getItem(i) || "dark")
 	var d = document.documentElement.classList
 	if (m == "light") {
     	    d.remove("dark")
     	    d.add(m)
+	    lightIcon.setAttribute("display", "none");
+	    darkIcon.setAttribute("display", "block");
+	} else {
+	    lightIcon.setAttribute("display", "block");
+	    darkIcon.setAttribute("display", "none");
+
 	}
+	 
 	function switchTheme() {
     	    d.remove(m)
     	    m = (m == "dark") ? "light" : "dark"
     	    d.add(m)
     	    localStorage.setItem(i, m)
+	    if (m == "light") {
+		lightIcon.setAttribute("display", "none");
+		darkIcon.setAttribute("display", "block");
+	    } else {
+		lightIcon.setAttribute("display", "block");
+		darkIcon.setAttribute("display", "none");
+	    }
 	}
       </script>
       <!--{{ range .Site.Menus.main }}
diff --git a/themes/jugo/static/css/style.css b/themes/jugo/static/css/style.css
index da0bd4a..bbba97b 100644
--- a/themes/jugo/static/css/style.css
+++ b/themes/jugo/static/css/style.css
@@ -110,6 +110,12 @@ h1 {
     font-size: 2.3em;
     text-align:center;
 }
+
+#toggle-theme {
+    display:inline-block;
+    text-align:center;
+}
+
 h2 {
     line-height: 1.2;
     color:var(--color-h2);
diff --git a/themes/jugo/static/js/themes.js b/themes/jugo/static/js/themes.js
new file mode 100644
index 0000000..c9b0ed6
--- /dev/null
+++ b/themes/jugo/static/js/themes.js
@@ -0,0 +1,65 @@
+/*
+
+How to handle dark mode with CSS and JavaScript? (with SVG toggle button)
+
+Tutorial: https://youtu.be/GUSUA72t7p0
+
+Follow me on 𝕏 for more: https://twitter.com/HunorBorbely
+
+*/
+
+const lightIcon = document.getElementById("light-icon");
+const darkIcon = document.getElementById("dark-icon");
+
+// Check if dark mode is preferred
+const darkModeMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+
+// Get dark-mode from localStorage or use the value from the media query
+let darkMode = localStorage.getItem("dark-mode") ?? darkModeMediaQuery.matches;
+
+// Set dark-mode class on body if darkMode is true and set icon
+if (darkMode) {
+  document.body.classList.add("dark-mode");
+  darkIcon.setAttribute("display", "none");
+} else {
+  lightIcon.setAttribute("display", "none");
+}
+
+// Update on OS dark mode change
+darkModeMediaQuery.addEventListener("change", (e) => {
+  if (e.matches) {
+    darkMode = true;
+  } else {
+    darkMode = false;
+  }
+  document.body.classList.toggle("dark-mode");
+
+  if (darkMode) {
+    lightIcon.setAttribute("display", "block");
+    darkIcon.setAttribute("display", "none");
+  } else {
+    lightIcon.setAttribute("display", "none");
+    darkIcon.setAttribute("display", "block");
+  }
+});
+
+// Toggle dark mode on button click
+function toggleDarkMode() {
+  // Toggle darkMode variable
+  darkMode = !darkMode;
+
+  // Store darkMode variable in localStorage
+  localStorage.setItem("dark-mode", darkMode);
+
+  // Toggle dark-mode class on body
+  document.body.classList.toggle("dark-mode");
+
+  // Toggle light and dark icons
+  if (darkMode) {
+    lightIcon.setAttribute("display", "block");
+    darkIcon.setAttribute("display", "none");
+  } else {
+    lightIcon.setAttribute("display", "none");
+    darkIcon.setAttribute("display", "block");
+  }
+}