added demons stuff

2021-12-07 11:34:10 -05:00
parent 784b426ad9
commit e0c042ea31
4 changed files with 143 additions and 0 deletions
@@ -0,0 +1,67 @@
+body {
+    background-color:black;
+    font-family: 'Gochi Hand', cursive;
+}
+
+a {
+    color:white;
+}
+
+a:hover {
+    color:gray;
+}
+
+#landingBack {
+    margin-top: 25px;
+    text-align: center;
+
+    -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
+       -moz-animation: fadein 2s; /* Firefox < 16 */
+        -ms-animation: fadein 2s; /* Internet Explorer */
+         -o-animation: fadein 2s; /* Opera < 12.1 */
+            animation: fadein 2s;
+}
+
+#landingData {
+    /* Animation Stuff */
+    -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
+    -moz-animation: fadein 2s; /* Firefox < 16 */
+     -ms-animation: fadein 2s; /* Internet Explorer */
+      -o-animation: fadein 2s; /* Opera < 12.1 */
+         animation: fadein 2s;
+        animation-delay: 1.3s;
+        animation-fill-mode:both;
+
+        text-align:center;
+}
+
+/* Animations */
+
+@keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Firefox < 16 */
+@-moz-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Safari, Chrome and Opera > 12.1 */
+@-webkit-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Internet Explorer */
+@-ms-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
+
+/* Opera < 12.1 */
+@-o-keyframes fadein {
+    from { opacity: 0; }
+    to   { opacity: 1; }
+}
@@ -0,0 +1,31 @@
+async function generateCountdown() {
+    var countDownDate = new Date("12/07/2021 11:09 AM").getTime();
+
+    // Update the count down every 1 second
+    var x = setInterval(function() {
+
+    // Get today's date and time
+    var now = new Date().getTime();
+
+    // Find the distance between now and the count down date
+    var distance = countDownDate - now;
+
+    // Time calculations for days, hours, minutes and seconds
+    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
+    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
+    var seconds = Math.floor((distance % (1000 * 60)) / 1000);
+
+    // Display the result in the element with id="demo"
+    document.getElementById("countdown").innerHTML = days + "d " + hours + "h "
+    + minutes + "m " + seconds + "s ";
+
+    // If the count down is finished, write some text
+    if (distance < 0) {
+        clearInterval(x);
+        document.getElementById("timeuntil").style.display = "none"
+        document.getElementById("countdown").innerHTML = `Juice WRLD Day is on!<br>Watch it live on <a href="https://twitch.tv/amazonmusic" target="_blank">Amazon Music's</a> Twitch page.<br><br>
+        <iframe src="https://player.twitch.tv/?channel=amazonmusic&parent=awexxx.xyz"height="50%"width="50%"allowfullscreen="true"></iframe>`;
+    }
+    }, 1000);
+}
@@ -0,0 +1,45 @@
+<html>
+    <head>
+        <title>👊😈</title>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <link rel="stylesheet" href="assets/css/main.css">
+        <link rel="preconnect" href="https://fonts.googleapis.com">
+        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+        <link href="https://fonts.googleapis.com/css2?family=Gochi+Hand&display=swap" rel="stylesheet">
+    </head>
+    <body onload="generateCountdown()">
+        <div id="landingBack">
+            <img style="max-width:80%;" src="assets/img/fighting-demons.png">
+        </div>
+
+        <div id="landingData">
+            <h3 id="timeuntil" style="color:white; font-size:30px;">Time until Juice WRLD Day:</h3>
+            <p style="color:white; font-size:25px;" id="countdown"></p>
+        </div>
+
+            <div style="color:white; text-align:center; font-size:20px;" id="landingData">
+
+                <h3>Important Dates</h3>
+                    <p>December 2nd - Juice's Birthday</p>
+                    <p>December 8th - 2 years without Juice</p>
+                    <p>December 10th - "Fighting Demons" Album Drop</p>
+                    <p>December 16th - "Juice WRLD: Into The Abyss" Premiere on HBO.</p><br>
+
+                <h3>What's this site about?</h3>
+                    <p>This site is fan-made by <a href="https://github.com/awexxx" target="_blank">Awex</a> to commemorate Jarad "Juice WRLD" Higgins during the month of December.</p>
+
+                <h3>Who is Juice WRLD?</h3>
+                    <p>Jarad Anthony Higgins was a rapper, singer and songwriter from Chicago. He struck stardom with his hit songs "Lucid Dreams" and "All Girls Are The Same" in 2018.<br>
+                    Between 2018 and 2019, he released 2 albums; "Goodbye & Good Riddance" & "Death Race for Love" and recorded thousands of songs.<br>
+                    Unfortunately, on December 8th 2019, Jarad suffered a codeine and oxycodone overdose after landing at Chicago International Airport.</p>
+            </div>
+
+
+        <div id="footer" style="text-align:center; font-size:70%; font-family:Arial, Helvetica, sans-serif; color:white;">
+            <p>All content rights go to Grade A Productions.<br>
+            This website is fan-made and not in any way related to Grade A Productions/Interscope Records.</p>
+        </div>
+
+        <script src="assets/js/countdown.js"></script>
+    </body>
+</html>