From 4729483c3e5b2443fb775c727ceca6dd6921733f Mon Sep 17 00:00:00 2001 From: Samuel Philipp Date: Wed, 20 Dec 2023 23:46:09 +0100 Subject: [PATCH] layout ng --- src/_data/services.json | 28 ++++++++++- src/_includes/layouts/article.njk | 2 +- src/_includes/layouts/service.njk | 8 ++-- src/_includes/profiles.html | 2 +- src/de/contact.html | 34 +++++++++++--- src/de/index.html | 7 ++- src/de/services/jitsi.md | 16 +------ src/de/services/mastodon.md | 21 +-------- src/de/services/matrix.md | 5 +- src/de/services/matrix/setup/part-1.md | 4 +- src/en/contact.html | 2 +- src/en/services/matrix.md | 2 +- src/scss/main.scss | 65 +++++++++++++++++++++++--- 13 files changed, 129 insertions(+), 67 deletions(-) diff --git a/src/_data/services.json b/src/_data/services.json index a7b6c30..0f23e73 100644 --- a/src/_data/services.json +++ b/src/_data/services.json @@ -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": "

Seit Anfang 2020 betreibe ich einen öffentlichen Matrix-Server: matrix.sp-codes.de und eine öffentliche Element-Web Instanz: chat.sp-codes.de

Die Serverregeln kannst du gerne hier 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.

Jetzt registrieren
", + "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": "

Seit Juli 2020 betreibe ich eine eigene Jitsi-Meet Instanz. Du findest sie unter jitsi.sp-codes.de.

Gerne darfst du die Instanz mit anderen Leuten nutzen.

Meeting starten
", + "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": "

Seit Mai 2021 betreibe ich eine öffentliche Mastodon-Instanz: social.sp-codes.de

Die Serverregeln und weitere Informationen kannst du gerne hier 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.

Jetzt registrieren
", + "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": "" + } } }, { diff --git a/src/_includes/layouts/article.njk b/src/_includes/layouts/article.njk index 509ac2d..dbee00c 100644 --- a/src/_includes/layouts/article.njk +++ b/src/_includes/layouts/article.njk @@ -86,7 +86,7 @@ layout: base.njk -
+
diff --git a/src/_includes/layouts/service.njk b/src/_includes/layouts/service.njk index e6c7772..fcf5860 100644 --- a/src/_includes/layouts/service.njk +++ b/src/_includes/layouts/service.njk @@ -14,17 +14,15 @@ layout: base.njk

sp-codes

- Seit Anfang 2020 betreibe ich einen öffentlichen Matrix-Server: matrix.sp-codes.de und eine öffentliche Element-Web Instanz: chat.sp-codes.de -
- Jetzt registrieren -
+ {{ service.description[locale] | safe }}
{% if service.ossrox %}
+
Ossrox
- {{service.ossrox.description[locale]}} + {{ service.ossrox.description[locale] }}
{% endif %} diff --git a/src/_includes/profiles.html b/src/_includes/profiles.html index 6cb40ea..55014a7 100644 --- a/src/_includes/profiles.html +++ b/src/_includes/profiles.html @@ -4,7 +4,7 @@
-
+
diff --git a/src/de/contact.html b/src/de/contact.html index f8c720e..19e1b04 100644 --- a/src/de/contact.html +++ b/src/de/contact.html @@ -12,32 +12,52 @@ eleventyNavigation:

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.

-
+
-
+
Schicke mir eine E-Mail an mail@sp-codes.de
 -
+
Folge mir auf Mastodon oder schicke mir dort eine Nachricht an @samuel_p@social.sp-codes.de
 -
+ href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de"> +
Schreibe mir auf Matrix an @samuel-p:matrix.sp-codes.de
 -
+
Schreibe mir auf XMPP an samuel-p@dismail.de
 -
+
Schreibe mir auf Threema an die ID YSCU6F6U
+ +

Sollte ich einmal nicht erreichbar sein, melde dich gerne im Matrix-Chat oder nutze die Verteiler-Adressen, die auch + an meine Moderatoren weitergeleitet werden.

+
+
+ +
+
#sp-codes:matrix.sp-codes.de
+ + +
+
help@sp-codes.de
+ + +
+
abuse@sp-codes.de
+ +
+
diff --git a/src/de/index.html b/src/de/index.html index 70e880d..ed9c475 100644 --- a/src/de/index.html +++ b/src/de/index.html @@ -19,7 +19,7 @@ eleventyNavigation:

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!

-
Werde gerne Teil unserer tollen Community!
+
Werde Teil unserer tollen Community!

Für alle, die die Dienste nutzen und Interessierte gibt es einen öffentlichen Matrix-Raum als Austauschort für Fragen, Ideen und Probleme: #sp-codes:matrix.sp-codes.de @@ -56,7 +56,10 @@ eleventyNavigation:

- + + + +

diff --git a/src/de/services/jitsi.md b/src/de/services/jitsi.md index 8217642..ea0af84 100644 --- a/src/de/services/jitsi.md +++ b/src/de/services/jitsi.md @@ -1,24 +1,10 @@ --- -layout: base.njk +layout: service.njk key: jitsi title: Jitsi Meet --- -# 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 Ossrox damit. Schau dir gerne unser Angebot dazu auf unserer Webseite an oder schreib mir eine Nachricht dazu. - -
- - Ossrox - -
- ## Weitere nützliche Links * [Jitsi Webseite](https://jitsi.org/) diff --git a/src/de/services/mastodon.md b/src/de/services/mastodon.md index 3a111ef..36a1f55 100644 --- a/src/de/services/mastodon.md +++ b/src/de/services/mastodon.md @@ -1,31 +1,12 @@ --- -layout: base.njk +layout: service.njk key: mastodon title: Mastodon --- -# 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). - -
-Jetzt registrieren -
- -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. - -
- - Ossrox - -
- ## Interessante Accounts * [Bundesbeauftragte für Datenschutz und Informationsfreiheit](https://social.bund.de/@bfdi) diff --git a/src/de/services/matrix.md b/src/de/services/matrix.md index 17e5832..ff94dc1 100644 --- a/src/de/services/matrix.md +++ b/src/de/services/matrix.md @@ -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:
diff --git a/src/de/services/matrix/setup/part-1.md b/src/de/services/matrix/setup/part-1.md index dc6b9f9..f337025 100644 --- a/src/de/services/matrix/setup/part-1.md +++ b/src/de/services/matrix/setup/part-1.md @@ -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 diff --git a/src/en/contact.html b/src/en/contact.html index ab8f3fe..955557c 100644 --- a/src/en/contact.html +++ b/src/en/contact.html @@ -23,7 +23,7 @@ eleventyNavigation:
Follow me on Mastodon or send me a message to @samuel_p@social.sp-codes.de
+ href="https://matrix.to/#/@samuel-p:matrix.sp-codes.de?via=matrix.sp-codes.de">
Write me on Matrix to @samuel-p:matrix.sp-codes.de
 diff --git a/src/en/services/matrix.md b/src/en/services/matrix.md index 5f08c48..aac0d5c 100644 --- a/src/en/services/matrix.md +++ b/src/en/services/matrix.md @@ -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).
Register now diff --git a/src/scss/main.scss b/src/scss/main.scss index 6d6883e..b8f6fe3 100644 --- a/src/scss/main.scss +++ b/src/scss/main.scss @@ -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; } } -} \ No newline at end of file + + .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; + } +}