Merge branch 'dev' into origin

constants.json

@@ -74,13 +74,9 @@
                 "JQuery",
                 ".js",
 
-                "enby",
-
                 "Slay the Spire",
 
-                "Liberapay",
-
-                "Golden Wind"
+                "Liberapay"
             ],
             "color": "yellow"
         },
@@ -100,16 +96,7 @@
         },
         {
             "words": [
-                "Jojo's Bizarre Adventure",
-                "Jojo"
-            ],
-            "caseInsensitive": true,
-            "color": "rgb(170, 80, 225)"
-        },
-        {
-            "words": [
-                "Teto Tuesday",
-                "Teto Territory",
+                "Teto T",
                 "Teto",
                 "Kasane"
             ],
@@ -148,7 +135,8 @@
                 "Shortcat",
                 "Valve",
                 "Spooky",
-                "The Ironclad"
+                "The Ironclad",
+                "Search Party"
             ],
             "color": "orange"
         },
@@ -170,6 +158,7 @@
         },
         {
             "words": [
+                "Violet's ",
                 "Violet",
                 "Purgatory",
                 "violets-",
@@ -180,9 +169,9 @@
         },
         {
             "words": [
-                "bisexual"
+                "abyss"
             ],
-            "color": "rgb(214, 2, 112)"
+            "color": "rgb(150, 50, 255)"
         },
         {
             "words": [
@@ -200,7 +189,11 @@
             "words": [
                 "Codeberg",
 
-                "TrueNAS"
+                "TrueNAS",
+
+                "Miku M",
+                "Miku",
+                "Hatsune"
             ],
             "color": "rgb(0, 255, 255)"
         },
@@ -310,15 +303,6 @@
             "italicized": true,
             "caseInsensitive": true
         },
-        {
-            "words": [
-                "Pokerogue"
-            ],
-            "caseInsensitive": true,
-            "color": "#366383",
-            "outline": "#d43131",
-            "bold": true
-        },
         {
             "words": [
                 "page embed"

pageUpdater.js

@@ -290,7 +290,7 @@ function converter(html, dynamic = true) {
         },
         "SELECTED_VIDEO": () => {
             if (api.lanyard && api.lanyard.video) {
-                return `<h2><hr/>Random video!</h2><p>I would call it random <em>daily</em> video but its not at all daily...</p>
+                return `<h2><hr/>Predetermined weekly video!</h2><p>I would call it random but I actually select them manually.</p>
                 <br/> 
                 <video controls="true" src="${api.lanyard.video.url}"></video>`
             }
@@ -344,6 +344,15 @@ function converter(html, dynamic = true) {
                 addedHTML += "<p>No blog posts found... <br>wait <br> huh ??? <br>what???????<br> how ???????????????<br> WHY ?!<br> Violet must've fucked up like. REALLY bad. <br> We're so cooked</p>"
             }
             return addedHTML
+        },
+        "SUBPAGE_JS": () => {
+            return `
+            <script src="../js/cash.js"></script>
+            <script src="../js/main.js"></script>
+            <script src="../js/constants.js"></script>
+            <script src="../js/lanyardSocket.js"></script>
+            <script src="../js/timeFormatter.js"></script>
+            `
         }
     }
 

static/ambience/ambient.js

@@ -1,32 +0,0 @@
-function loop() {
-    var date = new Date()
-    
-    var hour = date.getHours();
-    hour = (hour < 10 ? "0" : "") + hour;
-
-    var min  = date.getMinutes();
-    min = (min < 10 ? "0" : "") + min;
-
-    var sec  = date.getSeconds();
-    sec = (sec < 10 ? "0" : "") + sec;
-    
-    $("#time").text(hour + ":" + min)
-
-    setTimeout(() => {
-        loop()
-    }, 1000)
-}
-
-document.addEventListener("DOMContentLoaded", function() {
-    loop()
-})
-
-$(document).on('keypress',function(e) {
-    if(e.which == 102) {
-        if ($.fullscreen.isFullScreen()) {
-            $.fullscreen.exit()
-        } else {
-            $("body").fullscreen()
-        }
-    }
-});

static/ambience/index.html

@@ -1,37 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-    <link rel="stylesheet" type="text/css" href="../style.css">
-    <link rel="stylesheet" type="text/css" href="../subpage.css">
-    <link rel="stylesheet" href="./style.css">
-
-    <script src="../jquery.js"></script>
-    <script src="../main.js"></script>
-    <script src="./fullscreen.js"></script>
-    <script src="./ambient.js"></script>
-
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-
-    <title>Violet's Purgatory Ambient Page</title>
-
-    <meta name="darkreader-lock">
-
-    <meta content="Ambient Page - Violet's Purgatory" property="og:title" />
-    <meta content="This page isn't really made for public use. Ignore it!" property="og:description" />
-    <meta content="https://api.violets-purgatory.dev/v1/pfp" property="og:image" />
-    <meta content="#a200ff" data-react-helmet="true" name="theme-color" />
-</head>
-
-<body>
-    {WEATHER_MODIFIER}
-    <div class="mainDiv">
-        <h1 id="time">00:00</h1>
-        <div id="activityHtml">
-            {ACTIVITIES}
-        </div>
-    </div>
-</body>
-
-</html>

static/ambience/style.css

@@ -1,19 +0,0 @@
-body {
-    background-image: none;
-    background-color: black;
-    display: flex;
-    align-items: center;
-    margin: auto;
-
-}
-
-@media screen and (min-height: 500px) {
-    html,
-    body {
-        height: 100%;
-    }
-}
-
-#time {
-    font-size: 5rem;
-}

static/blog/index.html

@@ -4,9 +4,6 @@
 <head>
     <link rel="stylesheet" type="text/css" href="style.css">
 
-    <script src="../jquery.js"></script>
-    <script src="../main.js"></script>
-
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 

static/faq/index.html

@@ -5,8 +5,7 @@
     <link rel="stylesheet" type="text/css" href="/style.css">
     <link rel="stylesheet" type="text/css" href="/subpage.css">
 
-    <script src="../jquery.js"></script>
-    <script src="../main.js"></script>
+    {SUBPAGE_JS}
 
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">

static/index.html

@@ -2,14 +2,17 @@
 <html lang="en">
 
 <head>
-    <link rel="stylesheet" type="text/css" href="./style.css">
     <link rel="stylesheet" type="text/css" href="./root.css">
+    <link rel="stylesheet" type="text/css" href="./style.css">
     <noscript>
         <link rel="stylesheet" href="./noScript.css">
     </noscript>
 
-    <script src="./jquery.js"></script>
-    <script src="./main.js"></script>
+    <script src="./js/cash.js"></script>
+    <script src="./js/constants.js"></script>
+    <script src="./js/lanyardSocket.js"></script>
+    <script src="./js/timeFormatter.js"></script>
+    <script src="./js/spin.js"></script>
 
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -26,7 +29,7 @@
 
 <body>
     {WEATHER_MODIFIER}
-    <h1 class="animatedTitle">Welcome to <span class="mainTitle">Violet's Purgatory</span><span class="note">Commit {COMMIT_COUNT}</span></h1>
+    <h1 class="animatedTitle">Welcome to <span class="mainTitle noHighlight">Violet's Purgatory</span><span class="note">Commit {COMMIT_COUNT}</span></h1>
     <main class="animatedMain">
         <p>Make sure to check out this project on <a href="https://git.violets-purgatory.dev/bingus_violet/violets-purgatory">Forgejo</a>!</p>
         <hr>
@@ -34,7 +37,7 @@
             <h2>{Violet}</h2>
             <div style="display: flex; justify-content: center; align-items: center;">
                 <div style="width: 50%;">
-                    <img draggable="false" src="https://api.violets-purgatory.dev/v1/pfp" class="pfp">
+                    <img draggable="false" src="https://api.violets-purgatory.dev/v1/pfp?width=256&height=256" class="pfp">
                 </div>
                 <div style="width: 50%;">
                     <div style="float: left;">
@@ -69,7 +72,6 @@
         <div id="activityHtml">
             {ACTIVITIES}
         </div>
-
         {ANNOUNCEMENT}
         
         <h2><hr>Services</h2>

static/js/constants.js

@@ -0,0 +1,26 @@
+const discStatuses = {
+    "online": {
+        "text": "Online",
+        "color": "rgb(100, 255, 100)"
+    },
+    "dnd": {
+        "text": "DND",
+        "color": "rgb(255, 100, 100)"
+    },
+    "idle": {
+        "text": "Idle",
+        "color": "rgb(255, 255, 75)"
+    },
+    "offline": {
+        "text": "",
+        "color": "rgb(175, 175, 200)"
+    }
+}
+
+var teto = false
+
+var date = new Date()
+
+if (date.getDay() == 2) {
+    teto = true
+} 

static/js/lanyardSocket.js

@@ -0,0 +1,79 @@
+var sock
+
+var firsttimeDebounce = true
+
+var lastPong = Date.now()
+
+function ping(dur) {
+    sock.send(JSON.stringify({
+        op: 3
+    }))
+    setTimeout(() => {
+        ping(dur)
+        if (Date.now() - lastPong > 120000) {
+            sock.close()
+            console.log("Max duration since last pong exceeded- Closing socket.")
+        }
+    }, dur);
+}
+
+function socketeer() {
+    sock = new WebSocket('wss://api.violets-purgatory.dev')
+
+    sock.addEventListener("open", () => {
+        ping(30000)
+    })
+
+    sock.addEventListener("error", (error) => {
+        console.log(error)
+    })
+
+    sock.addEventListener("close", () => {
+        console.log("Connection Closed. Attempting Reconnect in 30 seconds.")
+        $("#apiConnected").text("false")
+        setTimeout(() => {
+            socketeer()
+        }, 30000);
+    })
+
+    sock.addEventListener("message", async (data) => {
+        data = data.data
+        data = JSON.parse(data)
+        if (data.op == 4) {
+            $("#apiConnected").text("true")
+            globalSpins = data.spins
+            if (firsttimeDebounce == true) {
+                firsttimeDebounce = false
+                $(".globalSpins").innerHTML = globalSpins + 1;
+            } else {
+                $(".globalSpins").innerHTML = globalSpins;
+            }
+        } else if (data.op == 0) {
+            var lanyard = data.d
+            var statusInfo = discStatuses[lanyard.discord_status]
+            var lastStatus = $(".statusColor")
+
+            if (lastStatus.text() != statusInfo.text) {
+                lastStatus.text(statusInfo.text)
+                lastStatus.css("color", statusInfo.color)
+
+                $(".pfp").css("borderColor", statusInfo.color)
+            }
+
+            // if (lanyard.activities[0] && lanyard.activities[0].type == 4) {
+            //     document.querySelector(".customStatus").innerHTML = `<hr><img src=""><p>${lanyard.activities[0].state}</p>`
+            // } else {
+            //     document.querySelector(".customStatus").innerHTML = ""
+            // }
+
+            var discFetch = await (await fetch("/discHTML")).text()
+            $("#activityHtml").html(discFetch)
+        } else if (data.op == 3) {
+            lastPong = Date.now()
+        } else {
+            console.log(data)
+        }
+    })
+}
+
+socketeer()

static/js/main.js

@@ -0,0 +1,7 @@
+window.onbeforeunload = function () {
+    window.scrollTo(0, 0);
+}
+
+document.addEventListener("DOMContentLoaded", function() {
+    $("#jsEnabled").text("true")
+})

static/js/spin.js

@@ -0,0 +1,102 @@
+const spinSpeed = 30
+var spinFactor = 3
+
+var pfp
+
+var music
+
+if (teto) {
+    music = new Audio("/snds/Triple Baka.ogg")
+} else {
+    music = new Audio("/snds/Lotus Waters.ogg")
+}
+
+music.loop = true
+music.preservesPitch = false
+
+var spins = 0
+var lastSent = 0
+var globalSpins = 0
+
+var spinning = false
+
+var spinWaiting = false
+
+function resetPFP() {
+    $(".pfp")
+}
+
+function lerp(a, b, t) {
+    return a * (1 - t) + b * t
+}
+
+function spinLoop() {
+    spinWaiting = true
+    setTimeout(() => {
+        spinWaiting = false
+        if (spinning) {
+            // music.volume = 0.5
+            if (music.currentTime > 6.5 && teto) {
+                spinFactor = 0.25
+            } else {
+                spinFactor = 3
+            }
+            if (!teto) {
+                music.playbackRate = lerp(music.playbackRate, 1, 1/spinSpeed)
+                music.volume = lerp(music.volume, 0.5, 1/spinSpeed)
+            }
+            spins += 1/spinSpeed / spinFactor
+            if (Math.floor(spins) != lastSent && sock && sock.OPEN) {
+                $(".globalSpins").text(globalSpins + 1)
+                lastSent = Math.floor(spins)
+                // resetPFP()
+                sock.send(`{"op": 4}`)
+                if (spins > 1) {
+                    $(".spinnyCount").css("display", "block")
+                    $(".localSpins").html(lastSent);
+                }
+            }
+        } else {
+            if (!teto) {
+                music.playbackRate = lerp(music.playbackRate, 0.5, 1/spinSpeed)
+                music.volume = lerp(music.volume, -0, 3/spinSpeed)
+            } else {
+                music.pause()
+                music.currentTime = 1.5
+            }
+
+            spins = lerp(spins, Math.round(spins), 1 / spinSpeed * 3)
+        }
+        $(".pfp").css("rotate", (spins * 360) + "deg")
+        spinLoop()
+    }, 1/spinSpeed * 1000);
+}
+
+document.addEventListener("DOMContentLoaded", function() {
+    $("#jsEnabled").text("true")
+
+    pfp = $(".pfp")
+
+    spinLoop()
+
+    pfp.on("mousedown", () => {
+        // if (!spinWaiting) {
+        //     spinLoop();
+        // }
+        music.play()
+
+        spinning = true
+    })
+
+    document.body.onmouseup = () => {
+        if (music.currentTime != 0) {
+            // music.currentTime = 0
+            // music.pause()
+
+            // whipLash.currentTime = 0
+            // whipLash.play()
+
+            spinning = false
+        }
+    }
+})

static/js/timeFormatter.js

@@ -0,0 +1,50 @@
+function gameTimeFormatter(seconds) {
+    seconds = Math.ceil(seconds / 1000)
+    var minutes = Math.ceil(seconds / 60)
+    var hours = Math.floor(minutes / 60)
+    if (seconds <= 60) {
+        return 'about ' + seconds + ' seconds'
+    } else if (minutes < 60) {
+        return `${minutes} Minutes`
+    }
+
+    return `${hours} hours and ${minutes % 60} minutes`
+
+}
+
+function timeFormatter(seconds) {
+    seconds = Math.ceil(seconds / 1000)
+    var minutes = Math.floor(seconds / 60)
+
+    if (seconds % 60 < 10) {
+        return `${minutes}:0${seconds % 60}`
+    } else {
+        return `${minutes}:${seconds % 60}`
+    }
+}
+
+
+function secondLoop() {
+    $(".durationBarFormatter").each((_, item) => {
+        item = $(item)
+        item.text(`${timeFormatter((Math.min(Date.now(), item.attr("data-end")) - item.attr("data-start")))}/${timeFormatter((item.attr("data-end") - item.attr("data-start")))}`)
+    })
+
+    $(".timeEstimate").each((_, item) => {
+        item = $(item)
+        item.text(gameTimeFormatter(Date.now() - item.attr("data-start")))
+    })
+
+    $(".endEstimate").each((_, item) => {
+        item = $(item)
+        item.text(timeFormatter((item.attr("data-end") - Date.now())))
+    })
+
+    setTimeout(() => {
+        secondLoop()
+    }, 1000);
+}
+
+document.addEventListener("DOMContentLoaded", function() {
+    secondLoop()
+})

static/main.js

@@ -1,269 +0,0 @@
-const discStatuses = {
-    "online": {
-        "text": "Online",
-        "color": "rgb(100, 255, 100)"
-    },
-    "dnd": {
-        "text": "DND",
-        "color": "rgb(255, 100, 100)"
-    },
-    "idle": {
-        "text": "Idle",
-        "color": "rgb(255, 255, 75)"
-    },
-    "offline": {
-        "text": "",
-        "color": "rgb(175, 175, 200)"
-    }
-}
-
-const spinSpeed = 30
-var spinFactor = 3
-
-var date = new Date()
-
-var teto = false
-
-if (date.getDay() == 2) {
-    teto = true
-} 
-
-var pfp
-
-var music
-
-if (teto) {
-    music = new Audio("/snds/Triple Baka.ogg")
-} else {
-    music = new Audio("/snds/Lotus Waters.ogg")
-}
-
-music.loop = true
-music.preservesPitch = false
-
-var sock
-
-var spins = 0
-var lastSent = 0
-var globalSpins = 0
-
-var spinning = false
-
-var firsttimeDebounce = true
-
-var spinWaiting = false
-
-function resetPFP() {
-    $(".pfp").attr("src", "https://api.violets-purgatory.dev/v1/pfp?" + new Date().getTime())
-}
-
-function lerp(a, b, t) {
-    return a * (1 - t) + b * t
-}
-
-function gameTimeFormatter(seconds) {
-    seconds = Math.ceil(seconds / 1000)
-    var minutes = Math.ceil(seconds / 60)
-    var hours = Math.floor(minutes / 60)
-    if (seconds <= 60) {
-        return 'about ' + seconds + ' seconds'
-    } else if (minutes < 60) {
-        return `${minutes} Minutes`
-    }
-
-    return `${hours} hours and ${minutes % 60} minutes`
-
-}
-
-function timeFormatter(seconds) {
-    seconds = Math.ceil(seconds / 1000)
-    var minutes = Math.floor(seconds / 60)
-
-    if (seconds % 60 < 10) {
-        return `${minutes}:0${seconds % 60}`
-    } else {
-        return `${minutes}:${seconds % 60}`
-    }
-}
-
-function spinLoop() {
-    spinWaiting = true
-    setTimeout(() => {
-        spinWaiting = false
-        if (spinning) {
-            // music.volume = 0.5
-            if (music.currentTime > 6.5 && teto) {
-                spinFactor = 0.25
-            } else {
-                spinFactor = 3
-            }
-            if (!teto) {
-                music.playbackRate = lerp(music.playbackRate, 1, 1/spinSpeed)
-                music.volume = lerp(music.volume, 0.5, 1/spinSpeed)
-            }
-            spins += 1/spinSpeed / spinFactor
-            if (Math.floor(spins) != lastSent && sock && sock.OPEN) {
-                $(".globalSpins").text(globalSpins + 1)
-                lastSent = Math.floor(spins)
-                // resetPFP()
-                sock.send(`{"op": 4}`)
-                if (spins > 1) {
-                    $(".spinnyCount").css("display", "block")
-                    $(".localSpins").html(lastSent);
-                }
-            }
-        } else {
-            if (!teto) {
-                music.playbackRate = lerp(music.playbackRate, 0.5, 1/spinSpeed)
-                music.volume = lerp(music.volume, -0, 3/spinSpeed)
-            } else {
-                music.pause()
-                music.currentTime = 1.5
-            }
-
-            spins = lerp(spins, Math.round(spins), 1 / spinSpeed * 3)
-        }
-        $(".pfp").css("rotate", (spins * 360) + "deg")
-        spinLoop()
-    }, 1/spinSpeed * 1000);
-}
-
-function secondLoop() {
-    $(".durationBarFormatter").each((_, item) => {
-        item = $(item)
-        item.text(`${timeFormatter((Math.min(Date.now(), item.attr("data-end")) - item.attr("data-start")))}/${timeFormatter((item.attr("data-end") - item.attr("data-start")))}`)
-    })
-
-    $(".timeEstimate").each((_, item) => {
-        item = $(item)
-        item.text(gameTimeFormatter(Date.now() - item.attr("data-start")))
-    })
-
-    $(".endEstimate").each((_, item) => {
-        item = $(item)
-        item.text(timeFormatter((item.attr("data-end") - Date.now())))
-    })
-
-    setTimeout(() => {
-        secondLoop()
-    }, 1000);
-}
-
-window.onbeforeunload = function () {
-    window.scrollTo(0, 0);
-}
-
-document.addEventListener("DOMContentLoaded", function() {
-    $("#jsEnabled").text("true")
-
-    pfp = $(".pfp")
-
-    spinLoop()
-    secondLoop()
-
-    pfp.on("mousedown", () => {
-        // if (!spinWaiting) {
-        //     spinLoop();
-        // }
-        music.play()
-
-        spinning = true
-
-        pfp.css("transition", "")
-
-        pfp.css("scale", "1.1")
-    })
-
-    document.body.onmouseup = () => {
-        if (music.currentTime != 0) {
-            // music.currentTime = 0
-            // music.pause()
-
-            // whipLash.currentTime = 0
-            // whipLash.play()
-
-            spinning = false
-
-            // pfp.style.transition  = "all 3s cubic-bezier(0.39, 0.575, 0.565, 1)"
-
-            pfp.css("scale", "1")
-        }
-    }
-    socketeer()
-})
-
-var lastPong = Date.now()
-
-function ping(dur) {
-    sock.send(JSON.stringify({
-        op: 3
-    }))
-    setTimeout(() => {
-        ping(dur)
-        if (Date.now() - lastPong > 120000) {
-            sock.close()
-            console.log("Max duration since last pong exceeded- Closing socket.")
-        }
-    }, dur);
-}
-
-function socketeer() {
-    sock = new WebSocket('wss://api.violets-purgatory.dev')
-
-    sock.addEventListener("open", () => {
-        ping(30000)
-    })
-
-    sock.addEventListener("error", (error) => {
-        console.log(error)
-    })
-
-    sock.addEventListener("close", () => {
-        console.log("Connection Closed. Attempting Reconnect in 30 seconds.")
-        $("#apiConnected").text("false")
-        setTimeout(() => {
-            socketeer()
-        }, 30000);
-    })
-
-    sock.addEventListener("message", async (data) => {
-        data = data.data
-        data = JSON.parse(data)
-        if (data.op == 4) {
-            $("#apiConnected").text("true")
-            globalSpins = data.spins
-            if (firsttimeDebounce == true) {
-                firsttimeDebounce = false
-                $(".globalSpins").innerHTML = globalSpins + 1;
-            } else {
-                $(".globalSpins").innerHTML = globalSpins;
-            }
-        } else if (data.op == 0) {
-            var lanyard = data.d
-            var statusInfo = discStatuses[lanyard.discord_status]
-            var lastStatus = $(".statusColor")
-
-            if (lastStatus.text() != statusInfo.text) {
-                lastStatus.text(statusInfo.text)
-                lastStatus.css("color", statusInfo.color)
-
-                pfp.css("borderColor", statusInfo.color)
-
-                resetPFP()
-            }
-
-            // if (lanyard.activities[0] && lanyard.activities[0].type == 4) {
-            //     document.querySelector(".customStatus").innerHTML = `<hr><img src=""><p>${lanyard.activities[0].state}</p>`
-            // } else {
-            //     document.querySelector(".customStatus").innerHTML = ""
-            // }
-
-            var discFetch = await (await fetch("/discHTML")).text()
-            $("#activityHtml").html(discFetch)
-        } else if (data.op == 3) {
-            lastPong = Date.now()
-        } else {
-            console.log(data)
-        }
-    })
-}

static/root.css

@@ -3,11 +3,17 @@
     intended for the main page of the site!
 */
 
+body {
+    animation: hideContent 1s;
+}
+
 .mainTitle {
     font-size: min(calc(2rem + 2vw), 3rem);
     display: block;
     padding-top: 5px;
     line-height: min(calc(2.2rem + 2vw), 3rem);
+
+    color: rgb(175, 125, 255);
 }
 
 #card {
@@ -34,6 +40,8 @@
 
 .animatedTitle {
     animation: mainText 2s cubic-bezier(0.075, 0.82, 0.165, 1);
+    /* animation-delay: 1s; */
+    animation-fill-mode: both;
     margin: auto;
     max-width: 75%;
     padding-top: 30px;
@@ -41,8 +49,9 @@
 }
 
 .animatedMain {
-    opacity: 1;
-    animation: fadeDelay 2s cubic-bezier(0.075, 0.82, 0.165, 1);
+    animation: fadeDelay 1s cubic-bezier(0.075, 0.82, 0.165, 1);
+    animation-delay: 1.25s;
+    animation-fill-mode: both;
 }
 
 .pfp {
@@ -61,6 +70,10 @@
     animation-iteration-count: infinite;
 }
 
+.pfp:active {
+    scale: 1.1;
+}
+
 .CLAlign {
     display: inline-block;
 }
@@ -82,6 +95,10 @@ img:not(.project-inner > div > img):not(.activity>img) {
     transition: all 2s cubic-bezier(0.075, 0.82, 0.165, 1);
 }
 
+.statusColor {
+    transition: color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
+}
+
 @keyframes spinny {
     0% {
         rotate: 0deg;
@@ -92,16 +109,26 @@ img:not(.project-inner > div > img):not(.activity>img) {
     }
 }
 
+@keyframes fadeDelay {
+    0% {
+        display: none;
+        opacity: 0;
+        transform: translateY(25vh);
+    }
+
+    100% {
+        display: block;
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
 @keyframes mainText {
     0% {
         transform: translateY(calc(50vh - 6rem)) scale(1.5);
-        opacity: 0;
-        /* height: 4rem; */
     }
 
     50% {
-        opacity: 1;
-        /* height: 4rem; */
         transform: translateY(calc(50vh - 6rem)) scale(1.25);
     }
 
@@ -110,35 +137,13 @@ img:not(.project-inner > div > img):not(.activity>img) {
     }
 }
 
-.statusColor {
-    transition: color 2s cubic-bezier(0.075, 0.82, 0.165, 1);
-}
-
-@keyframes fadeDelay {
-    0% {
-        opacity: 0;
-        display: none;
-    }
-
-    66% {
-        opacity: 0;
-        transform: translateY(25vh);
-        display: none;
-    }
-
-    100% {
-        opacity: 1;
-        transform: none;
-    }
-}
-
 @keyframes hideContent {
     0% {
         overflow-y: hidden;
         overflow-x: hidden;
     }
 
-    30% {
+    100% {
         overflow-y: hidden;
         overflow-x: hidden;
     }

static/socials/index.html

@@ -5,8 +5,7 @@
     <link rel="stylesheet" type="text/css" href="../style.css">
     <link rel="stylesheet" type="text/css" href="../subpage.css">
 
-    <script src="../jquery.js"></script>
-    <script src="../main.js"></script>
+    {SUBPAGE_JS}
 
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">

static/stats/index.html

@@ -5,8 +5,7 @@
     <link rel="stylesheet" type="text/css" href="../style.css">
     <link rel="stylesheet" type="text/css" href="../subpage.css">
 
-    <script src="../jquery.js"></script>
-    <script src="../main.js"></script>
+    {SUBPAGE_JS}
 
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">

static/style.css

@@ -65,14 +65,10 @@ main:nth-of-type(1), .mainDiv {
 }
 
 body {
-    overflow-x: hidden;
-
-    background-color: rgb(55, 4, 75);
+    background-color: rgb(20, 4, 50);
     background: linear-gradient(rgb(30, 4, 75), black);
 
     background-attachment: local;
-
-    animation: hideContent 2.5s;
 }
 
 body, html {