my personal website! meowing.zip
website
0
fork

Configure Feed

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

new neat little animations for the website buttons when hovering them waow

Niko 1df93493 f5d62661

+38 -39
+26 -26
index.html
··· 61 61 <a style="font-size: 12px; color: light-dark(var(--light-subtext), var(--dark-subtext));"><small>let me know if you want urs added here!</small></a> 62 62 </div> 63 63 <div style="padding: 5px; margin-bottom: 10px"> 64 - <a href="https://aquamarine.gay"><img alt="aquamarine.gay" src="./assets/88x31/friends/aquamarine.gif"></a> 65 - <a href="https://atapi.space"><img alt="atapi.space" src="./assets/88x31/friends/atapi.gif"></a> 66 - <a href="https://daniela.lol"><img alt="daniela.lol" src="./assets/88x31/friends/daniela.gif"></a> 67 - <a href="https://eeep.ee"><img width="88" width="31" alt="a cropped rotated fox face emoji, in shades of gray, meant to looks like a platinum fox" src="./assets/88x31/friends/chfour.svg"/></a> 68 - <a href="https://f0urst4r.net/"><img src="./assets/88x31/friends/f0urst4r.gif" alt="F0URST4R" title="F0URST4R"></a> 69 - <a href="https://ielenia.lgbt"><img alt="ielenia.lgbt" src="./assets/88x31/friends/ielenia.png"></a> 70 - <a href="https://invoxiplaygames.uk"><img alt="invoxiplaygames.uk" src="./assets/88x31/friends/invoxiplaygames.png"></a> 71 - <a href="https://jack.cab"><img alt="jack.cab" src="./assets/88x31/friends/jackcab.png"></a> 72 - <a href="https://jbc.lol"><img src="./assets/88x31/friends/jbc.svg" alt="jb's site" style="image-rendering: pixelated;"/></a> 73 - <a href="https://notfire.cc"><img alt="notfire.cc" src="./assets/88x31/friends/notfire.gif"></a> 74 - <a href="https://potatoe.ca"><img alt="potatoe.ca" src="./assets/88x31/friends/potatoe.png"></a> 75 - <a href="https://shiver-j.neocities.org"><img alt="shiver j." src="./assets/88x31/friends/shiverj.png"></a> 76 - <a href="https://sneexy.synth.download"><img src="./assets/88x31/friends/sneexy.svg" alt="Sneexy"></a> 77 - <a href="https://reimu.info"><img alt="reimu.info" src="./assets/88x31/friends/ezio.png"></a> 78 - <a href="https://rodents.rodeo"><img alt="rodents.rodeo" src="./assets/88x31/friends/mjdxp.png"></a> 79 - <a href="https://ry.cd-rom.net"><img alt="ry.cd-rom.net" src="./assets/88x31/friends/ryfox.png"></a> 80 - <a href="https://thxdeeply.com"><img alt="thxdeeply.com" src="./assets/88x31/friends/thxdeeply.gif"></a> 81 - <a href="https://w.on-t.work"><img alt="w.on-t.work" src="./assets/88x31/friends/wont-work.png"></a> 82 - <a href="https://witchfuneral.quest"><img alt="witchfuneral.quest" src="./assets/88x31/friends/witchfuneral.png"></a> 83 - <a href="https://zenfyr.dev/"><img src="./assets/88x31/friends/zenfyr.webp" alt="zenfyr" title="zenfyr"></a> 64 + <a href="https://aquamarine.gay"><img class="web-button" alt="aquamarine.gay" src="./assets/88x31/friends/aquamarine.gif"></a> 65 + <a href="https://atapi.space"><img class="web-button" alt="atapi.space" src="./assets/88x31/friends/atapi.gif"></a> 66 + <a href="https://daniela.lol"><img class="web-button" alt="daniela.lol" src="./assets/88x31/friends/daniela.gif"></a> 67 + <a href="https://eeep.ee"><img class="web-button" width="88" width="31" alt="a cropped rotated fox face emoji, in shades of gray, meant to looks like a platinum fox" src="./assets/88x31/friends/chfour.svg"/></a> 68 + <a href="https://f0urst4r.net/"><img class="web-button" src="./assets/88x31/friends/f0urst4r.gif" alt="F0URST4R" title="F0URST4R"></a> 69 + <a href="https://ielenia.lgbt"><img class="web-button" alt="ielenia.lgbt" src="./assets/88x31/friends/ielenia.png"></a> 70 + <a href="https://invoxiplaygames.uk"><img class="web-button" alt="invoxiplaygames.uk" src="./assets/88x31/friends/invoxiplaygames.png"></a> 71 + <a href="https://jack.cab"><img alt="jack.cab" class="web-button" src="./assets/88x31/friends/jackcab.png"></a> 72 + <a href="https://jbc.lol"><img class="web-button" src="./assets/88x31/friends/jbc.svg" alt="jb's site" style="image-rendering: pixelated;"/></a> 73 + <a href="https://notfire.cc"><img class="web-button" alt="notfire.cc" src="./assets/88x31/friends/notfire.gif"></a> 74 + <a href="https://potatoe.ca"><img class="web-button" alt="potatoe.ca" src="./assets/88x31/friends/potatoe.png"></a> 75 + <a href="https://shiver-j.neocities.org"><img class="web-button" alt="shiver j." src="./assets/88x31/friends/shiverj.png"></a> 76 + <a href="https://sneexy.synth.download"><img class="web-button" src="./assets/88x31/friends/sneexy.svg" alt="Sneexy"></a> 77 + <a href="https://reimu.info"><img class="web-button" alt="reimu.info" src="./assets/88x31/friends/ezio.png"></a> 78 + <a href="https://rodents.rodeo"><img class="web-button" alt="rodents.rodeo" src="./assets/88x31/friends/mjdxp.png"></a> 79 + <a href="https://ry.cd-rom.net"><img class="web-button" alt="ry.cd-rom.net" src="./assets/88x31/friends/ryfox.png"></a> 80 + <a href="https://thxdeeply.com"><img class="web-button" alt="thxdeeply.com" src="./assets/88x31/friends/thxdeeply.gif"></a> 81 + <a href="https://w.on-t.work"><img class="web-button" alt="w.on-t.work" src="./assets/88x31/friends/wont-work.png"></a> 82 + <a href="https://witchfuneral.quest"><img class="web-button" alt="witchfuneral.quest" src="./assets/88x31/friends/witchfuneral.png"></a> 83 + <a href="https://zenfyr.dev/"><img class="web-button" src="./assets/88x31/friends/zenfyr.webp" alt="zenfyr" title="zenfyr"></a> 84 84 </div> 85 85 <div style="margin-bottom: 10px;"> 86 86 <a style="font-size: 14px">others</a> 87 87 </div> 88 88 <div style="padding: 5px; margin-bottom: 20px;"> 89 - <a href="https://epicblazed.com"><img alt="epicblazed" src="./assets/88x31/others/epicblazed.png"></a> 90 - <a href="https://googleballs.com"><img alt="googleballs.com" src="./assets/88x31/others/google-balls.png"></a> 91 - <a href="https://smokepowered.com"><img alt="smokepowered.com" src="./assets/88x31/others/smokepowered.gif"></a> 92 - <a href="https://starlightnet.work"><img loading="lazy" src="./assets/88x31/others/starlight-network.png" alt="The Starlight Network"></a> 93 - <a href="https://synth.download"><img src="./assets/88x31/others/synth.download.svg" alt="Synth.Download!"></a> 89 + <a href="https://epicblazed.com"><img class="web-button" alt="epicblazed" src="./assets/88x31/others/epicblazed.png"></a> 90 + <a href="https://googleballs.com"><img class="web-button" alt="googleballs.com" src="./assets/88x31/others/google-balls.png"></a> 91 + <a href="https://smokepowered.com"><img class="web-button" alt="smokepowered.com" src="./assets/88x31/others/smokepowered.gif"></a> 92 + <a href="https://starlightnet.work"><img class="web-button" loading="lazy" src="./assets/88x31/others/starlight-network.png" alt="The Starlight Network"></a> 93 + <a href="https://synth.download"><img class="web-button" src="./assets/88x31/others/synth.download.svg" alt="Synth.Download!"></a> 94 94 </div> 95 95 <div style="margin-bottom: 10px;"> 96 96 <a style="font-size: 14px">and here is mine!</a> 97 97 <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> 98 98 </div> 99 99 <div style="padding: 5px;"> 100 - <a href="https://gayfamicom.lol"><img src="./assets/88x31/gayfamicom.png" alt="my cool ass button"></a> 100 + <a href="https://gayfamicom.lol"><img class="web-button" src="./assets/88x31/gayfamicom.png" alt="my cool ass button"></a> 101 101 </div> 102 102 </div> 103 103 <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>
+12 -13
styles.css
··· 133 133 .dropdown-content a:hover { 134 134 background-color: light-dark(var(--light-subtext), var(--dark-subtext)); 135 135 } 136 - .main:hover img { 136 + .main:hover .web-button { 137 137 transition: ease-in-out 0.2s; 138 138 filter: blur(0.1em); 139 - justify-content: center; 140 - align-items: center; 139 + display: inline-block; 141 140 } 142 - .main img:hover { 143 - transition: ease-in-out 0.5s; 144 - border: solid 2px; 141 + 142 + .main .web-button:hover { 143 + transition: ease-in-out 0.3s; 144 + border: solid 1px; 145 145 border-radius: 10px; 146 146 border-color: light-dark(var(--light-accent), var(--dark-accent)); 147 - height: auto; 148 - width: 100px; 149 147 filter: blur(0); 150 - justify-content: center; 151 - align-items: center; 152 148 box-shadow: 0px 0px 10px light-dark(var(--light-text), var(--dark-text)); 149 + transform: scale(1.4, 1.4) rotate(2deg) translateX(-10px); 150 + display: inline-block; 153 151 } 154 152 155 153 .pfp { ··· 179 177 background-color: light-dark(var(--light-accent), var(--dark-accent)); 180 178 color: light-dark(var(--light-background), var(--dark-background)); 181 179 border-color: light-dark(var(--light-background), var(--dark-background)); 182 - height: auto; 183 180 transition: ease-in-out 0.5s; 184 - padding: 10px; 185 - font-size: 16px; 181 + position: relative; 182 + transform: scale(2); 183 + letter-spacing: 1px; 184 + padding: 12px; 186 185 } 187 186 188 187 /* mask to close menu by clicking on the button */