cami/sp-codes.de
1
0
Fork 0
forked from samuel-p/sp-codes.de
Code Issues Pull requests Projects Releases Wiki Activity

layout ng

Browse source
This commit is contained in:
Samuel Philipp 2023-12-20 23:46:09 +01:00
parent b012f49b56
commit 4729483c3e
13 changed files with 129 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/_data/services.json
View file

@ -9,11 +9,15 @@
"de": "Die offene Plattform für sichere und dezentrale Kommunikation.",
"en": "The open platform for secure and decentralized communication."
},
"description": {
"de": "<p>Seit Anfang 2020 betreibe ich einen öffentlichen Matrix-Server: <a href=\"https://matrix.sp-codes.de\">matrix.sp-codes.de</a> und eine öffentliche Element-Web Instanz: <a href=\"https://chat.sp-codes.de\" target=\"_blank\">chat.sp-codes.de</a></p><p>Die Serverregeln kannst du gerne <a href=\"https://matrix.sp-codes.de/_matrix/consent\" target=\"_blank\">hier</a> nachlesen. Melde dich gerne auf meinem Server an oder suche dir einen aus den unten verlinkten Listen heraus. Ich freue mich auf deine Nachricht an <a href=\"https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de\" target=\"_blank\">@samuel-p:matrix.sp-codes.de</a>.</p><div class=\"text-center mt-2\"><a class=\"btn btn-primary\" target=\"_blank\" href=\"https://chat.sp-codes.de/#/register\">Jetzt registrieren</a></div>",
"en": ""
},
"ossrox": {
"url": "https://ossrox.org/store/matrix",
"description": {
"de": "Wenn du einen eigenen Matrix-Server für dich, deine Familie oder deine Firma betreiben willst, unterstütze ich dich gerne mit meiner Firma Ossrox damit. Schau dir gerne unser Angebot dazu auf unserer Webseite an oder schreib mir eine Nachricht dazu.",
"en": "If you want to have your own matrix server for you, your family or your company, I would be happy to support you with my company Ossrox. Please have a look at our services on our website or send me a message."
"en": "If you want to have your own Matrix server for you, your family or your company, I would be happy to support you with my company Ossrox. Please have a look at our services on our website or send me a message."
}
}
},
@ -26,6 +30,17 @@
"summary": {
"de": "Einfache Videokonferenzen mit Leichtigkeit.",
"en": "Easy video conferencing with ease."
},
"description": {
"de": "<p>Seit Juli 2020 betreibe ich eine eigene Jitsi-Meet Instanz. Du findest sie unter <a href=\"https://jitsi.sp-codes.de\">jitsi.sp-codes.de</a>.</p><p>Gerne darfst du die Instanz mit anderen Leuten nutzen.</p><div class=\"text-center mt-2\"><a class=\"btn btn-primary\" target=\"_blank\" href=\"https://jitsi.sp-codes.de\">Meeting starten</a></div>",
"en": ""
},
"ossrox": {
"url": "https://ossrox.org/store/jitsi",
"description": {
"de": "Wenn du einen eigenen Jitsi-Server für dich, deine Familie oder deine Firma betreiben willst, unterstütze ich dich gerne mit meiner Firma Ossrox damit. Schau dir gerne unser Angebot dazu auf unserer Webseite an oder schreib mir eine Nachricht dazu.",
"en": ""
}
}
},
{
@ -37,6 +52,17 @@
"summary": {
"de": "Das soziale Netzwerk für dezentrale und sichere Interaktion.",
"en": "The social network for decentralized and secure interaction."
},
"description": {
"de": "<p>Seit Mai 2021 betreibe ich eine öffentliche Mastodon-Instanz: <a href=\"https://social.sp-codes.de\">social.sp-codes.de</a></p><p>Die Serverregeln und weitere Informationen kannst du gerne <a href=\"https://social.sp-codes.de/about\">hier</a> nachlesen. Melde dich gerne auf meinem Server an oder suche dir einen aus den unten verlinkten Listen heraus. Ich freue mich auf deine Nachricht an <a href=\"https://social.sp-codes.de/@samuel_p\">@samuel_p@matrix.sp-codes.de</a>.</p><div class=\"text-center mt-2\"><a class=\"btn btn-primary\" target=\"_blank\" href=\"https://social.sp-codes.de/auth/sign_up\">Jetzt registrieren</a></div>",
"en": ""
},
"ossrox": {
"url": "https://ossrox.org/store/mastodon",
"description": {
"de": "Wenn du einen eigenen Mastodon-Server für dich, deine Familie oder deine Firma betreiben willst, unterstütze ich dich gerne mit meiner Firma Ossrox damit. Schau dir gerne unser Angebot dazu auf unserer Webseite an oder schreib mir eine Nachricht dazu.",
"en": ""
}
}
},
{

2
src/_includes/layouts/article.njk
View file

@ -86,7 +86,7 @@ layout: base.njk
<span class="d-none d-md-inline-block i-envelope i-4x i-fw"></span>
<span class="d-inline-block d-md-none i-envelope i-2x i-fw"></span>
</a></div>
<div class="m-2"><a href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de">
<div class="m-2"><a href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de">
<span class="d-none d-md-inline-block i-matrix i-4x i-fw"></span>
<span class="d-inline-block d-md-none i-matrix i-2x i-fw"></span>
</a></div>

8
src/_includes/layouts/service.njk
View file

@ -14,17 +14,15 @@ layout: base.njk
<div class="tab-card">
<div class="title"><h1 class="text-center fw-bold">sp-codes</h1></div>
<div class="card">
Seit Anfang 2020 betreibe ich einen öffentlichen Matrix-Server: <a href="https://matrix.sp-codes.de">matrix.sp-codes.de</a> und eine öffentliche Element-Web Instanz: <a href="https://chat.sp-codes.de" target="_blank">chat.sp-codes.de</a>
<div class="text-center mt-2">
<a class="btn btn-primary" target="_blank" href="https://chat.sp-codes.de/#/register">Jetzt registrieren</a>
</div>
{{ service.description[locale] | safe }}
</div>
</div>
{% if service.ossrox %}
<div class="tab-card ossrox">
<a href="{{ service.ossrox.url }}" class="link"></a>
<div class="title"><img class="ossrox" src="/img/ossrox-white.svg" alt="Ossrox"></div>
<div class="card">
{{service.ossrox.description[locale]}}
{{ service.ossrox.description[locale] }}
</div>
</div>
{% endif %}

2
src/_includes/profiles.html
View file

@ -4,7 +4,7 @@
<span class="d-none d-md-inline-block i-envelope i-2x i-fw"></span>
<span class="d-inline-block d-md-none i-envelope i-2x i-fw"></span>
</a></div>
<div><a href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de">
<div><a href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de">
<span class="d-none d-md-inline-block i-matrix i-2x i-fw"></span>
<span class="d-inline-block d-md-none i-matrix i-2x i-fw"></span>
</a></div>

34
src/de/contact.html
View file

@ -12,32 +12,52 @@ eleventyNavigation:
<p>Du möchtest mit mir in Kontakt treten, mir einen Fehler mitteilen, hast eine Frage zu einem Dienst oder möchtest
mich unterstützen? Schick mir gerne deine Nachricht auf einem der folgenden Wege. Ich freue mich von dir zu
hören.</p>
<div class="row justify-content-center">
<div class="row justify-content-center contact-links">
<div class="col-12 col-md-10 col-lg-8">
<a class="card mb-3 d-flex align-items-center text-decoration-none" href="mailto:mail@sp-codes.de">
<div class="pr-3"><span class="i-envelope text-foreground i-fw i-4x"></span></div>
<div class="pr-3"><span class="i-envelope i-fw i-4x"></span></div>
<div>Schicke mir eine E-Mail an <strong>mail@sp-codes.de</strong></div>
</a>
<a class="card mb-3 d-flex align-items-center text-decoration-none"
href="https://social.sp-codes.de/@samuel_p">
<div class="pr-3"><span class="i-mastodon text-foreground i-fw i-4x"></span></div>
<div class="pr-3"><span class="i-mastodon i-fw i-4x"></span></div>
<div>Folge mir auf Mastodon oder schicke mir dort eine Nachricht an
<strong>@samuel_p@social.sp-codes.de</strong></div>
</a>
<a class="card mb-3 d-flex align-items-center text-decoration-none"
href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de">
<div class="pr-3"><span class="i-matrix text-foreground i-fw i-4x"></span></div>
href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de">
<div class="pr-3"><span class="i-matrix i-fw i-4x"></span></div>
<div>Schreibe mir auf Matrix an <strong>@samuel-p:matrix.sp-codes.de</strong></div>
</a>
<a class="card mb-3 d-flex align-items-center text-decoration-none"
href="https://blabber.im/i/samuel-p/dismail.de">
<div class="pr-3"><span class="i-xmpp text-foreground i-fw i-4x"></span></div>
<div class="pr-3"><span class="i-xmpp i-fw i-4x"></span></div>
<div>Schreibe mir auf XMPP an <strong>samuel-p@dismail.de</strong></div>
</a>
<a class="card mb-3 d-flex align-items-center text-decoration-none"
href="https://threema.id/YSCU6F6U">
<div class="pr-3"><span class="i-threema text-foreground i-fw i-4x"></span></div>
<div class="pr-3"><span class="i-threema i-fw i-4x"></span></div>
<div>Schreibe mir auf Threema an die ID <strong>YSCU6F6U</strong></div>
</a>
</div>
</div>
<p>Sollte ich einmal nicht erreichbar sein, melde dich gerne im Matrix-Chat oder nutze die Verteiler-Adressen, die auch
an meine Moderatoren weitergeleitet werden.</p>
<div class="row justify-content-center contact-links">
<div class="col-12 col-md-10 col-lg-8">
<a class="card mb-3 d-flex align-items-center text-decoration-none"
href="https://matrix.to/#/#sp-codes:matrix.sp-codes.de?via=matrix.sp-codes.de">
<div class="pr-3"><span class="i-matrix i-fw i-4x"></span></div>
<div><strong>#sp-codes:matrix.sp-codes.de</strong></div>
</a>
<a class="card mb-3 d-flex align-items-center text-decoration-none" href="mailto:help@sp-codes.de">
<div class="pr-3"><span class="i-envelope i-fw i-4x"></span></div>
<div><strong>help@sp-codes.de</strong></div>
</a>
<a class="card mb-3 d-flex align-items-center text-decoration-none" href="mailto:abuse@sp-codes.de">
<div class="pr-3"><span class="i-envelope i-fw i-4x"></span></div>
<div><strong>abuse@sp-codes.de</strong></div>
</a>
</div>
</div>

7
src/de/index.html
View file

@ -19,7 +19,7 @@ eleventyNavigation:
<p class="mb-2">
Schön, dass du hergefunden hast. sp-codes stellt verschiedene Open-Source-Tools zur allgemeinen Verfügung. Alle Dienste sind kostenlos und werbe-frei. Wenn du zum weiteren Fortbestand des Projekts beitragen willst, freue ich mich über deine Unterstützung! Schau dich gerne um und entdecke das Angebot!
</p>
<h5 class="mb-2 fw-bold">Werde gerne Teil unserer tollen Community!</h5>
<h5 class="mb-2 fw-bold">Werde Teil unserer tollen Community!</h5>
<p class="mb-2">
Für alle, die die Dienste nutzen und Interessierte gibt es einen öffentlichen Matrix-Raum als Austauschort für Fragen, Ideen und Probleme: <strong><a
href="https://matrix.to/#/#sp-codes:matrix.sp-codes.de?via=matrix.sp-codes.de">#sp-codes:matrix.sp-codes.de</a></strong>
@ -56,7 +56,10 @@ eleventyNavigation:
</p>
<p class="text-center">
<a href="https://ossrox.org" target="_blank">
<img class="ossrox-logo" src="/img/ossrox-white.svg" alt="Ossrox">
<picture>
<source srcset="/img/ossrox.svg" media="(prefers-color-scheme: light)">
<img class="ossrox-logo" src="/img/ossrox-white.svg" alt="Ossrox">
</picture>
</a>
</p>
</div>

16
src/de/services/jitsi.md
View file

@ -1,24 +1,10 @@
---
layout: base.njk
layout: service.njk
key: jitsi
title: Jitsi Meet
---
# <i class="i-users"></i> Jitsi Meet
Jitsi-Meet ist eine Plattform für Videokonferenzen. Ohne Anmeldung können vollständig verschlüsselte Video-Chats gestartet werden. Zusätzlich bietet Jitsi-Meet die Möglichkeit den Bildschirm für die anderen Teilnehmer:innen freizugeben, neue Benutzer:innen einfach per Link einzuladen und Nachrichten im integrierten Chat zu verschicken.
__Seit Juli 2020 betreibe ich eine eigene Jitsi-Meet Instanz. Du findest sie unter [jitsi.sp-codes.de](https://jitsi.sp-codes.de/).__
Gerne darfst du die Instanz mit anderen Leuten nutzen.
Wenn du einen eigenen Jitsi-Server für dich, deine Familie oder deine Firma betreiben willst, unterstütze ich dich gerne mit meiner Firma <a href="https://ossrox.org" target="_blank">Ossrox</a> damit. Schau dir gerne unser Angebot dazu auf unserer Webseite an oder schreib mir eine Nachricht dazu.
<div class="text-center mb-3">
<a href="https://ossrox.org/store/jitsi" target="_blank">
<img class="ossrox" src="/img/ossrox.svg" alt="Ossrox">
</a>
</div>
## Weitere nützliche Links
* [Jitsi Webseite](https://jitsi.org/)

21
src/de/services/mastodon.md
View file

@ -1,31 +1,12 @@
---
layout: base.njk
layout: service.njk
key: mastodon
title: Mastodon
---
# <i class="i-mastodon"></i> Mastodon
Mastodon ist ein verteilter Mikroblogging-Dienst, ähnlich wie Twitter. Allerdings basiert der Dienst nicht auf einer zentralen Plattform, sondern besteht aus vielen verschiedenen, dezentralen Instanzen, die von Privatpersonen, Vereinen oder sonstigen Stellen eigenverantwortlich betrieben werden. Dadurch machen sich die Nutzer:innen nicht von einem einzigen Anbieter abhängig, sondern können frei entscheiden, mit wem sie welche Informationen teilen.
Da Mastodon auf offenen Web-Protokollen und freier, quelloffener Software basiert, kann auch mit anderen Diensten, wie Pleroma, PeerTube, Pixelfed, Friendica oder Hubzilla kommuniziert werden. Nutzer:innen können Text-, Bild-, Videonachrichten oder Umfragen also dienst- und serverübergreifend teilen.
__Seit Mai 2021 betreibe ich eine öffentliche Mastodon-Instanz: [social.sp-codes.de](https://social.sp-codes.de/)__
Die Serverregeln und weitere Informationen kannst du gerne [hier](https://social.sp-codes.de/about/more) nachlesen. Melde dich gerne auf meinem Server an oder suche dir einen aus den unten verlinkten Listen heraus. Ich freue mich auf
deine Nachricht an [@samuel_p@matrix.sp-codes.de](https://social.sp-codes.de/@samuel_p).
<div class="text-center mb-3">
<a class="card d-inline-block font-weight-bold" target="_blank" href="https://social.sp-codes.de/about">Jetzt registrieren</a>
</div>
Wenn du einen eigenen Mastodon-Server für dich, deine Familie oder deine Firma betreiben willst, unterstütze ich dich gerne mit meiner Firma <a href="https://ossrox.org" target="_blank">Ossrox</a> damit. Schau dir gerne unser Angebot dazu auf unserer Webseite an oder schreib mir eine Nachricht dazu.
<div class="text-center mb-3">
<a href="https://ossrox.org/store/mastodon" target="_blank">
<img class="ossrox" src="/img/ossrox.svg" alt="Ossrox">
</a>
</div>
## Interessante Accounts
* [Bundesbeauftragte für Datenschutz und Informationsfreiheit](https://social.bund.de/@bfdi)

5
src/de/services/matrix.md
View file

@ -14,12 +14,9 @@ erstellen und trotzdem mit allen Matrix-Nutzern:innen kommunizieren, nicht nur m
verschickten Nachrichten werden so nur auf den beteiligten Servern gespeichert. Auch die Anrufe laufen nur über die
beteiligten Server.
Die Serverregeln kannst du gerne [hier](https://matrix.sp-codes.de/_matrix/consent) nachlesen. Melde dich gerne auf meinem Server an oder suche dir einen aus den unten verlinkten Listen heraus. Ich freue mich auf
deine Nachricht an [@samuel-p:matrix.sp-codes.de](https://matrix.to/#/@samuel-p:matrix.sp-codes.de).
## Einstieg
Auf meinem Blog findest du eine Artikelserie für einen einfachen Einstieg in Matrix:
Hier findest du eine Artikelserie für einen einfachen Einstieg in Matrix:
<div class="row justify-content-center">
<div class="col-12 col-md-10 col-lg-8">

4
src/de/services/matrix/setup/part-1.md
View file

@ -42,7 +42,7 @@ auch.) Die Matrix-ID sieht also folgendermaßen aus:
In diesem Beitrag werde ich [matrix.sp-codes.de](https://matrix.sp-codes.de) als Home-Server verwenden. Gerne kannst du
dich auch dort registrieren. Da ich selber diesen Server nutze, ist meine Matrix-ID also
diese: [@samuel-p:matrix.sp-codes.de](https://matrix.to/#/@samuel-p:matrix.sp-codes.de)
diese: [@samuel-p:matrix.sp-codes.de](https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de)
## App wählen
@ -124,7 +124,7 @@ das kann je nach Server-Auslastung ein bisschen dauern.
Nachdem du nun deinen Account erstellt hast, ist es an der Zeit, mit deinen Liebsten Kontakt aufzunehmen. Frage sie
hierfür beispielsweise nach ihrer Matrix-ID. Gerne kannst du auch mir eine Nachricht zukommen
lassen: [@samuel-p:matrix.sp-codes.de](https://matrix.to/#/@samuel-p:matrix.sp-codes.de)
lassen: [@samuel-p:matrix.sp-codes.de](https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de)
Um einen neuen Chat zu starten, tippe auf den grünen Button unten rechts und anschließend auf „Mit matrix-ID
hinzufügen“. Nun gibst du die Matrix-ID deines:deiner Chatpartner:in ein, wählst den ersten Treffer aus der Liste aus

2
src/en/contact.html
View file

@ -23,7 +23,7 @@ eleventyNavigation:
<div>Follow me on Mastodon or send me a message to <strong>@samuel_p@social.sp-codes.de</strong></div>
</a>
<a class="card mb-3 d-flex align-items-center text-decoration-none"
href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de">
href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de">
<div class="pr-3"><span class="i-matrix text-foreground i-fw i-4x"></span></div>
<div>Write me on Matrix to <strong>@samuel-p:matrix.sp-codes.de</strong></div>
</a>

2
src/en/services/matrix.md
View file

@ -10,7 +10,7 @@ Users can choose a public server or create their own and still communicate with
__Since the beginning of 2020 I run a public Matrix server: [matrix.sp-codes.de](https://matrix.sp-codes.de/) And a public Element-Web instance: [chat.sp-codes.de](https://chat.sp-codes.de/)__
You can read the server rules [here](https://matrix.sp-codes.de/_matrix/consent) (German). Feel free to create an account on my server or choose one from the lists linked below. I look forward to hear from you [@samuel-p:matrix.sp-codes.de](https://matrix.to/#/@samuel-p:matrix.sp-codes.de).
You can read the server rules [here](https://matrix.sp-codes.de/_matrix/consent) (German). Feel free to create an account on my server or choose one from the lists linked below. I look forward to hear from you [@samuel-p:matrix.sp-codes.de](https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de).
<div class="text-center mb-3">
<a class="card d-inline-block font-weight-bold" target="_blank" href="https://chat.sp-codes.de/#/register">Register now</a>

65
src/scss/main.scss
View file

@ -104,8 +104,11 @@ a {
margin: 0 auto;
border-radius: 50%;
overflow: hidden;
box-shadow: inset 0 0 6px 4px #fff;
img {
position: relative;
z-index: -1;
width: 100%;
height: 100%;
}
@ -251,7 +254,7 @@ a {
padding: .5rem 1rem;
border-radius: 10px;
transform: rotate(20deg);
box-shadow: -1px 8px 5px rgba(0, 0, 0, .7);
box-shadow: -1px 3px 5px rgba(255, 255, 255, .3);
}
.inner {
@ -381,6 +384,16 @@ table.table {
}
.tab-card.ossrox {
position: relative;
.link {
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
}
.title {
background-color: #006269;
color: #fff;
@ -388,10 +401,6 @@ table.table {
text-align: center;
}
.card {
}
img {
max-width: 250px;
max-height: 50px;
@ -414,12 +423,20 @@ table.table {
color: #000;
}
a {
color: #555;
&:hover {
color: #333;
}
}
.me-profile {
border: 1px solid #000;
}
.nav {
background-color: #eee;
background-color: #bbb;
}
.menu {
@ -427,4 +444,38 @@ table.table {
color: #000;
}
}
}
.card {
background-color: #ccc;
border: 1px solid #000;
}
.card-list {
.card:last-child {
border-bottom: 1px solid #000;
}
}
.service {
.beta {
box-shadow: -1px 3px 5px rgba(0, 0, 0, .3);
}
}
table.table {
background-color: #eee;
tr:nth-child(2n) {
background-color: #0000000b;
}
}
.tab-card .title {
border: 1px solid #000;
border-bottom: none;
}
.contact-links a {
color: #000 !important;
}
}