This repository has been archived on 2023-07-08. You can view files and clone it, but cannot push or open issues or pull requests.
awesome/index.html
2023-07-07 20:28:43 +00:00

102 lines
No EOL
2.5 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>awesome</title>
<style>
@import url('https://fonts.googleapis.com/css2?family=Belanosima:wght@400;600;700&display=swap');
:root {
font-family: 'Belanosima', sans-serif;
}
body {
text-align: center;
color: white;
background: #090524;
overflow-x: hidden;
}
ul {
border: 1px solid lightgray;
border-radius: 10px;
padding: 10px;
width: 400px;
margin: auto;
list-style-type: none;
}
#header {
//text-transform: uppercase;
color: #fff;
}
/* unvisited link */
a:link {
color: pink;
}
/* visited link */
a:visited {
color: lightgray;
}
a:visited::after {
content: " (visited)";
}
/* mouse over link */
a:hover {
color: hotpink;
}
/* selected link */
a:active {
color: white;
}
</style>
</head>
<body>
<h1 id="header">awesome.colean.cc</h1>
<img src="res/awdog.png" width="160"><br>
awdog, the mascot of awesome
<br><br>
<ul>
<li><a href="https://git.colean.cc/awesomeuser/awesome.git">@gitrepo</a></li>
<li><a href="proj/wolfystein.html">@Wolfystein3D</a></li>
</ul>
<script>
var header = document.getElementById("header");
async function update(timestamp) {
let t = timestamp / 500;
let x = Math.cos(t) * 20;
let y = Math.sin(t) * 20;
header.style.transform = "translate(" + x + "px, " + y + "px)";// rotate(" + (Math.cos(t) * -5) + "deg)";
header.style.textShadow = (Math.cos() * 20 - x) + "px " + (Math.sin(t - 0.5) * 20 - y) + "px #c91a29";
//-8px 8px #c94f1a,
//-12px 12px #a6c91a,
//-16px 16px #1ac95a,
//-20px 20px #1a60c9`;
// loop
requestAnimationFrame(update);
}
requestAnimationFrame(update);
</script>
</body>
</html>