my personal website!
meowing.zip
website
decided to remove the about me and just put it in the main page instead
-154
-154
about-me.html
-154
about-me.html
···
1
-
<!DOCTYPE html>
2
-
<html>
3
-
<head>
4
-
<title>about me! - gayfamicom's cool and awesome website</title>
5
-
<link rel="icon" type="image/x-icon" href="./assets/images/favicon.png">
6
-
<link
7
-
rel="stylesheet"
8
-
type="text/css"
9
-
href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css"
10
-
/>
11
-
<link
12
-
rel="stylesheet"
13
-
type="text/css"
14
-
href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/fill/style.css"
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>
52
-
</head>
53
-
<link rel="stylesheet" href="styles.css">
54
-
</head>
55
-
<footer>
56
-
<div style="display: flex;">
57
-
<a href="./fursona.html"><img class="pfp" src="./assets/images/pfp.jpg" alt="my fursona. a cat (sometimes fops) thing that wears a mask"></a>
58
-
<a style=" padding: 20px; margin-right: 54%;">about me!<small style="color: var(--subtext); margin-left: 10px; font-size: 12px;">niko's cool and awesome website!~</small></a>
59
-
<div class="dropdown" style="display: inline-block;" tabindex="1">
60
-
<i class="db2" tabindex="1"></i>
61
-
<a style="font-size: 14px;" class="dropbtn"><i style="margin-right: 5px;" class="ph ph-gear"></i>settings</a>
62
-
<div class="settings-popup">
63
-
<a style="margin-bottom: 5px; font-size: 12px; color: light-dark(#d20f39, #f38ba8);">settings saved with javascript enabled</a>
64
-
<radio-picker>
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>
70
-
</radio-picker>
71
-
</div>
72
-
</div>
73
-
</div>
74
-
<div class="divider"></div>
75
-
<div style="font-size: 15px; margin-top: 20px; margin-left: 2px; margin-bottom: 10px; display: flex;">
76
-
<div class="dropdown">
77
-
<a href="." class="dropbtn">< go back!</a>
78
-
</div>
79
-
<div class="dropdown" tabindex="1">
80
-
<a style="margin-left: 5px;" class="dropbtn" href="./blog.html"><i style="margin-right: 5px;" class="ph ph-pen"></i>blog</a>
81
-
</div>
82
-
<div class="dropdown" tabindex="1">
83
-
<i class="db2" tabindex="1"></i>
84
-
<a style="margin-left: 5px;" class="dropbtn"><i style="margin-right: 5px;" class="ph ph-at"></i>follow me on socials</a>
85
-
<div class="dropdown-content">
86
-
<a style="color: light-dark(#1e66f5, #89b4fa); border: 0px soild transparent; border-radius: 20px;" href="https://bsky.app/profile/did:plc:yt66ucfex7kgaifhu5qijrz3" target="_blank">bluesky</a>
87
-
<a style="color: light-dark(#40a02b, #94e2d5); border: 0px soild transparent; border-radius: 20px;" rel="me" href="https://merping.synth.download/@meowmaxing" target="_blank">fediverse</a>
88
-
<a style="color: light-dark(#d20f39, #89b4fa); border: 0px soild transparent; border-radius: 20px;" href="https://youtube.com/@meowingmaxing" target="_blank">youtube</a>
89
-
</div>
90
-
</div>
91
-
<div class="dropdown" tabindex="1">
92
-
<i class="db2" tabindex="1"></i>
93
-
<a style="margin-left: 5px;" class="dropbtn"><i style="margin-right: 5px;" class="ph ph-user-plus"></i>add me!</a>
94
-
<div class="dropdown-content">
95
-
<a style="color: light-dark(#04a5e5, #89dceb); border: 0px soild transparent; border-radius: 20px;" href="https://steamcommunity.com/id/meowmaxing" target="_blank">steam</a>
96
-
</div>
97
-
</div>
98
-
<div class="dropdown" tabindex="1">
99
-
<i class="db2" tabindex="1"></i>
100
-
<a style="margin-left: 5px;" class="dropbtn"><i style="margin-right: 5px;" class="ph ph-chat-circle-dots"></i>contact info</a>
101
-
<div class="dropdown-content">
102
-
<a style="color: light-dark(#1e66f5, #89b4fa); border: 0px soild transparent; border-radius: 20px;" href="https://signal.me/#eu/2G_wkky5wzpLc8dGMMJZADmtQfS0v_hUHrPxyZ8C0-2dAsNSi0BBcq9gRoNB1bTw" target="_blank">signal</a>
103
-
<a style="color: light-dark(#40a02b, #94e2d5); border: 0px soild transparent; border-radius: 20px;" href="xmpp:niko@meowing.zip">xmpp</a>
104
-
<a style="color: light-dark(#7287fd, #b4befe); border: 0px soild transparent; border-radius: 20px;" href="https://discord.com/users/752389000945467482" target="_blank">discord</a>
105
-
<a style="color: light-dark(#e64553, #eba0ac); border: 0px soild transparent; border-radius: 20px;" href="mailto:niko@meowing.zip">email</a>
106
-
</div>
107
-
</div>
108
-
<a style="margin-left: 15px; font-size: 12px; color: var(--subtext);"><i style="margin-right: 5px;" class="ph ph-image"></i>gallery (under construction)</a>
109
-
<a style="margin-left: 15px; font-size: 12px; color: var(--subtext);"><i style="margin-right: 5px;" class="ph ph-pen"></i>guestbook (under construction)</a>
110
-
</div>
111
-
</footer>
112
-
<body>
113
-
<bg-gradient aria-hidden="true"></bg-gradient>
114
-
<bg aria-hidden="true"></bg>
115
-
<div class="main">
116
-
<h3><i style="margin-right: 10px;" class="ph ph-info"></i>who am i?</h3>
117
-
<div class="divider"></div>
118
-
<div class="about">
119
-
<a style="font-size: 13px;">
120
-
hiiii!! my name is Niko, this is my lil corner of the web <small style="font-size: 10px;">(waow)</small>!<br><br>
121
-
im a biromantic, asexual, genderfluid individual who likes computer-adjecent things and i also like to do video editing and VFX stuff <small style="font-size: 10px;">(every once in a blue moon)</small> !!
122
-
<br><br><a style="margin-top: 20px; color: light-dark(#d20f39, #f38ba8); font-size: 15px;">im autistic as Fuck!!! so communication *might* be hard, please keep that in mind if u ever choose to talk to me, its not that i dont care!!</a>
123
-
</a>
124
-
</div>
125
-
<div style="margin-top: 5px;" class="pronouns-box">
126
-
<h3 style="margin-top: 5px; font-size: 15px;"><i style="margin-right: 10px;" class="ph ph-info"></i>pronouns</h3>
127
-
<div class="divider"></div>
128
-
<a><i class="ph ph-heart" style="color: light-dark(#ea76cb, #f5c2e7);"></i> it/its<br><i style="color: light-dark(#04a5e5, #89dceb);" class="ph ph-thumbs-up"></i> they/them<br><i style="color: light-dark(#df8e1d, #f9e2af);" class="ph ph-smiley-meh"></i> she/her<br><i style="margin-right: 5px; color: light-dark(#d20f39, #f38ba8);" class="ph ph-x-circle"></i>he/him<br></a>
129
-
</div>
130
-
</div>
131
-
</div>
132
-
<div class="main">
133
-
<h3>what do u use for video editing?</h3>
134
-
<div class="divider"></div>
135
-
<a style="color: light-dark(#7287fd, #b4befe); font-size: 13px;">
136
-
adobe premiere pro (SORRY)
137
-
</a>
138
-
<a>-</a>
139
-
<a style="color: light-dark(#7287fd, #b4befe); font-size: 13px;">
140
-
adobe after effects (SORRY)
141
-
</a>
142
-
<a>-</a>
143
-
<a style="color: light-dark(#1e66f5, #89b4fa); font-size: 13px;">
144
-
adobe photoshop (SORRY)
145
-
</a>
146
-
<div class="divider"></div>
147
-
<h3>what about audio stuff?</h3>
148
-
<div class="divider"></div>
149
-
<a style="color: light-dark(#40a02b, #a6e3a1); font-size: 13px;">just reaper...</a>
150
-
</div>
151
-
<a style="color: var(--accent); padding: 10px;" href="https://git.gay/gayfamicom/website"><small>website source!</small></a>
152
-
<a style="color: var(--accent); padding: 10px;"><small>last modified: 2026-04-18T01:03:26Z</small></a>
153
-
</body>
154
-
</html>