added links page
This commit is contained in:
awexxx
@@ -0,0 +1,116 @@
|
|||||||
|
html, body {
|
||||||
|
margin: 0;
|
||||||
|
height: 100%;
|
||||||
|
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif
|
||||||
|
}
|
||||||
|
|
||||||
|
html{
|
||||||
|
background-color:black;
|
||||||
|
background-size:cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
color:gray;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background-size: 400% 400%;
|
||||||
|
padding-top:35px;
|
||||||
|
padding-bottom:35px;
|
||||||
|
height:fit-content;
|
||||||
|
min-height:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes gradient {
|
||||||
|
0% {
|
||||||
|
background-position: 0% 50%;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
background-position: 100% 50%;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
background-position: 0% 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--accentColor: #E6E6E6;
|
||||||
|
--delay: .3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description, .source{
|
||||||
|
color:white;
|
||||||
|
text-align:center;
|
||||||
|
margin: 27px auto;
|
||||||
|
margin-top:10px;
|
||||||
|
width:90%;
|
||||||
|
max-width: 500px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.source{
|
||||||
|
font-size:small;
|
||||||
|
margin-top:50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profilePicture, .profilePicture img {
|
||||||
|
position: relative;
|
||||||
|
width: 130px;
|
||||||
|
height: 130px;
|
||||||
|
display: block;
|
||||||
|
margin: 35px auto 20px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.userName {
|
||||||
|
color: var(--accentColor);
|
||||||
|
font-size: x-large;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 1.25;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.links {
|
||||||
|
max-width: 675px;
|
||||||
|
width: auto;
|
||||||
|
display: block;
|
||||||
|
margin: 27px auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link {
|
||||||
|
position: relative;
|
||||||
|
background-color: transparent;
|
||||||
|
color: var(--accentColor);
|
||||||
|
border: solid var(--accentColor) 2px;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-size: 1rem;
|
||||||
|
text-align: center;
|
||||||
|
display: block;
|
||||||
|
margin-left: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding: 10px;
|
||||||
|
text-decoration: none;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (hover: hover) {
|
||||||
|
.link:hover {
|
||||||
|
background-color: var(--accentColor);
|
||||||
|
color: #000; /* Fallback for older browsers */
|
||||||
|
color: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.link:active {
|
||||||
|
background-color: var(--accentColor);
|
||||||
|
color: #000; /* Fallback for older browsers */
|
||||||
|
color: rgba(0, 0, 0, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
@@ -0,0 +1,27 @@
|
|||||||
|
// a key map of allowed keys
|
||||||
|
var allowedKeys = {
|
||||||
|
37: 'left',
|
||||||
|
38: 'up',
|
||||||
|
39: 'right',
|
||||||
|
40: 'down',
|
||||||
|
65: 'a',
|
||||||
|
66: 'b'
|
||||||
|
};
|
||||||
|
|
||||||
|
var code = ['up', 'up', 'down', 'down', 'left', 'right', 'left', 'right', 'b', 'a'];
|
||||||
|
var pos = 0;
|
||||||
|
|
||||||
|
// add keydown event listener
|
||||||
|
document.addEventListener('keydown', function(e) {
|
||||||
|
var key = allowedKeys[e.keyCode];
|
||||||
|
var requiredKey = code[pos];
|
||||||
|
if (key == requiredKey) {
|
||||||
|
pos++;
|
||||||
|
if (pos == code.length) {
|
||||||
|
location = `https://www.youtube.com/watch?v=dQw4w9WgXcQ`
|
||||||
|
pos = 0;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
pos = 0;
|
||||||
|
}
|
||||||
|
});
|
||||||
@@ -1,67 +0,0 @@
|
|||||||
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; }
|
|
||||||
}
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 63 KiB |
@@ -1,31 +0,0 @@
|
|||||||
async function generateCountdown() {
|
|
||||||
var countDownDate = new Date("12/09/2021 09:00 PM").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);
|
|
||||||
}
|
|
||||||
@@ -1,47 +0,0 @@
|
|||||||
<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>
|
|
||||||
|
|
||||||
<hr style="width:50%;">
|
|
||||||
</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>
|
|
||||||
@@ -67,6 +67,7 @@
|
|||||||
<div class="c1iframe" style="text-align:center;"></div>
|
<div class="c1iframe" style="text-align:center;"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script src="/assets/js/secret.js"></script>
|
||||||
<div id="socials" style="background-color:#2e2e2e; padding-top:10px; padding-bottom:10px; text-align:center;">
|
<div id="socials" style="background-color:#2e2e2e; padding-top:10px; padding-bottom:10px; text-align:center;">
|
||||||
<h3 style="color:white;">Socials!</h3>
|
<h3 style="color:white;">Socials!</h3>
|
||||||
<p style="color:azure;">I am all over! You can find the hub for all of my links <a href="https://linktr.ee/lulawexlive" target="_blank">here.</a></p>
|
<p style="color:azure;">I am all over! You can find the hub for all of my links <a href="https://linktr.ee/lulawexlive" target="_blank">here.</a></p>
|
||||||
|
|||||||
+60
@@ -0,0 +1,60 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en-US">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>lulawexLIVE >> Links</title>
|
||||||
|
<link rel="stylesheet" href="assets/css/tree.css">
|
||||||
|
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css">
|
||||||
|
|
||||||
|
<!-- Meta Tags -->
|
||||||
|
<meta property="og:site_name" content="Awex" />
|
||||||
|
<meta content="Awex > Links" property="og:title">
|
||||||
|
<meta content="https://awexxx.xyz/links" property="og:url">
|
||||||
|
<meta content="#363636" name="theme-color" data-react-helmet="true">
|
||||||
|
<meta property="og:description" content="See where you can find me around the internet! I'm in a lot of places. Actually, now that I list it, more than I thought i was..">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<a class="profilePicture">
|
||||||
|
<img src="https://pbs.twimg.com/profile_images/1469925836212125696/v8Y_YkJS_400x400.jpg" alt="Profile Picture">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<div class="userName">
|
||||||
|
lulawexLIVE
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="description">
|
||||||
|
probably clipping stuff on Medal
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="links">
|
||||||
|
<a class="link" href="https://medal.tv/users/215577" target="_blank">
|
||||||
|
<i class="fas fa-medal"> </i>Medal.tv
|
||||||
|
</a>
|
||||||
|
<a class="link" href="https://last.fm/user/lulawex" target="_blank">
|
||||||
|
<i class="fab fa-lastfm"> </i>Last.fm
|
||||||
|
</a>
|
||||||
|
<a class="link" href="https://github.com/awexxx" target="_blank">
|
||||||
|
<i class="fab fa-github"> </i>Github
|
||||||
|
</a>
|
||||||
|
<a class="link" href="discord:///users/288101780074528768" target="_blank">
|
||||||
|
<i class="fab fa-discord"> </i>Discord
|
||||||
|
</a>
|
||||||
|
<a class="link" href="https://www.instagram.com/thatoneawex/" target="_blank">
|
||||||
|
<i class="fab fa-instagram"> </i>Instagram
|
||||||
|
</a>
|
||||||
|
<a class="link" href="https://www.reddit.com/user/lulawex" target="_blank">
|
||||||
|
<i class="fab fa-reddit"> </i>Reddit
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="source">
|
||||||
|
This was built on <a href="https://github.com/RyanLefebvre/TREE">Tree</a>, a linktr.ee alternative.
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user