Noratrieb/website
1
0
Fork 0
mirror of https://github.com/Noratrieb/website.git synced 2026-01-14 17:05:02 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

STUFF

Browse source
This commit is contained in:
nora 2024-01-21 18:12:51 +01:00
parent 5f1f9bd6a6
commit 2da77e8af5
13 changed files with 314 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

130
static/root/index.html
View file

@ -1,18 +1,118 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>nilstrieb.dev</title>
</head>
<body>
<h1>hi!</h1>
<p>This is my website. It is work in progress.</p>
<h2>my blog</h2>
<p>I have a blog, it might be interesting, maybe.</p>
<a href="/blog">blog</a>
<h2>slides</h2>
<p>i have given one talk, here are its slides, isnt this amazing</p>
<a href="/slides/index.html">slides from talks</a>
</body>
</html>
<link rel="stylesheet" href="static/theme.css" />
<style>
.secret {
color: #5b4561;
cursor: pointer;
}
.social-logo {
height: 50px;
}
.ferrisuwu {
z-index: 1;
position: absolute;
right: -100px;
bottom: 0;
}
.ferrisuwu-animate {
animation-iteration-count: 1;
animation-name: ferrisuwu-enter;
animation-duration: 3s;
}
@keyframes ferrisuwu-enter {
from {
right: -100px;
}
50% {
right: 50px;
}
to {
right: -100px;
}
}
</style>
</head>
<body>
<div class="main-content">
<div class="main-content-inner">
<h1>Nilstrieb's website</h1>
<div>
<p>
this is my website. you'll find lots of interesting and not very interesting stuff here,
depending on where you look.
</p>
<p>
there may be many
<span onclick="onSecretClick()" class="secret" role="button">secrets</span>
depending on where you look....
</p>
</div>
<div>
<h2>socials</h2>
<p>
these two are not everything, but you may find more there, like a choose your own
adventure story: choose your own nils
</p>
<a href="https://github.com/Nilstrieb"
><img class="social-logo" alt="GitHub" src="static/github.svg"
/></a>
<a href="https://hachyderm.io/@nilstrieb"
><img class="social-logo" alt="Mastodon" src="static/mastodon.png"
/></a>
</div>
<div>
<h2>my blog</h2>
<p>i have a blog, it might be interesting, maybe.</p>
<a href="/blog" class="call-to-action">
<span>blog</span>
</a>
</div>
<div>
<h2>slides</h2>
<p>i have given one talk, here are its slides, isnt this amazing</p>
<a href="/slides/index.html" class="call-to-action">
<span>slides from talks</span>
</a>
</div>
<div>
<h2>random projects</h2>
<p>
in addition to all the other stuff mentioned above, i also have some random projects
hosted on my server. they are pretty bad and i won't promote them this openly, but you
will be able to find them if you *really* want to.
</p>
</div>
</div>
</div>
<div>
<img id="ferrisuwu" class="ferrisuwu" src="static/ferrisuwu.webp" />
</div>
<script>
let clickCount = 0;
let ferrisuwuAnimating = false;
function onSecretClick() {
clickCount++;
if (clickCount > 3 && !ferrisuwuAnimating) {
const ferrisuwu = document.getElementById("ferrisuwu");
ferrisuwu.classList.add("ferrisuwu-animate");
ferrisuwuAnimating = true;
setTimeout(() => {
ferrisuwu.classList.remove("ferrisuwu-animate");
ferrisuwuAnimating = false;
}, 3000);
}
}
</script>
</body>
</html>