diff --git a/about-me.html b/about-me.html
index 2d1e9f6..021ffd1 100644
--- a/about-me.html
+++ b/about-me.html
@@ -13,6 +13,42 @@
     type="text/css"
     href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/fill/style.css"
   />
+  <script>
+      function copyButton() {
+        navigator.clipboard.writeText('<a href="https://meowing.zip"><img src="https://meowing.zip/assets/88x31/button.png" alt="meowing.zip"></a>');
+        var x = document.getElementById("copy-toast");
+        x.className = "show";
+        setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
+      }
+      document.addEventListener("DOMContentLoaded", function() {
+          const t = document.querySelectorAll('input[name="theme"]')
+            , i = document.getElementById("disable-bg")
+            , o = document.getElementById("disable-animations");
+          function a() {
+              const t = document.querySelector('input[name="theme"]:checked').value;
+              localStorage.setItem("theme", t),
+              localStorage.setItem("disable-bg", i.checked),
+              localStorage.setItem("disable-animations", o.checked)
+          }
+          !function() {
+              const t = localStorage.getItem("theme");
+              if (t) {
+                  const e = document.querySelector(`input[name="theme"][value="${t}"]`);
+                  e && (e.checked = !0)
+              }
+              "true" === localStorage.getItem("disable-bg") && (i.checked = !0);
+              "true" === localStorage.getItem("disable-animations") && (o.checked = !0)
+          }(),
+          t.forEach(e => {
+              e.addEventListener("change", function() {
+                  a()
+              })
+          }
+          ),
+          i.addEventListener("change", a),
+          o.addEventListener("change", a)
+   	});
+	</script>
 </head>
 <link rel="stylesheet" href="styles.css">
 </head>
@@ -26,11 +62,11 @@
 		 	<div class="settings-popup">
 				<a style="margin-bottom: 5px; font-size: 12px; color: light-dark(#d20f39, #f38ba8);">settings saved with javascript enabled</a>
 				<radio-picker>
-					<label><input type="radio" name="theme" id="theme-auto" checked>auto</label>
-					<label><input type="radio" name="theme" id="theme-light">light</label>
-					<label><input type="radio" name="theme" id="theme-dark">dark</label>
-					<label><input type="checkbox" id="disable-bg" name="background">toggle background</label>
-					<label><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
+					<label for="theme-auto"><input type="radio" name="theme" id="theme-auto" checked>auto</label>
+					<label for="theme-light"><input type="radio" name="theme" id="theme-light">light</label>
+					<label for="theme-dark"><input type="radio" name="theme" id="theme-dark">dark</label>
+					<label for="disable-background"><input type="checkbox" id="disable-bg" name="background">toggle background</label>
+					<label for="disable-animations"><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
 				</radio-picker>
 			</div>
 		</div>
diff --git a/index.html b/index.html
index 77d835c..14cc4a3 100644
--- a/index.html
+++ b/index.html
@@ -19,7 +19,7 @@
 	  var x = document.getElementById("copy-toast");
 	  x.className = "show";
 	  setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
-	},
+	}
 	document.addEventListener("DOMContentLoaded", function() {
 	    const t = document.querySelectorAll('input[name="theme"]')
 	      , i = document.getElementById("disable-bg")
@@ -61,11 +61,11 @@
 		   <div class="settings-popup">
 		   		<a style="margin-bottom: 5px; font-size: 12px; color: light-dark(#d20f39, #f38ba8);">settings saved with javascript enabled</a>
 				<radio-picker>
-					  <label><input type="radio" name="theme" id="theme-auto" checked>auto</label>
-					  <label><input type="radio" name="theme" id="theme-light">light</label>
-					  <label><input type="radio" name="theme" id="theme-dark">dark</label>
-					  <label><input type="checkbox" id="disable-bg" name="background">toggle background</label>
-					  <label><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
+					  <label for="theme-auto"><input type="radio" name="theme" id="theme-auto" value="auto" checked>auto</label>
+					  <label for="theme-light"><input type="radio" name="theme" id="theme-light" value="light">light</label>
+					  <label for="theme-dark"><input type="radio" name="theme" id="theme-dark" value="dark">dark</label>
+					  <label for="disable-background"><input type="checkbox" id="disable-bg" name="background">toggle background</label>
+					  <label for="disable-animations"><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
 				</radio-picker>
 		   </div>
 		</div>