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 url: "https://entomoviscera.online/",
12 }}
13>
14 <a href="/home" id="welcome">
15 <img src="/img/sprites/door.png" id="door" alt="" />
16 <img src="/img/sprites/doorbg.png" id="doorbg" alt="entrance" />
17 </a>
18 <div class="bwcontainer">
19 <div class="bwbox">
20 <ul>
21 <li>
22 <a href="https://bsky.app/profile/entomoviscera.online">BLUESKY</a>
23 </li>
24 <li>
25 <a href="https://entomoviscera.tumblr.com/">TUMBLR</a>
26 </li>
27 <li>
28 <a href="https://entomoviscera.newgrounds.com/">NEWGROUNDS</a>
29 </li>
30 <li>
31 <a href="https://www.youtube.com/@entomoviscera">YOUTUBE</a>
32 </li>
33 </ul>
34 </div>
35 <div class="bwbox">
36 <a href="mailto:entomoviscera@gmail.com">entomoviscera@gmail.com</a>
37 </div>
38 </div>
39</Base>
40
41<style>
42 #welcome {
43 position: relative;
44 margin: 15px 20px;
45 }
46
47 #door {
48 position: absolute;
49 transform: 0;
50 transform-origin: 10% center;
51 transition: 600ms;
52 }
53
54 #welcome:hover #door {
55 transform: rotateY(60deg) skewY(16deg);
56 }
57
58 @media (prefers-reduced-motion: reduce) {
59 #door {
60 transition: 0;
61 }
62 }
63</style>