shii.moe

Source for `shii.moe' website.
git clone git://git.knutsen.co/shii.moe
Log | Files | Refs | README | LICENSE

404.html (1845B)

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html>
<html lang="en">

<head>
    <title>Shimo Couldn't Find That!!</title>
    <link rel='stylesheet' type='text/css' href="/style.css">
    <link rel='icon' type='image/png' href="/mascots/17-square.png">
    <link rel="preload" as="image" href="/background-300x300.png">
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <div id="content">

    <a href="/"><h1>Shimo!!</h1></a>

    <div class="titleBar">
        <div class="titleButton"><a href="/music">Musik</a></div>
        <div class="titleButton"><a href="/school">Skole</a></div>
        <div class="titleButton"><a href="/norsk">Norsk</a></div>
        <div class="titleButton"><a href="/books">Bøker</a></div>
        <div class="titleButton"><a href="/blog">Blog</a></div>
    </div>

    <h1>404, Not Found!</h1>
    <p id="bottom" align="center">Couldn't find that page, sorry!!</p>
    </div>

    <style>
        body, html {
            overflow: hidden;
        }
        #mascot {
            transition: all .3s ease;
            opacity: 0;
            bottom: 0;
            left: 50%;
            max-height: unset;
            max-width: unset;
            height: unset;
            transform: translateX(-50%);
        }
    </style>
    <noscript><style>#mascot { opacity: 0.85; }</style></noscript>
    <img src="/mascots/17.png" id="mascot"></img>
    <script src="colours.js"></script>
    <script src="image.js"></script>
    <script>
        const bottom = document.getElementById('bottom');
        mascot.style.height =
            `${window.innerHeight - (bottom.offsetTop + bottom.offsetHeight)}px`;
    </script>
    <script>
        setTimeout(() => mascot.style.opacity = '1', 30);
    </script>
</body>
</html>