You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

137 lines
5.1 KiB

<!DOCTYPE html>
<meta charset="utf-8" />
<title>Benjamin Bädorf</title>
<meta name="theme-color" content="#000000" id="theme-color" />
<meta name="description" content="Benjamin Bädorf writes code. I do some freelance stuff every once in a while.">
<meta name="Keywords" content="webdevelopment frontend javascript node freelance website why am i even doing this">
<link href="/fonts.css?1" rel="stylesheet">
html {
font-family: 'Urbanist', sans-serif;
font-size: 24px;
line-height: 1.3em;
color: #111111;
font-weight: normal;
body {
padding: 2vw;
background-color: white;
display: flex;
flex-direction: column;
body > * {
width: 100%;
max-width: 660px;
header {
display: flex;
align-items: center;
img {
border-radius: 50%;
width: 3rem;
margin-right: 1rem;
h1 {
font-size: 2rem;
font-weight: black;
line-height: 1.5rem;
p {
font-weight: black;
margin: 0px;
padding: 0px;
p, details {
margin-top: 1rem;
.hidden {
display: none;
<img src="/cows.jpg" alt="An image of three cows taken in the dark with a flashlight. I shot this over 15 years ago as a teenager and I don't think I have the original file. All that remains is this jpg that was processed a million times, but somehow it still captures the original vibe." />
<p>My name is Ben <span id="aka">AKA <span>b12f</span><span class="hidden">Yule</span><span class="hidden">Benjamin Bädorf</span></span> and I often spend my time engineering software.</h1>
Stuff I work(ed) on that I find interesting includes
<a href="" target="_blank" title="MiOM">this</a>
<a href="" target="_blank" title="Source code">[1]</a>
<a href="" target="_blank" title=" homepage">this</a>
<a href="" target="_blank" title="Source code">[1]</a>
<a href="" target="_blank" title="PubSolarOS">this</a>,
<a href="" target="_blank" title="">this</a>
<a href="" target="_blank" title="Server source code">[1]</a>
<a href="" target="_blank" title="Client source code">[2]</a>
<a href="" target="_blank" title=" homepage">this</a>,
<a href="" target="_blank" title=" management interface">this</a>,
<a href="" target="_blank" title="FLEXBOX digital toolbox homepage">this</a>,
<a href="" target="_blank" title="FLEXBOX digital toolbox dashboard">this</a>,
<a href="" target="_blank" title="Brix Design System">this</a>,
<a href="" target="_blank" title="OpenProject GmbH">this</a>
<a href="" target="_blank" title="OpenProject source code">[1]</a>
<a href="" target="_blank" title="Abkommen 60 Jahre homepage">this</a>,
<a href="" target="_blank" title="wlstreamer">this</a>,
<a href="" target="_blank" title="unitfile parser">this</a>, and
<a href="" target="_blank" title="Schlechtenburg">this</a>.
You can write me a mail <a href="" title="Send me a mail!">here</a>,
chat with me on Matrix <a href="" title="My Matrix @">here</a>,
see my toots <a rel="me" href="" title="My Mastodon @">here</a>
and see more of my code <a href="" target="_blank" title="My GitHub profile">here</a> and <a href="" target="_blank" title="Private Gitea. The better stuff is here.">here</a>.
>4332 E0D0 2B21 4D31 376C 366E 4406 E80E 13CD 656C</a>
var aka = document.getElementById('aka');
var akas = aka.children;
var current = 0;
setInterval(function() {
akas[current].setAttribute('class', 'hidden');
if (current >= akas.length) {
current = 0;
akas[current].setAttribute('class', '');
}, 2000);
console.log('Kissinger should die in prison for crimes against humanity.');