my personal website!
meowing.zip
website
okay
+47
-11
+41
-5
about-me.html
+41
-5
about-me.html
···
13
13
type="text/css"
14
14
href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/fill/style.css"
15
15
/>
16
+
<script>
17
+
function copyButton() {
18
+
navigator.clipboard.writeText('<a href="https://meowing.zip"><img src="https://meowing.zip/assets/88x31/button.png" alt="meowing.zip"></a>');
19
+
var x = document.getElementById("copy-toast");
20
+
x.className = "show";
21
+
setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
22
+
}
23
+
document.addEventListener("DOMContentLoaded", function() {
24
+
const t = document.querySelectorAll('input[name="theme"]')
25
+
, i = document.getElementById("disable-bg")
26
+
, o = document.getElementById("disable-animations");
27
+
function a() {
28
+
const t = document.querySelector('input[name="theme"]:checked').value;
29
+
localStorage.setItem("theme", t),
30
+
localStorage.setItem("disable-bg", i.checked),
31
+
localStorage.setItem("disable-animations", o.checked)
32
+
}
33
+
!function() {
34
+
const t = localStorage.getItem("theme");
35
+
if (t) {
36
+
const e = document.querySelector(`input[name="theme"][value="${t}"]`);
37
+
e && (e.checked = !0)
38
+
}
39
+
"true" === localStorage.getItem("disable-bg") && (i.checked = !0);
40
+
"true" === localStorage.getItem("disable-animations") && (o.checked = !0)
41
+
}(),
42
+
t.forEach(e => {
43
+
e.addEventListener("change", function() {
44
+
a()
45
+
})
46
+
}
47
+
),
48
+
i.addEventListener("change", a),
49
+
o.addEventListener("change", a)
50
+
});
51
+
</script>
16
52
</head>
17
53
<link rel="stylesheet" href="styles.css">
18
54
</head>
···
26
62
<div class="settings-popup">
27
63
<a style="margin-bottom: 5px; font-size: 12px; color: light-dark(#d20f39, #f38ba8);">settings saved with javascript enabled</a>
28
64
<radio-picker>
29
-
<label><input type="radio" name="theme" id="theme-auto" checked>auto</label>
30
-
<label><input type="radio" name="theme" id="theme-light">light</label>
31
-
<label><input type="radio" name="theme" id="theme-dark">dark</label>
32
-
<label><input type="checkbox" id="disable-bg" name="background">toggle background</label>
33
-
<label><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
65
+
<label for="theme-auto"><input type="radio" name="theme" id="theme-auto" checked>auto</label>
66
+
<label for="theme-light"><input type="radio" name="theme" id="theme-light">light</label>
67
+
<label for="theme-dark"><input type="radio" name="theme" id="theme-dark">dark</label>
68
+
<label for="disable-background"><input type="checkbox" id="disable-bg" name="background">toggle background</label>
69
+
<label for="disable-animations"><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
34
70
</radio-picker>
35
71
</div>
36
72
</div>
+6
-6
index.html
+6
-6
index.html
···
19
19
var x = document.getElementById("copy-toast");
20
20
x.className = "show";
21
21
setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
22
-
},
22
+
}
23
23
document.addEventListener("DOMContentLoaded", function() {
24
24
const t = document.querySelectorAll('input[name="theme"]')
25
25
, i = document.getElementById("disable-bg")
···
61
61
<div class="settings-popup">
62
62
<a style="margin-bottom: 5px; font-size: 12px; color: light-dark(#d20f39, #f38ba8);">settings saved with javascript enabled</a>
63
63
<radio-picker>
64
-
<label><input type="radio" name="theme" id="theme-auto" checked>auto</label>
65
-
<label><input type="radio" name="theme" id="theme-light">light</label>
66
-
<label><input type="radio" name="theme" id="theme-dark">dark</label>
67
-
<label><input type="checkbox" id="disable-bg" name="background">toggle background</label>
68
-
<label><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
64
+
<label for="theme-auto"><input type="radio" name="theme" id="theme-auto" value="auto" checked>auto</label>
65
+
<label for="theme-light"><input type="radio" name="theme" id="theme-light" value="light">light</label>
66
+
<label for="theme-dark"><input type="radio" name="theme" id="theme-dark" value="dark">dark</label>
67
+
<label for="disable-background"><input type="checkbox" id="disable-bg" name="background">toggle background</label>
68
+
<label for="disable-animations"><input type="checkbox" id="disable-animations" name="animations">toggle animations</label>
69
69
</radio-picker>
70
70
</div>
71
71
</div>