my personal website!
meowing.zip
website
forgot some stuff
+22
-25
+1
-4
about-me.html
+1
-4
about-me.html
···
17
17
<a href="." class="dropbtn">< go back!</a>
18
18
</div>
19
19
<div class="dropdown" tabindex="1">
20
-
<a style="margin-left: 5px;" class="dropbtn" href="./guestbook.html">guestbook</a>
21
-
</div>
22
-
<div class="dropdown" tabindex="1">
23
20
<a style="margin-left: 5px;" class="dropbtn" href="./blog.html">blog</a>
24
21
</div>
25
22
<div class="dropdown" tabindex="1">
···
85
82
<a style="color: light-dark(#40a02b, #a6e3a1); font-size: 13px;">just reaper...</a>
86
83
</div>
87
84
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;" href="https://tangled.org/gayfamicom.lol/site"><small>website source!</small></a>
88
-
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;"><small>last modified: 2026-03-24T00:24:23Z</small></a>
85
+
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;"><small>last modified: 2026-03-24T04:36:46Z</small></a>
89
86
</body>
90
87
</html>
+14
-14
guestbook.html
+14
-14
guestbook.html
···
7
7
<link rel="stylesheet" href="styles.css">
8
8
<footer>
9
9
<div style="display: flex;">
10
-
<img style="border-radius: 15px; border: 2px solid #ca9ee6; width: 70px; height: auto" src="./assets/images/pfp.jpg" alt="fursona">
11
-
<a style=" padding: 20px; text-align: center">sign my guestbook<small style="color: #9399b2 ;margin-left: 10px; font-size: 12px;">gayfamicom's cool and awesome website!~</small></a>
10
+
<img style="border-radius: 15px; border: 2px solid; border-color: light-dark(var(--light-accent), var(--dark-accent)); width: 70px; height: auto" src="./assets/images/pfp.jpg" alt="fursona">
11
+
<a style=" padding: 20px; text-align: center">sign my guestbook<small style="color: light-dark(var(--light-subtext), var(--dark-subtext)); margin-left: 10px; font-size: 12px;">gayfamicom's cool and awesome website!~</small></a>
12
12
</div>
13
13
</div>
14
14
<div class="divider"></div>
···
26
26
<i class="db2" tabindex="1"></i>
27
27
<a style="margin-left: 5px;" class="dropbtn">follow me on socials</a>
28
28
<div class="dropdown-content">
29
-
<a style="color: #89b4fa; border: 0px soild transparent; border-radius: 20px;" href="https://bsky.app/profile/did:web:gayfamicom.lol" target="_blank">bluesky</a>
30
-
<a style="color: #94e2d5; border: 0px soild transparent; border-radius: 20px;" rel="me" href="https://hero.chaogarden.social/@gayfamicom" target="_blank">fediverse</a>
31
-
<a style="color: #f38ba8; border: 0px soild transparent; border-radius: 20px;" href="https://youtube.com/@gayfamicom" target="_blank">youtube</a>
29
+
<a style="color: light-dark(#1e66f5, #89b4fa); border: 0px soild transparent; border-radius: 20px;" href="https://bsky.app/profile/did:web:gayfamicom.lol" target="_blank">bluesky</a>
30
+
<a style="color: light-dark(#40a02b, #94e2d5); border: 0px soild transparent; border-radius: 20px;" rel="me" href="https://hero.chaogarden.social/@gayfamicom" target="_blank">fediverse</a>
31
+
<a style="color: light-dark(#d20f39, #89b4fa); border: 0px soild transparent; border-radius: 20px;" href="https://youtube.com/@gayfamicom" target="_blank">youtube</a>
32
32
</div>
33
33
</div>
34
34
<div class="dropdown" tabindex="1">
35
35
<i class="db2" tabindex="1"></i>
36
36
<a style="margin-left: 5px;" class="dropbtn">add me!</a>
37
37
<div class="dropdown-content">
38
-
<a style="color: #89dceb; border: 0px soild transparent; border-radius: 20px;" href="https://steamcommunity.com/id/gayfamicom/" target="_blank">steam</a>
38
+
<a style="color: light-dark(#04a5e5, #89dceb); border: 0px soild transparent; border-radius: 20px;" href="https://steamcommunity.com/id/gayfamicom/" target="_blank">steam</a>
39
39
</div>
40
40
</div>
41
41
<div class="dropdown" tabindex="1">
42
42
<i class="db2" tabindex="1"></i>
43
43
<a style="margin-left: 5px;" class="dropbtn">contact info</a>
44
44
<div class="dropdown-content">
45
-
<a style="color: #89b4fa; border: 0px soild transparent; border-radius: 20px;" href="https://signal.me/#eu/xhGmxYVp-uOwNmQMWmpPv_O3NvCOA6pH7O1FOt_C1VG3Wkd-9TxAdr1qkhvumTX1" target="_blank">signal</a>
46
-
<a style="color: #94e2d5; border: 0px soild transparent; border-radius: 20px;" href="xmpp:gayfamicom@synth.download">xmpp</a>
47
-
<a style="color: #b4befe; border: 0px soild transparent; border-radius: 20px;" href="https://discord.com/users/752389000945467482" target="_blank">discord</a>
48
-
<a style="color: #eba0ac; border: 0px soild transparent; border-radius: 20px;" href="mailto:mail@gayfamicom.lol">email</a>
45
+
<a style="color: light-dark(#1e66f5, #89b4fa); border: 0px soild transparent; border-radius: 20px;" href="https://signal.me/#eu/xhGmxYVp-uOwNmQMWmpPv_O3NvCOA6pH7O1FOt_C1VG3Wkd-9TxAdr1qkhvumTX1" target="_blank">signal</a>
46
+
<a style="color: light-dark(#40a02b, #94e2d5); border: 0px soild transparent; border-radius: 20px;" href="xmpp:gayfamicom@synth.download">xmpp</a>
47
+
<a style="color: light-dark(#7287fd, #b4befe); border: 0px soild transparent; border-radius: 20px;" href="https://discord.com/users/752389000945467482" target="_blank">discord</a>
48
+
<a style="color: light-dark(#e64553, #eba0ac); border: 0px soild transparent; border-radius: 20px;" href="mailto:mail@gayfamicom.lol">email</a>
49
49
</div>
50
50
</div>
51
-
<a style="margin-left: 15px; font-size: 12px; color: #6c7086;">gallery (under construction)</a>
51
+
<a style="margin-left: 15px; font-size: 12px; color: light-dark(var(--light-subtext), var(--dark-subtext));">gallery (under construction)</a>
52
52
</div>
53
53
</footer>
54
54
<body>
55
55
<div class="main">
56
56
<div style="margin-bottom: 10px">
57
57
<a>sign my guestbook</a>
58
-
<a style="color: #9399b2;"><small>maybe..</small></a>
58
+
<a style="color: light-dark(var(--light-subtext), var(--dark-subtext));"><small>maybe..</small></a>
59
59
</div>
60
60
<div class="divider"></div>
61
61
<form id="guestForm">
···
73
73
<button style="margin-left: 142px;" class="dropbtn" type="submit">sign</button>
74
74
</form>
75
75
</div>
76
-
<a style="color: #9399b2; padding: 10px;" href="https://tangled.org/gayfamicom.lol/site"><small>website source!</small></a>
77
-
<a style="color: #9399b2; padding: 10px;"><small>last modified: 2026-02-25T01:31:08Z</small></a>
76
+
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;" href="https://tangled.org/gayfamicom.lol/site"><small>website source!</small></a>
77
+
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;"><small>last modified: 2026-03-24T04:36:46Z</small></a>
78
78
</body>
+2
-2
index.html
+2
-2
index.html
···
99
99
</div>
100
100
<div style="margin-bottom: 10px;">
101
101
<a style="font-size: 14px">and here is mine!</a>
102
-
<a style="font-size: 12px; color: #9399b2;"><small>feel free to add mine (hotlinking is ok!)</small></a>
102
+
<a style="font-size: 12px; color: light-dark(var(--light-subtext), var(--dark-subtext));"><small>feel free to add mine (hotlinking is ok!)</small></a>
103
103
</div>
104
104
<div style="padding: 5px;">
105
105
<a href="https://gayfamicom.lol"><img src="./assets/88x31/gayfamicom.png" alt="my cool ass button"></a>
106
106
</div>
107
107
</div>
108
108
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;" href="https://tangled.org/gayfamicom.lol/site"><small>website source!</small></a>
109
-
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;"><small>last modified: 2026-03-24T00:24:23Z</small></a>
109
+
<a style="color: light-dark(var(--light-accent), var(--dark-accent)); padding: 10px;"><small>last modified: 2026-03-24T04:36:46Z</small></a>
110
110
</body>
111
111
<a rel="me" href="https://fuzzies.wtf/@gayfamicom"></a>
112
112
<a rel="me" href="https://app.wafrn.net/blog/gayfamicom"></a>
+5
-5
styles.css
+5
-5
styles.css
···
38
38
border-color: light-dark(var(--light-accent), var(--dark-accent));
39
39
border-radius: 25px;
40
40
padding: 20px;
41
-
box-shadow: 10px 5px 10px #11111b;
41
+
box-shadow: 10px 5px 10px light-dark(var(--light-crust), var(--dark-crust));
42
42
}
43
43
footer {
44
44
font-family: "Iosevka Aile", monospace;
···
50
50
border-color: light-dark(var(--light-accent), var(--dark-accent));
51
51
border-radius: 25px;
52
52
margin-top: 10px;
53
-
box-shadow: 10px 5px 10px #11111b;
53
+
box-shadow: 10px 5px 10px light-dark(var(--light-crust), var(--dark-crust));
54
54
}
55
55
56
56
.form-input {
···
62
62
margin-top: 10px;
63
63
color: light-dark(var(--light-accent), var(--dark-accent));
64
64
border: 1px solid;
65
-
border-color: light-dark(var(--light-accent), var(--dark-accent))
65
+
border-color: light-dark(var(--light-accent), var(--dark-accent));
66
66
border-radius: 10px;
67
67
background: light-dark(var(--light-background), var(--dark-background));
68
68
padding: 10px;
···
88
88
padding: 8px;
89
89
}
90
90
.input {
91
-
color: light-dark(var(--light-subtext), var(--dark-subtext));
91
+
color: light-dark(var(--light-accent), var(--dark-accent));
92
92
border: 1px solid;
93
93
border-color: light-dark(var(--light-accent), var(--dark-accent));
94
94
border-radius: 10px;
95
-
background: #1e1e2e;
95
+
background: light-dark(var(--light-background), var(--dark-background));
96
96
padding: 7px;
97
97
font-family: "Iosevka Aile", monospace;
98
98
}