My personal website.
entomoviscera.online
1---
2import Base from "/components/Base.astro";
3import "/styles/main.css";
4import "/styles/splashscreen.css";
5---
6
7<Base
8 title="ENTRANCE"
9 graph={{
10 description: "WARNING: Bug inside.",
11 }}
12>
13 <a href="/home" id="welcome">
14 <img src="/img/sprites/door.png" id="door" alt="" />
15 <img src="/img/sprites/doorbg.png" id="doorbg" alt="entrance" />
16 </a>
17 <div class="bwcontainer">
18 <div class="bwbox">
19 <ul>
20 <li>
21 <a href="https://bsky.app/profile/entomoviscera.online">BLUESKY</a>
22 </li>
23 <li>
24 <a
25 href="https://tangled.org/did:plc:y3zqaodyl6y47l4dptwyhu5n?tab=overview"
26 >TANGLED</a
27 >
28 </li>
29 <li>
30 <a href="https://entomoviscera.tumblr.com/">TUMBLR</a>
31 </li>
32 <li>
33 <a href="https://entomoviscera.newgrounds.com/">NEWGROUNDS</a>
34 </li>
35 <li>
36 <a href="https://www.youtube.com/@entomoviscera">YOUTUBE</a>
37 </li>
38 </ul>
39 </div>
40 <div class="bwbox">
41 <a href="mailto:entomoviscera@gmail.com">entomoviscera@gmail.com</a>
42 </div>
43 <div class="bwbox">
44 <a href="https://tangled.org/entomoviscera.online/personal-site"
45 >SITE REPOSITORY</a
46 >
47 </div>
48 </div>
49</Base>
50
51<style>
52 #welcome {
53 position: relative;
54 margin: 15px 20px;
55 }
56
57 #door {
58 position: absolute;
59 transform: 0;
60 transform-origin: 10% center;
61 transition: 600ms;
62 }
63
64 #welcome:hover #door {
65 transform: rotateY(60deg) skewY(16deg);
66 }
67
68 @media (prefers-reduced-motion: reduce) {
69 #door {
70 transition: none;
71 }
72 }
73</style>