jolzem/olzem.org
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Redo website styling

Browse Source
This commit is contained in:
Johannes Olzem
2025-11-09 20:06:24 +01:00
parent 202b607fa5
commit 4633c08da8
36 changed files with 639 additions and 496 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+56 -51
View File
@@ -2,65 +2,70 @@
<html lang="en">
<head>
<title>Johannes Olzem</title>
<meta name="description" content="Johannes Olzem"s personal website">
<meta name="description" content="Johannes Olzem's personal website">
<meta charset="utf-8">
<link rel="stylesheet" href="/css/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="/favico.ico">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
</head>
<body class="body">
<header>
<a href="/">
<img src="/img/logo.png">
<body class="landing">
<nav>
<a href="/" class="header-logo">
<img src="/img/header-logo.webp" alt="logo">
</a>
<a href="/about/">About</a>
<a href="/blog/">Blog</a>
<a href="/contact/">Contact</a>
</header>
<span class="header-text">Johannes Olzem</span>
<ul>
<li>
<a href="/about/">About</a>
</li>
<li>
<a href="/blog/">Blog</a>
</li>
<li>
<a href="/contact/">Contact</a>
</li>
</ul>
</nav>
<main>
<h1>Johannes Olzem</h1>
<blockquote>Less is more</blockquote>
<h2>Welcome to my webspace</h2>
<p>
I'm Johannes, a computer enthusiast from Germany. On this website I
maintain my <a href="blog">blog</a> about various topics and you can
learn more about me <a href="/about/">here.</a> If you want to get in
touch with me, you can do that <a href="/contact/">here</a>.
</p>
<h2>Why run this website?</h2>
<p>
The internet used to be a place of personal expression, not just
corporate dominance. I believe in keeping that spirit alive.
<br>
This site is a small step towards a more independent web.
It also allows me to share my experiences, how I do things, and other
stuff that I want to put out into the world.
<br>
Please feel free to explore every crevasse of this site! Don't know where
to start? Try the <a href="/about/">about</a> page, to learn more about
who I am.
</p>
<br>
<div class="cowsay-wrapper">
<p class="cowsay">
_____________________________
&#60; Have fun on this website! &#62;
-----------------------------
\ ^__^
\ (oo)\_______
(__)\ )\/\
||----w |
|| ||
</p>
<div class="landing-grid">
<div class="landing tl"></div>
<div class="landing tr">Johannes Olzem</div>
<div class="landing bl">less is more</div>
<div class="landing br"><span>&#8964;</span></div>
</div>
<br>
<div class="cards">
<img src="/img/linux_powered.gif" alt="Linux powered">
<img src="/img/vim.gif" alt="vim">
<img src="/img/nocookie.gif" alt="No Cookies">
<img src="/img/bestvieweddesktop.gif" alt="Best viewed with desktop">
<img src="/img/internetprivacy.gif" alt="Internet privacy now!">
<img src="/img/smile.gif" alt="Have a smile">
<div class="landing-lower">
<div class="landing ll">
<h2>Welcome</h2>
<p>
Welcome to my Webspace!
I'm Johannes, a computer enthusiast from Germany. On this website I
maintain my
<a href="/blog/">blog</a> about various topics and you can learn more
about me
<a href="/about">here.</a> If you want to get in touch with me, feel
free to do that
<a href="/contact/">here.</a>
</p>
</div>
<div class="landing lr">
<h2>Why run this website?</h2>
<p>
The internet used to be a place of personal expression, not just
corporate dominance. I believe in keeping that spirit alive.<br>
This site is a small step towards a more independent web. It also
allows me to share my experiences, how I do things, and other stuff
that I want to put out into the world.<br>
Please feel free to explore every crevasse of this site! Don't know
where to start? Try the
<a href="/about/">about</a> page, to learn more about who I am.
</p>
</div>
</div>
</main>
<footer>