diff --git a/about/index.html b/about/index.html index fcabcfa..703d432 100755 --- a/about/index.html +++ b/about/index.html @@ -1,53 +1,60 @@ - - - - About - Johannes Olzem - - - - - - - -
-
-

Johannes Olzem's Webspace

-
- -
- -

About Me

-

- Hi!
- I'm Johannes, a computer nerd born and living in germany.
- I am currently a student, majoring in IT and english.
- I like free and open source software, Linux, servers, privacy and playing video games in my free time.
- There is not much I like outside of computers, but some things include videography and cars. -

-

My Skills

-

HTML & CSS

-

Basic JavaScript

-

Basic Python

-

Currently learning Java

-

Docker

- -

About this website

-

- This website is free and open source under the GNU General Public License v3.
- View Source Code
- It also has no ads or trackers and does not use cookies.
- View Everforest Theme -

-
- -
- - + + + + About - Johannes Olzem + + + + + + + +
+
+ Johannes Olzem's Webspace +
+ +
+ +

About Me

+

+ Hey there!
+ My name is Johannes, and I'm a computer enthusiast born and raised in Germany. + Currently, I'm majoring in IT and English, and I'm passionate about most things related to technology. + I love using free and open-source software, exploring different aspects about Linux, setting up and tinkering with servers, + and learning about privacy and security. When I'm not busy with the command line, I enjoy playing video games and dabbling in 3D Printing. + Apart from computers, I also have an interest in cars, ranging from classic to modern sports cars. +

+

My Skills

+

Languages

+ +

Other Technologies

+ + +

About this website

+

+ This website has no ads or trackers and does not use cookies.
+ It is also free and open source under the GNU General Public License v3.
+ View Source Code
+

+
+ +
+ + diff --git a/blog/index.html b/blog/index.html index 8520b82..74084e5 100755 --- a/blog/index.html +++ b/blog/index.html @@ -1,34 +1,33 @@ - - - - Johannes Olzem - - - - - - - -
-
-

Johannes Olzem's Webspace

-
- -
-

Blog

-
- Quick Fixes -
-
- -
- - + + + + Blog - Johannes Olzem + + + + + + + +
+
+ Johannes Olzem's Webspace +
+ +
+

Blog

+
+ Quick Fixes +
+
+ +
+ + diff --git a/blog/quick-fixes/index.html b/blog/quick-fixes/index.html index 1197384..3fc3744 100755 --- a/blog/quick-fixes/index.html +++ b/blog/quick-fixes/index.html @@ -1,75 +1,74 @@ - - - - Johannes Olzem - - - - - - - -
-
-

Johannes Olzem's Webspace

-
- -
-

Quick Fixes

-

- This is a page with small problems, to which I have found easy solutions, - so as to not litter the blog page. -


- -
- -
- - + + + + Quick Fixes - Blog - Johannes Olzem + + + + + + + +
+
+ Johannes Olzem's Webspace +
+ +
+

Quick Fixes

+

+ This is a page with small problems, to which I have found easy solutions, + so as to not litter the blog page. +


+ +
+ +
+ + diff --git a/contact/index.html b/contact/index.html index b5ba643..e7ef18e 100755 --- a/contact/index.html +++ b/contact/index.html @@ -1,35 +1,34 @@ - - - - Contact - Johannes Olzem - - - - - - - -
-
-

Johannes Olzem's Webspace

-
- -
-

Contact

-

- Email me: - jolzem@pm.me -

-
- -
- - + + + + Contact - Johannes Olzem + + + + + + + +
+
+ Johannes Olzem's Webspace +
+ +
+

Contact

+

+ Email me: + jolzem@pm.me +

