my personal website! meowing.zip
website
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

a potential guestbook? maybe?

Niko 8d8f69dc 37ece227

+156 -7
+4 -1
about-me.html
··· 1 1 <!DOCTYPE html> 2 2 <html> 3 3 <head> 4 - <title>about me!</title> 4 + <title>about me! - gayfamicom's cool and awesome website</title> 5 5 <link rel="icon" type="image/x-icon" href="./assets/images/favicon.png"> 6 6 </head> 7 7 <link rel="stylesheet" href="styles.css"> ··· 16 16 <div class="dropdown"> 17 17 <a href="." class="dropbtn">< go back!</a> 18 18 </div> 19 + <div class="dropdown" tabindex="1"> 20 + <a style="margin-left: 5px;" class="dropbtn" href="./guestbook.html">guestbook</a> 21 + </div> 19 22 <div class="dropdown" tabindex="1"> 20 23 <a style="margin-left: 5px;" class="dropbtn" href="./blog.html">blog</a> 21 24 </div>
assets/88x31/others/starlight-network.png

This is a binary file and will not be displayed.

+78
guestbook.html
··· 1 + <!DOCTYPE html> 2 + <html> 3 + <head> 4 + <title>guestbook - gayfamicom's cool and awesome website!</title> 5 + <link rel="icon" type="image/x-icon" href="./assets/images/favicon.png"> 6 + </head> 7 + <link rel="stylesheet" href="styles.css"> 8 + <footer> 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> 12 + </div> 13 + </div> 14 + <div class="divider"></div> 15 + <div style="font-size: 15px; margin-top: 20px; margin-left: 2px; margin-bottom: 10px; display: flex;"> 16 + <div class="dropdown"> 17 + <a href="./about-me.html" class="dropbtn">about me</a> 18 + </div> 19 + <div class="dropdown" tabindex="1"> 20 + <a style="margin-left: 5px;" href="." class="dropbtn">< go back!</a> 21 + </div> 22 + <div class="dropdown" tabindex="1"> 23 + <a style="margin-left: 5px;" class="dropbtn" href="./blog.html">blog</a> 24 + </div> 25 + <div class="dropdown" tabindex="1"> 26 + <i class="db2" tabindex="1"></i> 27 + <a style="margin-left: 5px;" class="dropbtn">follow me on socials</a> 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> 32 + </div> 33 + </div> 34 + <div class="dropdown" tabindex="1"> 35 + <i class="db2" tabindex="1"></i> 36 + <a style="margin-left: 5px;" class="dropbtn">add me!</a> 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> 39 + </div> 40 + </div> 41 + <div class="dropdown" tabindex="1"> 42 + <i class="db2" tabindex="1"></i> 43 + <a style="margin-left: 5px;" class="dropbtn">contact info</a> 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> 49 + </div> 50 + </div> 51 + <a style="margin-left: 15px; font-size: 12px; color: #6c7086;">gallery (under construction)</a> 52 + </div> 53 + </footer> 54 + <body> 55 + <div class="main"> 56 + <div style="margin-bottom: 10px"> 57 + <a>sign my guestbook</a> 58 + <a style="color: #9399b2;"><small>maybe..</small></a> 59 + </div> 60 + <div class="divider"></div> 61 + <form id="guestForm"> 62 + <div class="form-input"> 63 + <label style="font-size: 14px" for="name">name:</label> 64 + <input class="input" size="15" type="text" id="name" name="name" placeholder="optional"> 65 + <label style="font-size: 14px" for="pronouns">pronouns:</label> 66 + <input class="input" size="10" type="text" id="pronouns" name="pronouns" placeholder="optional"> 67 + </div> 68 + <div class="form-input"> 69 + <label style="font-size: 14px" for="message">message:</label> 70 + <input class="form-input_message" size="46" height="100" type="text" id="message" name="message" required> 71 + </div> 72 + <a href="./guestbook.html" style="border-radius: 10px;" class="dropbtn">see what others wrote!</a> 73 + <button style="margin-left: 142px;" class="dropbtn" type="submit">sign</button> 74 + </form> 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> 78 + </body>
+16 -6
index.html
··· 9 9 <div style="display: flex;"> 10 10 <img style="border-radius: 15px; border: 2px solid #ca9ee6; width: 70px; height: auto" src="./assets/images/pfp.jpg" alt="fursona"> 11 11 <a style=" padding: 20px; text-align: center">gayfamicom's cool and awesome website!<small style="color: #9399b2 ;margin-left: 10px; font-size: 12px;">awwahhff mrrroow!~</small></a> 12 + <div style="margin-top: 20px;"> 13 + <a style="font-size: 14px;">visitor count: </a> 14 + <a href="https://nixie.starlightnet.work"> 15 + <img style="border-radius: 15px; border: 2px solid #ca9ee6;" src="https://nixie.starlightnet.work/?fg=%23926eaf&bg=%231b151e&pixel=1" alt="view counter" referrerpolicy="no-referrer-when-downgrade"/></a> 16 + <div> 17 + <small style="color: #9399b2 ;margin-left: 10px; font-size: 10px;">powered by nixie (thanks starlightnet.work!)</small> 18 + </div> 19 + </div> 12 20 </div> 13 21 <div class="divider"></div> 14 22 <div style="font-size: 15px; margin-top: 20px; margin-left: 2px; margin-bottom: 10px; display: flex;"> ··· 45 53 </div> 46 54 </div> 47 55 <a style="margin-left: 15px; font-size: 12px; color: #6c7086;">gallery (under construction)</a> 56 + <a style="margin-left: 15px; font-size: 12px; color: #6c7086;">guestbook (under construction)</a> 48 57 </div> 49 58 </footer> 50 59 ··· 56 65 </div> 57 66 <div class="divider"></div> 58 67 <div style="margin-bottom: 10px;"> 59 - <a>friends</a> 60 - <a style="color: #9399b2;"><small>let me know if you want urs added here!</small></a> 68 + <a style="font-size: 14px">friends</a> 69 + <a style="font-size: 12px; color: #9399b2;"><small>let me know if you want urs added here!</small></a> 61 70 </div> 62 71 <div style="padding: 5px; margin-bottom: 10px"> 63 72 <a href="https://aquamarine.gay"><img alt="aquamarine.gay" src="./assets/88x31/friends/aquamarine.gif"></a> ··· 82 91 <a href="https://zenfyr.dev/"><img src="./assets/88x31/friends/zenfyr.webp" alt="zenfyr" title="zenfyr"></a> 83 92 </div> 84 93 <div style="margin-bottom: 10px;"> 85 - <a>others</a> 94 + <a style="font-size: 14px">others</a> 86 95 </div> 87 96 <div style="padding: 5px; margin-bottom: 20px;"> 88 97 <a href="https://epicblazed.com"><img alt="epicblazed" src="./assets/88x31/others/epicblazed.png"></a> 89 98 <a href="https://googleballs.com"><img alt="googleballs.com" src="./assets/88x31/others/google-balls.png"></a> 90 - <a href="https://nixie.starlightnet.work"><img src="https://nixie.starlightnet.work/?fg=%23926eaf&bg=%231b151e&pixel=1" alt="view counter" referrerpolicy="no-referrer-when-downgrade"/></a> 91 99 <a href="https://smokepowered.com"><img alt="smokepowered.com" src="./assets/88x31/others/smokepowered.gif"></a> 100 + <a href="https://starlightnet.work"><img loading="lazy" src="./assets/88x31/others/starlight-network.png" alt="The Starlight Network"></a> 92 101 <a href="https://synth.download"><img src="./assets/88x31/others/synth.download.svg" alt="Synth.Download!"></a> 93 102 </div> 94 103 <div style="margin-bottom: 10px;"> 95 - <a>and here is mine!</a> 96 - <a style="color: #9399b2;"><small>feel free to add mine (hotlinking is ok!)</small></a> 104 + <a style="font-size: 14px">and here is mine!</a> 105 + <a style="font-size: 12px; color: #9399b2;"><small>feel free to add mine (hotlinking is ok!)</small></a> 97 106 </div> 98 107 <div style="padding: 5px;"> 99 108 <a href="https://gayfamicom.lol"><img src="./assets/88x31/gayfamicom.png" alt="my cool ass button"></a> ··· 105 114 <a rel="me" href="https://fuzzies.wtf/@gayfamicom"></a> 106 115 <a rel="me" href="https://app.wafrn.net/blog/gayfamicom"></a> 107 116 <a rel="me" href="https://booping.synth.download/@gayfamicom"></a> 117 + <a rel="me" href="https://waf.moe/blog/gayfamicom"></a> 108 118 </html>
+20
script.js
··· 1 + const guestForm = document.getElementById('guestForm'); 2 + const guestList = document.getElementById('guestList'); 3 + 4 + guestForm.addEventListener('submit', function (e) { 5 + e.preventDefault(); 6 + 7 + const name = document.getElementById('name').value; 8 + const pronouns = document.getElementById('pronouns').value; 9 + const message = document.getElementById('message').value; 10 + 11 + const guestCard = document.createElement('div'); 12 + guestCard.classList.add('guest-card'); 13 + guestCard.innerHTML = ` 14 + <h2>${name}</h2> 15 + <p><strong>pronouns:</strong> ${pronouns}</p> 16 + <p><strong>message:</strong> ${message}</p> 17 + guestList.appendChild(guestCard); 18 + 19 + guestForm.reset(); 20 + });
+38
styles.css
··· 1 + button { 2 + font-family: "Iosevka Aile", monospace; 3 + font-size: 17px; 4 + border-radius: 10px; 5 + } 1 6 body { 2 7 background-color: #1e1e2e; 3 8 color: #cdd6f4; ··· 29 34 margin-top: 10px; 30 35 box-shadow: 10px 5px 10px #11111b; 31 36 } 37 + 38 + .form-input { 39 + margin-bottom: 11px; 40 + } 41 + 42 + .form-input_message { 43 + display: block; 44 + margin-top: 10px; 45 + color: #ca9ee6; 46 + border: 1px solid #ca9ee6; 47 + border-radius: 10px; 48 + background: #1e1e2e; 49 + padding: 10px; 50 + resize: both; 51 + overflow: hidden; 52 + font-family: "Iosevka Aile", monospace; 53 + } 32 54 33 55 /* dd container */ 34 56 .dropdown { ··· 44 66 border-radius: 15px; 45 67 background: #1e1e2e; 46 68 padding: 8px; 69 + } 70 + .input { 71 + color: #ca9ee6; 72 + border: 1px solid #ca9ee6; 73 + border-radius: 10px; 74 + background: #1e1e2e; 75 + padding: 7px; 76 + font-family: "Iosevka Aile", monospace; 77 + } 78 + 79 + .guest { 80 + border: 2px dashed #ca9ee6; 81 + padding: 10px; 82 + color: #ca9ee6; 83 + background: #1e1e2e; 84 + font-family: "Iosevka Aile", monospace; 47 85 } 48 86 49 87 /* dd content */