Tweaks and formatting with prettier

This commit is contained in:
Jonas Tobias Hopusch 2023-03-10 15:08:43 +01:00
parent ef81b60aae
commit 4bdbf2a598
Signed by: jotoho
GPG Key ID: 913BDF1196DCF600
12 changed files with 371 additions and 357 deletions

View File

@ -6,7 +6,7 @@ pages:
interruptible: true
timeout: 5m
rules:
- if: '$CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH || $CI_COMMIT_REF_NAME == $CI_DEFAULT_BRANCH'
- if: "$CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH || $CI_COMMIT_REF_NAME == $CI_DEFAULT_BRANCH"
when: always
before_script:
- pacman --needed --noconfirm --sync --refresh --sysupgrade zola

View File

@ -10,7 +10,7 @@ Hello visitor,
I am Jonas (Tobias) Hopusch, usually known online as by my username "jotoho".
I am male, German, currently <span id="age-display">*javascript failed*</span> years old
I am male, German, currently <span id="age-display">_javascript failed_</span> years old
and a student of computer science at the [South Westphalia University of Applied
Sciences](https://fh-swf.de) working towards earning a Bachelor degree.
@ -32,13 +32,13 @@ trouble concretely defining the genres I listen to.
### My Desktop-PC
|PC Part|Installed Component|
|:-|:-:|
|CPU|[AMD Ryzen 7 5800X (8 cores, 16 threads)](https://www.amd.com/en/products/cpu/amd-ryzen-7-5800x)|
|Motherboard|[ASRock X570M Pro4](https://www.asrock.com/MB/AMD/X570M%20Pro4/)|
|Graphics Card|[ASUS Dual Radeon RX 6750XT 12GB OC Edition](https://www.asus.com/motherboards-components/graphics-cards/dual/dual-rx6750xt-o12g/)|
|Memory|20GiB (2*8G+4G) DDR4 2133MHz|
|Monitors|2 1920x1080 32" 60Hz screens|
|Storage|1TB SATA-SSD + 1TB SATA-HDD|
| PC Part | Installed Component |
| :------------ | :--------------------------------------------------------------------------------------------------------------------------------: |
| CPU | [AMD Ryzen 7 5800X (8 cores, 16 threads)](https://www.amd.com/en/products/cpu/amd-ryzen-7-5800x) |
| Motherboard | [ASRock X570M Pro4](https://www.asrock.com/MB/AMD/X570M%20Pro4/) |
| Graphics Card | [ASUS Dual Radeon RX 6750XT 12GB OC Edition](https://www.asus.com/motherboards-components/graphics-cards/dual/dual-rx6750xt-o12g/) |
| Memory | 20GiB (2\*8G+4G) DDR4 2133MHz |
| Monitors | 2 1920x1080 32" 60Hz screens |
| Storage | 1TB SATA-SSD + 1TB SATA-HDD |
<script style="display: none;" src="/scripts/calcage.js" defer></script>

View File

@ -13,7 +13,7 @@ but hopefully even a list with only the less sensitive profiles and contact info
The following list is probably not complete and will change over time.
| Service/Protocol | Hyperlink | Notes |
|-|-|-|
| ------------------ | -------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- |
| E-Mail | [contact@jotoho.de](mailto:contact@jotoho.de) | [OpenPGP keys here](https://downloads.jotoho.de/openpgp/) and [via WKD](https://datatracker.ietf.org/doc/draft-koch-openpgp-webkey-service/) |
| Mastodon/Fediverse | [@jotoho@ruhr.social](https://ruhr.social/@jotoho) | |
| GitLab | [@jotoho](https://gitlab.com/jotoho) | Preferred Git hosting platform |

View File

@ -7,38 +7,41 @@ updated = "2023-03-02T16:57:24+01:00"
Besides this website, my domain also has a number of other services/servers running that are set up for learning purposes or for personal use by myself, family and acquaintances. The list only contains services available from the public internet.
-----
---
### Publicly accessible services
* [**This website**](https://www.jotoho.de): www.jotoho.de is currently being self-hosted using
[a customized Caddy docker image](https://gitea.jotoho.de/jotoho/site-deployer)
* [**Personal Nextcloud**](https://nextcloud.jotoho.de): This Nextcloud instance is set up for use by myself and those I have invited to store, conveniently access and exchange files and other information.
* [**Forgejo**](https://gitea.jotoho.de): This git server was migrated from Gitea to Forgejo on 2023-01-17 as an emergency measure due to the potentially hostile takeover
of the Gitea project.
Account Registration is limited to whitelisted email domains and accounts need to manually be confirmed by me before becoming active.
* [**Vaultwarden**](https://bitwarden.jotoho.de): Instance of this Bitwarden server implementation for storing and synchronizing my access credentials
and other secrets on my own infrastructure.
* [**Caddy public fileserver**](https://downloads.jotoho.de): For holding and serving public files directly via HTTPS without needing to go through Nextcloud.
Has increased compatibility for use-cases like embedding images or media on this website.
* [**Vikunja Task Management**](https://tasks.jotoho.de): Online To-Do list and Tasks management. Family and Friends can request accounts to be created for them
in order to be able to share to-do lists.
It supports CalDAV synchronization with client devices.
- [**This website**](https://www.jotoho.de): www.jotoho.de is currently being self-hosted using
[a customized Caddy docker image](https://gitea.jotoho.de/jotoho/site-deployer)
- [**Personal Nextcloud**](https://nextcloud.jotoho.de): This Nextcloud instance is set up for use by myself and those I have invited to store, conveniently access and exchange files and other information.
- [**Forgejo**](https://gitea.jotoho.de): This git server was migrated from Gitea to Forgejo on 2023-01-17 as an emergency measure due to the potentially hostile takeover
of the Gitea project.
Account Registration is limited to whitelisted email domains and accounts need to manually be confirmed by me before becoming active.
- [**Vaultwarden**](https://bitwarden.jotoho.de): Instance of this Bitwarden server implementation for storing and synchronizing my access credentials
and other secrets on my own infrastructure.
- [**Caddy public fileserver**](https://downloads.jotoho.de): For holding and serving public files directly via HTTPS without needing to go through Nextcloud.
Has increased compatibility for use-cases like embedding images or media on this website.
- [**Vikunja Task Management**](https://tasks.jotoho.de): Online To-Do list and Tasks management. Family and Friends can request accounts to be created for them
in order to be able to share to-do lists.
It supports CalDAV synchronization with client devices.
---
-----
### Special Purpose Subdomains
* **lab.jotoho.de**: Delegated to DigitalOcean Nameservers for quick configuration of droplets and other testing projects hosted there.
Do not expect anything hosted under this subdomain or one of it's subdomains to live for more than a few hours or days.
Security issues, Anomalies or detected abuse of this subdomain [should be immediately reported to me via email](mailto:security@jotoho.de),
so I can investigate and implement corrective measures, if necessary.
- **lab.jotoho.de**: Delegated to DigitalOcean Nameservers for quick configuration of droplets and other testing projects hosted there.
Do not expect anything hosted under this subdomain or one of it's subdomains to live for more than a few hours or days.
Security issues, Anomalies or detected abuse of this subdomain [should be immediately reported to me via email](mailto:security@jotoho.de),
so I can investigate and implement corrective measures, if necessary.
---
-----
### Potential future additions or experiments
When I bought this domain, it became clear to me how very versatile and useful it can be to have a publicly listed internet namespace so I am always trying to find and learn new ways to put the domain to good use and try out new technologies & server-side software that I view as interesting or useful.
Things I may set up and play with in the future:
* personal mastodon or activitypub-compatible server
* outgoing SMTP server for service notifications
* Apache Guacamole for remote control of devices
- personal mastodon or activitypub-compatible server
- outgoing SMTP server for service notifications
- Apache Guacamole for remote control of devices

View File

@ -3,11 +3,12 @@
margin: 0;
border: none;
border-collapse: collapse;
box-sizing: border-box;
box-sizing: border-box !important;
overflow-wrap: anywhere;
}
html, body {
html,
body {
max-width: 100%;
overflow-x: clip;
}
@ -25,13 +26,15 @@ html, body {
flex-shrink: 0;
}
header, footer {
header,
footer {
text-align: center;
}
#header-title {
display: block;
padding: 0.5rem 0;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
footer {
@ -48,7 +51,7 @@ footer {
margin-bottom: 0;
}
.globalnav{
.globalnav {
display: flex;
flex-wrap: wrap;
flex-direction: row;
@ -70,12 +73,14 @@ footer {
/* Code Blocks */
pre {
display: block;
padding: 0.75rem;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
margin-left: auto;
margin-right: auto;
width: fit-content;
max-width: 100%;
overflow-x: auto;
line-break: strict;
}
@ -92,10 +97,6 @@ p {
margin-bottom: 0.5rem;
}
article {
padding: 0.5rem;
}
h2 {
margin-bottom: 1rem;
text-align: center;
@ -104,22 +105,39 @@ h2 {
#mainarticle {
width: fit-content;
max-width: min(100%, 60rem);
margin: 0 auto;
margin-left: auto;
margin-right: auto;
flex-grow: 1;
}
#mainarticle h3 {
margin: 1rem 0;
margin-top: 1rem;
margin-bottom: 1rem;
}
li, ul, ol {
margin: 1rem;
ul > li,
ol > li {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
li::marker {
width: 1rem;
max-width: 100%;
padding: 0;
margin: 0;
border: none;
}
li {
margin-inline-start: 1rem;
}
hr {
border-style: inset;
border-width: 1px;
margin: 0.5rem 0;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
}
table {
@ -135,7 +153,8 @@ tr {
width: fit-content;
}
td, th {
td,
th {
border-style: solid;
border-color: black;
border-collapse: collapse;
@ -149,14 +168,24 @@ td, th {
display: inline;
}
#article-missinglicense {
font-size: small;
}
#last-article-metadata {
margin-bottom: 1rem;
}
.visible-article-metadata {
display: contents;
font-size: small;
font-style: italic;
}
.article-metadata-label {
font-weight: bold;
}
.article-missinglicense {
font-size: xx-small;
}
@media (prefers-color-scheme: dark) {
html {
background-color: #111;
@ -175,7 +204,9 @@ td, th {
color: lightskyblue;
}
table, td, th {
table,
td,
th {
border-color: white;
}
}
@ -194,7 +225,9 @@ td, th {
color: green;
}
table, td, th {
table,
td,
th {
border-color: black;
}
}

View File

@ -8,11 +8,12 @@
let yearsSinceBirth = today.getFullYear() - myBirthDate.getFullYear();
// Correct yearsSinceBirth if between New Year and my birthday
if (today.getMonth() < myBirthDate.getMonth())
yearsSinceBirth--;
else if (today.getMonth() == myBirthDate.getMonth()
&& today.getDate() < myBirthDate.getDate())
if (today.getMonth() < myBirthDate.getMonth()) yearsSinceBirth--;
else if (
today.getMonth() == myBirthDate.getMonth() &&
today.getDate() < myBirthDate.getDate()
)
yearsSinceBirth--;
document.getElementById('age-display').innerText = yearsSinceBirth.toString();
document.getElementById("age-display").innerText = yearsSinceBirth.toString();
}

View File

@ -8,7 +8,8 @@
copyrightYearElement.innerText = currentYearAsStr;
copyrightYearElement.dateTime = currentYearAsStr;
}
else
console.error("Could not find the footer entry for the year of the copyright notice.");
} else
console.error(
"Could not find the footer entry for the year of the copyright notice."
);
}

View File

@ -26,8 +26,7 @@
</head>
<body id="root">
<header>
<a id="header-title"
href="{{ config.base_url }}">
<a id="header-title" href="{{ config.base_url }}">
<h1>jotoho.de - My personal website</h1>
</a>
<nav class="globalnav">
@ -57,8 +56,7 @@
timezone="Europe/Berlin") %} -->
Copyright
<time id="footer-copyrightyear"
datetime="{{ current_year }}">
<time id="footer-copyrightyear" datetime="{{ current_year }}">
{{ current_year }}
</time>
Jonas Tobias Hopusch (@jotoho)
@ -76,9 +74,7 @@
-->
</p>
<p>
<a href="https://gitea.jotoho.de/jotoho/my-website"
>This page</a
>
<a href="https://gitea.jotoho.de/jotoho/my-website">This page</a>
is being served using
<a rel="noreferer" href="https://caddyserver.com/">Caddy</a>
and was generated using

View File

@ -1,11 +1,8 @@
{% extends "base.html" %}
{% block metadata %}
<meta name="description" content="This is the personal website of Jonas Tobias Hopusch (@jotoho)" />
{% endblock metadata %}
{% block content %}
<p>
This is some placeholder text because I don't know what to put here, yet.
</p>
{% extends "base.html" %} {% block metadata %}
<meta
name="description"
content="This is the personal website of Jonas Tobias Hopusch (@jotoho)"
/>
{% endblock metadata %} {% block content %}
<p>This is some placeholder text because I don't know what to put here, yet.</p>
{% endblock content %}

View File

@ -4,58 +4,43 @@
{% endblock %} {% block content %}
<h2>{{ page.title }}</h2>
{% if page.date and page.date is defined %}
<p>
<em
><strong>Published on</strong>:
<div class="visible-article-metadata">
{% if page.date and page.date is defined %}
<p>
<span class="article-metadata-label">First published</span>:
<time datetime="{{page.date}}"
>{{ page.date | date(format="%A, %e %B %Y %R %Z",
timezone="Europe/Berlin") }}</time
></em
>{{ page.date | date(format="%F %R (%Z)", timezone="Europe/Berlin")
}}</time
>
</p>
{% endif %} {% if page.updated and page.updated != page.date %}
<p>
<em
><strong>Last updated on</strong>:
</p>
{% endif %} {% if page.updated and page.updated != page.date %}
<p>
<span class="article-metadata-label">Last updated on</span>:
<time datetime="{{page.updated}}"
>{{ page.updated | date(format="%A, %e %B %Y %R %Z",
timezone="Europe/Berlin") }}</time
></em
>{{ page.updated | date(format="%F %R (%Z)", timezone="Europe/Berlin")
}}</time
>
</p>
{% endif %}
{% if page.extra.author and page.extra.author != "" %}
<p>
<em>
<strong>Author(s)</strong>:
{{page.extra.author}}
</em>
</p>
{% else %}
<p>
<em>
<strong>Author</strong>:
Jonas Tobias Hopusch
</em>
</p>
{% endif %}
{% if page.extra.license and page.extra.license != "" %}
<p id="article-license">
<em>
<strong>Article is provided under the following license</strong>:
{{page.extra.license}}
</em>
</p>
{% else %}
<p id="article-missinglicense">
<em>
This article is copyright-protected
and may not be used or replicated without permission.
(All rights reserved)
</em>
</p>
{% endif %}
</p>
{% endif %} {% if page.extra.author and page.extra.author != "" %}
<p>
<span class="article-metadata-label">Author(s)</span>: {{page.extra.author}}
</p>
{% else %}
<p>
<span class="article-metadata-label">Author</span>: Jonas Tobias Hopusch
</p>
{% endif %} {% if page.extra.license and page.extra.license != "" %}
<p id="article-license">
<span class="article-metadata-label"
>Article is provided under the following license</span
>: {{page.extra.license}}
</p>
{% else %}
<p class="article-missinglicense">
No license is granted for this article. All rights reserved.
</p>
{% endif %}
</div>
<hr id="last-article-metadata" />
<div>{{ page.content | safe }}</div>
{% endblock content %}

View File

@ -5,7 +5,5 @@
<li><a href="{{ page.permalink | safe }}">{{ page.title }}</a></li>
{% endfor %}
</ul>
<div>
{{ section.content | safe }}
</div>
<div>{{ section.content | safe }}</div>
{% endblock content %}