+
+ +
+ + diff --git a/css/style.css b/css/style.css index f6cd757..dd284f3 100755 --- a/css/style.css +++ b/css/style.css @@ -1,14 +1,8 @@ -@font-face { - font-family: "Consolas"; - src: url("Consolas.woff2") format("woff2"); -} - :root { - --txt: #d3c6aa; - --accent: #a7c080; - --body-bg: #2d353b; - --dark: #232a2e; - --border: 4pt; + --txt: #c4c7c4; + --body-bg: #272c31; + --dark: #000; + --accent: #42a5f5; --font-body: "Consolas", monaco, "Liberation Mono", "Lucida Console", monospace; } @@ -21,19 +15,23 @@ body { } #root { - max-width: 900px; + max-width: 1000px; min-height: 100vh; margin: 0 auto; - border-radius: var(--border); } header { - padding: 1rem 0; - border-radius: inherit; + padding: 1.5rem 0; } -header h1 { +header a { color: var(--accent); + font-size: 2rem; + font-weight: bold; +} + +header a:hover { + text-decoration: none !important; } nav { @@ -54,6 +52,13 @@ main p { margin: 0 auto; } +main ul { + margin: 0 auto; + margin-bottom: 2rem; + max-width: fit-content; + text-align: left; +} + .blog-entries a { padding-top: 1rem; display: block; @@ -75,6 +80,7 @@ h6 { p { margin: 1rem; font-size: 1.1em; + line-height: 1.5rem; } a { @@ -98,13 +104,3 @@ a:active { text-decoration: underline !important; color: var(--accent); } - -/* Auto double line break */ -br:after { - content: "\a\a"; - white-space: pre; -} - -br { - content: ""; -} diff --git a/donate/index.html b/donate/index.html index fe2f598..d2c0f21 100755 --- a/donate/index.html +++ b/donate/index.html @@ -1,36 +1,35 @@ - - - - Donate - Johannes Olzem - - - - - - - -
-
-

Johannes Olzem's Webspace

-
- -
-

Donate

-

There is basically no point in giving me money, but you can still do so by donating Monero, my cryptocurrency of choice

-
-

4BK7poh4kom8tti2HReRjQFbooWNiCiYj6sYfq4jdqBBhfN1FWn3an4ZRb1fytH5363vzyvTxBKzd5UphnexhJ7t1kjzTzP

-
- -
- -
- - + + + + Donate - Johannes Olzem + + + + + + + +
+
+ Johannes Olzem's Webspace +
+ +
+

Donate

+

There is basically no point in giving me money, but you can still do so by donating Monero, my cryptocurrency of choice

+
+

4BK7poh4kom8tti2HReRjQFbooWNiCiYj6sYfq4jdqBBhfN1FWn3an4ZRb1fytH5363vzyvTxBKzd5UphnexhJ7t1kjzTzP

+
+ +
+ +
+ + diff --git a/index.html b/index.html index 4828491..301297f 100755 --- a/index.html +++ b/index.html @@ -1,49 +1,49 @@ - - - - Johannes Olzem - - - - - - - -
-
-

Johannes Olzem's Webspace

-
- -
-

Welcome to my Webspace!

-

- Here I maintain my blog - about various topics and with various guides.
- You can learn more about me here. -

-

Why run this website?

-

- As you (should) know, most websites collect data about you.
- This is especially true for social media sites, which this is supposed to be a substitute for.
- I still use some social media like Reddit and Twitter, but basically just to look at what other people are doing and to share stuff with some communities. But back to my rant:
- So the only logical option in my mind was to make a website with some kind of blog function to share my opinion and help people with problems, that I have had and solved.
- And now you are here! I don't know how you got here, but feel free to explore every crevasse of this site. -

-
-
- - - -
- -
- - + + + + Johannes Olzem + + + + + + + +
+
+ Johannes Olzem's Webspace +
+ +
+

Welcome to my Webspace!

+

+ Here I maintain my blog + about various topics and with various guides.
+ You can learn more about me here.
+ I strive to expand and restore the minimal web +

+

Why run this website?

+

+ As you (should) know, most websites collect data about you.
+ This is especially true for social media sites, which this is supposed to be a substitute for.
+ I still use some social media like Reddit and Twitter, but basically just to look at what other people are doing and to share stuff with some communities. But back to my rant:
+ So the only logical option in my mind was to make a website with some kind of blog function to share my opinion and help people with problems, that I have had and solved.
+ And now you are here! I don't know how you got here, but feel free to explore every crevasse of this site. +

+
+
+ landchad + vim + tux +
+ +
+ + diff --git a/schule/info/html/projekt/contact.html b/schule/info/html/projekt/contact.html index 9438631..320cfa1 100644 --- a/schule/info/html/projekt/contact.html +++ b/schule/info/html/projekt/contact.html @@ -1,63 +1,63 @@ - - - - - - Contact - - - - -
- - - -
-

Contact me

-

Johannes Olzem -
- Heerstr. 1 -
- 53359 Rheinbach

- olzemjo@sjg-rheinbach.de - -
- - -
- + + + + + + Contact + + + + +
+ + + +
+

Contact me

+

Johannes Olzem +
+ Heerstr. 1 +
+ 53359 Rheinbach

+ olzemjo@sjg-rheinbach.de + +
+ + +
+ \ No newline at end of file diff --git a/schule/info/html/projekt/css/style.css b/schule/info/html/projekt/css/style.css index 209ac6f..626578a 100644 --- a/schule/info/html/projekt/css/style.css +++ b/schule/info/html/projekt/css/style.css @@ -1,127 +1,127 @@ -body { - font-size: 80%; - font-family: 'Share Tech Mono', Monospace, Courier; - text-align: center; - background-color: #202020; -} - -#wrap { - width: 760px; - margin: 0 auto; - text-align: left; -} - -#navigation { - float: right; - width: 55px; - height: 803px; - border-bottom: 1px solid #999; - border-top: 1px solid #999; - font-size: 25px; - text-align: right; - font-family: 'Share Tech Mono', Monospace, Courier; - color: white; -} - -#navigation ul { - list-style-type: none; -} - -#navigation ul li { - display: inline; -} - -#header { - float: left; - width: 760px; - height: 90px; - background-image: header.png; - text-align: middle; - border-top: 1px solid #999; -} - -#content { - float: left; - height: 400px; - width: 559px; - border-right: 1px solid #999; -} - -#content ul { - list-style-type: circle; -} - -#content ul li { - display: inline; -} - -#content ol { - color: teal; -} - -#content ul li { - display: inline; -} - -#sidebar { - float: left; - height: 350px; - width: 100px; - top: 0; - font-size: 90%; -} - -#footer { - position: fixed; - left: 0; - bottom: 0; - width: 100%; - background-color: light-gray; - color: white; - text-align: center; -} - -/*the . before the word means i am defining a class and not an ID. When using an ID a # is used*/ -.price { - font-size: 15px; - font-weight: bold; - font-family: Verdana, Geneva, sans-serif; - color: teal; -} - -.specs ul { - list-style-type: disc; -} - -.dotted { - border: 5px dotted #555; -} - -/*This defines the Table*/ -table, th, td { - border: 2px solid teal; - border-collapse: collapse; - color: white; -} - -h2, h3, h4, h5, h6 { - margin: 20px; - color: white; -} - -/*I wanted heading1 to be teal so i seperated it from h2-h6*/ -h1 { - color: teal; - font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; -} - -p { - margin: 20px 25px; - color: white; -} - -/*This defines the hyperlinks*/ -a { - color: teal; - +body { + font-size: 80%; + font-family: 'Share Tech Mono', Monospace, Courier; + text-align: center; + background-color: #202020; +} + +#wrap { + width: 760px; + margin: 0 auto; + text-align: left; +} + +#navigation { + float: right; + width: 55px; + height: 803px; + border-bottom: 1px solid #999; + border-top: 1px solid #999; + font-size: 25px; + text-align: right; + font-family: 'Share Tech Mono', Monospace, Courier; + color: white; +} + +#navigation ul { + list-style-type: none; +} + +#navigation ul li { + display: inline; +} + +#header { + float: left; + width: 760px; + height: 90px; + background-image: header.png; + text-align: middle; + border-top: 1px solid #999; +} + +#content { + float: left; + height: 400px; + width: 559px; + border-right: 1px solid #999; +} + +#content ul { + list-style-type: circle; +} + +#content ul li { + display: inline; +} + +#content ol { + color: teal; +} + +#content ul li { + display: inline; +} + +#sidebar { + float: left; + height: 350px; + width: 100px; + top: 0; + font-size: 90%; +} + +#footer { + position: fixed; + left: 0; + bottom: 0; + width: 100%; + background-color: light-gray; + color: white; + text-align: center; +} + +/*the . before the word means i am defining a class and not an ID. When using an ID a # is used*/ +.price { + font-size: 15px; + font-weight: bold; + font-family: Verdana, Geneva, sans-serif; + color: teal; +} + +.specs ul { + list-style-type: disc; +} + +.dotted { + border: 5px dotted #555; +} + +/*This defines the Table*/ +table, th, td { + border: 2px solid teal; + border-collapse: collapse; + color: white; +} + +h2, h3, h4, h5, h6 { + margin: 20px; + color: white; +} + +/*I wanted heading1 to be teal so i seperated it from h2-h6*/ +h1 { + color: teal; + font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; +} + +p { + margin: 20px 25px; + color: white; +} + +/*This defines the hyperlinks*/ +a { + color: teal; + } \ No newline at end of file diff --git a/schule/info/html/projekt/details.html b/schule/info/html/projekt/details.html index 212f8af..337ddbb 100644 --- a/schule/info/html/projekt/details.html +++ b/schule/info/html/projekt/details.html @@ -1,120 +1,120 @@ - - - - - - Details - - - - - -
- - - -
-

Details

-

Sizes

-

There are several sizes of keyboard, defined by the number of keys.

- - - - - - - - - - - - - - - - -
-

40%

-

A 40% Keyboard only has Keys for lettering, such as letters and a shift and backspace - as well as a backspace and a Tab.

- a fourty percent keyboard -
-
-

60%

-

Probably the most common size in the custom keyboard Industry. - Has the same keys as a 40% as well as numbers and certain others.

- a sixty percent keyboard -
-

65%

-

My favourite size, because of the extra arrow keys. It also has three additional keys. - These are most commonly Delete, Page Up and Page Down.

- a sixty percent keyboard -
-

75%/TKL

-

A "normal" keyboard, just without the numpad. TKL stands for TenKeyLess.

- a seventyfive percent keyboard -
-

95%/100%/full size

-

Has the keys of the keyboard you are probably using, if you have a mainstream Keyboard.

- a full size keyboard -
-
-
-

Lube

-

Lube is used to significantly silent switches. I've included some typing sounds under here.

-

Unlubed Cherry MX Red switches

- - -

Lubed Cherry MX Red switches

- -

Overlubed Gateron Black Ink Switches

- -
- - -
- + + + + + + Details + + + + + +
+ + + +
+

Details

+

Sizes

+

There are several sizes of keyboard, defined by the number of keys.

+ + + + + + + + + + + + + + + + +
+

40%

+

A 40% Keyboard only has Keys for lettering, such as letters and a shift and backspace + as well as a backspace and a Tab.

+ a fourty percent keyboard +
+
+

60%

+

Probably the most common size in the custom keyboard Industry. + Has the same keys as a 40% as well as numbers and certain others.

+ a sixty percent keyboard +
+

65%

+

My favourite size, because of the extra arrow keys. It also has three additional keys. + These are most commonly Delete, Page Up and Page Down.

+ a sixty percent keyboard +
+

75%/TKL

+

A "normal" keyboard, just without the numpad. TKL stands for TenKeyLess.

+ a seventyfive percent keyboard +
+

95%/100%/full size

+

Has the keys of the keyboard you are probably using, if you have a mainstream Keyboard.

+ a full size keyboard +
+
+
+

Lube

+

Lube is used to significantly silent switches. I've included some typing sounds under here.

+

Unlubed Cherry MX Red switches

+ + +

Lubed Cherry MX Red switches

+ +

Overlubed Gateron Black Ink Switches

+ +
+ + +
+ \ No newline at end of file diff --git a/schule/info/html/projekt/downloads.html b/schule/info/html/projekt/downloads.html index 7165b54..eabb758 100644 --- a/schule/info/html/projekt/downloads.html +++ b/schule/info/html/projekt/downloads.html @@ -1,75 +1,75 @@ - - - - - - Downloads - - - - - -
- - - -
-

Downloads

- - -

VIA

- -

VIA is a software, you can use to program a Keyboard. -
- Before you build, you normally test the PCB, which you can do with this Software too. -
- It is also used to change the RGB lightning on the switches or the PCB. -

-
-
- -

AutoHotkey

- -

AutoHotkey is a software, which is used to program macros to either to special macro keys, - or your normal Keys. It is normally used for Macro keyboards, which you can find - here. -

-
- - -
- + + + + + + Downloads + + + + + +
+ + + +
+

Downloads

+ + +

VIA

+ +

VIA is a software, you can use to program a Keyboard. +
+ Before you build, you normally test the PCB, which you can do with this Software too. +
+ It is also used to change the RGB lightning on the switches or the PCB. +

+
+
+ +

AutoHotkey

+ +

AutoHotkey is a software, which is used to program macros to either to special macro keys, + or your normal Keys. It is normally used for Macro keyboards, which you can find + here. +

+
+ + +
+ \ No newline at end of file diff --git a/schule/info/html/projekt/index.html b/schule/info/html/projekt/index.html index e220876..f380f36 100644 --- a/schule/info/html/projekt/index.html +++ b/schule/info/html/projekt/index.html @@ -1,116 +1,116 @@ - - - - - - Custom Keyboards - - - - - - -
- - - -
-

Custom Keyboards

-

The hobby of building a custom keyboard is massively gaining popularity at the moment. -
- To Build a Custom Keyboard you need 5 parts. -

-
    -
  1. -

    Case

    -

    The Case is basically just the Housing of the Keyboard. - All the Parts get screwed into it, so that they get held in place.

    -
    2. -
  2. -

    PCB

    -

    The PCB is basically just the Motherboard of the Keyboard. - You can either solder or just place the switches in, - depending of which type of PCB you have.

    -
    3. -
  3. -

    Switches

    -

    The switches are the actuators of the typing. They send a signal through - the PCB, which sends it over the Cable to the PC.

    -
    4. -
  4. -

    Plate

    -

    The Plate is inbetween the Switches and the PCB. The Stabilisers, - which stabilize the longer keycaps are also mounted on the Plate.

    -
    5. -
  5. -

    Keycaps

    -

    The Keycaps are placed on the switches, so you can actually type. - They come in different colors and sizes. - There are also Printed Keycaps and blank ones.

    -
    6. -
- -

Here you can see a Keyboard Timelapse Build

- - -
-
-
- - -
Background image
-

A Rose Gold Kyuu built for Lilypichu by the Youtuber and Streamer Taeha Types.

-
- - -
- + + + + + + Custom Keyboards + + + + + + +
+ + + +
+

Custom Keyboards

+

The hobby of building a custom keyboard is massively gaining popularity at the moment. +
+ To Build a Custom Keyboard you need 5 parts. +

+
    +
  1. +

    Case

    +

    The Case is basically just the Housing of the Keyboard. + All the Parts get screwed into it, so that they get held in place.

    +
    2. +
  2. +

    PCB

    +

    The PCB is basically just the Motherboard of the Keyboard. + You can either solder or just place the switches in, + depending of which type of PCB you have.

    +
    3. +
  3. +

    Switches

    +

    The switches are the actuators of the typing. They send a signal through + the PCB, which sends it over the Cable to the PC.

    +
    4. +
  4. +

    Plate

    +

    The Plate is inbetween the Switches and the PCB. The Stabilisers, + which stabilize the longer keycaps are also mounted on the Plate.

    +
    5. +
  5. +

    Keycaps

    +

    The Keycaps are placed on the switches, so you can actually type. + They come in different colors and sizes. + There are also Printed Keycaps and blank ones.

    +
    6. +
+ +

Here you can see a Keyboard Timelapse Build

+ + +
+
+
+ + +
Background image
+

A Rose Gold Kyuu built for Lilypichu by the Youtuber and Streamer Taeha Types.

+
+ + +
+ \ No newline at end of file diff --git a/schule/info/html/projekt/keycaps.html b/schule/info/html/projekt/keycaps.html index f85c42f..80b74bf 100644 --- a/schule/info/html/projekt/keycaps.html +++ b/schule/info/html/projekt/keycaps.html @@ -1,99 +1,99 @@ - - - - - - EPBT Samurai 75% Keycap set - - - - - -
- - - -
- -

-

EPBT Samurai 75% Keycap set

-

99,80€

-

This is one of my favourite Keycap sets

- - -
-
-
-
-
-
-
-

Specs

- - - - - - - - - - - - - - - - - -
Reverse Dyesub
PBT Material
Made in china
with chinese letters
includes iso Enter
-
-
- -

Product Images

- - - - -
- - -
- + + + + + + EPBT Samurai 75% Keycap set + + + + + +
+ + + +
+ +

+

EPBT Samurai 75% Keycap set

+

99,80€

+

This is one of my favourite Keycap sets

+ + +
+
+
+
+
+
+
+

Specs

+ + + + + + + + + + + + + + + + + +
Reverse Dyesub
PBT Material
Made in china
with chinese letters
includes iso Enter
+
+
+ +

Product Images

+ + + + +
+ + +
+ \ No newline at end of file diff --git a/schule/info/html/projekt/legal_notice.html b/schule/info/html/projekt/legal_notice.html index 5661be9..ef70ccf 100644 --- a/schule/info/html/projekt/legal_notice.html +++ b/schule/info/html/projekt/legal_notice.html @@ -1,64 +1,64 @@ - - - - - - Legal Notice - - - - -
- - - -
-

Legal Notice

-

Some of the Content on this site is Copyrighted. - If you have a complaint about Copyright infringement, - please send an email to olzemjo@sjg-rheinbach.de. - -
- Also Contact this e-mail, if you are a content owner and - you would like to contribute your content to this Website. -

-
- - -
- + + + + + + Legal Notice + + + + +
+ + + +
+

Legal Notice

+

Some of the Content on this site is Copyrighted. + If you have a complaint about Copyright infringement, + please send an email to olzemjo@sjg-rheinbach.de. + +
+ Also Contact this e-mail, if you are a content owner and + you would like to contribute your content to this Website. +

+
+ + +
+ \ No newline at end of file diff --git a/schule/info/html/projekt/privacy_policy.html b/schule/info/html/projekt/privacy_policy.html index e4fbee6..fbb9c2a 100644 --- a/schule/info/html/projekt/privacy_policy.html +++ b/schule/info/html/projekt/privacy_policy.html @@ -1,85 +1,85 @@ - - - - - - Privacy Policy - - - - -
- - - -
-

Privacy Policy

-

Data Collection

- -

Deletion of personal Data

- -

Cookies

- -

Links to other Sites

-
- - -
- + + + + + + Privacy Policy + + + + +
+ + + +
+

Privacy Policy

+

Data Collection

+ +

Deletion of personal Data

+ +

Cookies

+ +

Links to other Sites

+
+ + +
+ \ No newline at end of file diff --git a/schule/info/html/projekt/shop.html b/schule/info/html/projekt/shop.html index ecfe279..52c7773 100644 --- a/schule/info/html/projekt/shop.html +++ b/schule/info/html/projekt/shop.html @@ -1,62 +1,62 @@ - - - - - - Shop - - - - - -
- - - -
-

Shop

- - -

EPBT Samurai 65% Keycap set -
- 99,90€

- -
- - -
- + + + + + + Shop + + + + + +
+ + + +
+

Shop

+ + +

EPBT Samurai 65% Keycap set +
+ 99,90€

+ +
+ + +
+ \ No newline at end of file diff --git a/schule/info/index.html b/schule/info/index.html index 4dbdc62..99bb73a 100644 --- a/schule/info/index.html +++ b/schule/info/index.html @@ -1,29 +1,29 @@ - - - - Index for ~/schule/info | Johannes Olzem - - - -
-

Index for  ~ / schule / info /

- -
- - + + + + Index for ~/schule/info | Johannes Olzem + + + +
+

Index for  ~ / schule / info /

+ +
+ + diff --git a/schule/info/python/roulette/index.html b/schule/info/python/roulette/index.html index f146d6b..a8bf56e 100644 --- a/schule/info/python/roulette/index.html +++ b/schule/info/python/roulette/index.html @@ -1,26 +1,26 @@ - - - - Index for ~/pages/schule/info/python/roulette/ | Johannes Olzem - - - - - -
-

Index for  ~ / pages / schule / info / python / roulette /

- -
- + + + + Index for ~/pages/schule/info/python/roulette/ | Johannes Olzem + + + + + +
+

Index for  ~ / pages / schule / info / python / roulette /

+ +
+ \ No newline at end of file