Skip to content

Instantly share code, notes, and snippets.

View unrealapex's full-sized avatar
💭
write less shitty software

Aaron unrealapex

💭
write less shitty software
View GitHub Profile
Cues Notes

Summary

@unrealapex
unrealapex / fade.css
Last active October 19, 2021 22:26
css fade in and out animation
.fade {
animation: fade 2s ease-in infinite;
}
@keyframes fade {
0% {
opacity: 0;
}
25% {
opacity: 0.5;
@unrealapex
unrealapex / boilerplate.html
Created October 3, 2021 21:40
HTML Boilerplate
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title></title>
</head>
<body>
// code taken from https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest
function reqListener () {
console.log(this.responseText);
}
var oReq = new XMLHttpRequest();
oReq.addEventListener("load", reqListener);
oReq.open("GET", "http://www.example.org/example.txt");
oReq.send();

This file was edited using the power of Vim

return string.split(/\s+/).length;
<!-- code taken from here: https://css-tricks.com/emoji-as-a-favicon/ -->
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🎯</text></svg>">
/* The rgb gradient found in sections of the Steam Deck website: https://www.steamdeck.com/en/
https://www.steamdeck.com/public/css/global.css?v=OKFbGyMfa7Jk&_cdn=cloudflare */
.gradient {
background: linear-gradient(137.42deg, #1a75ff, #6a5df8, #c957e6, #d2486b, #bf44ac, #ab47d0, #9460f3, #46aced, #4ec4a3, #b8ba05, #d2486b);
background-size: 2200% 2200%;
-webkit-animation: DeckGradient 60s ease infinite;
-moz-animation: DeckGradient 60s ease infinite;
animation: DeckGradient 60s ease infinite;
}
// taken from Stack Overflow: https://stackoverflow.com/a/63695199/14111707
document.addEventListener("visibilitychange", (event) => {
if (document.visibilityState == "visible") {
console.log("tab is active")
} else {
console.log("tab is inactive")
}
});