From 2a3491b98baae646109591b6a334d128aa44a8fe Mon Sep 17 00:00:00 2001 From: Kevin Veen-Birkenbach Date: Thu, 9 Jan 2025 16:30:38 +0100 Subject: [PATCH] Added warnings --- app/config.yaml | 37 ++++++++++- app/static/js/modal.js | 100 ++++++++++++++--------------- app/templates/moduls/base.html.j2 | 2 + app/templates/moduls/modal.html.j2 | 14 ++-- 4 files changed, 94 insertions(+), 59 deletions(-) diff --git a/app/config.yaml b/app/config.yaml index f3c98dc..6b3620d 100644 --- a/app/config.yaml +++ b/app/config.yaml @@ -170,11 +170,26 @@ navigation: class: fa-solid fa-envelope url: mailto:kevin@veen.world identifier: kevin@veen.world + alternatives: + - link: navigation.header.contact.matrix - name: Matrix description: Chat with me on Matrix icon: class: fa-solid fa-cubes identifier: "@kevinveenbirkenbach:veen.world" + info: | + #### Why Use Matrix? + Matrix is a secure, decentralized communication platform that ensures privacy and control over your data. Learn more about [Matrix](https://matrix.org/). + + #### Privacy and Security + End-to-end encryption keeps your conversations private and secure. + + #### Decentralized and Open + Matrix's federated network means you can host your own server or use any provider while staying connected. + + #### A Movement for Digital Freedom + By using Matrix, you support open, transparent, and secure communication. + - name: Mobile description: Call me icon: @@ -183,10 +198,24 @@ navigation: identifier: "+491781798023" target: _top - name: Encrypted Email (PGP) - description: Access my PGP key + description: Download my PGP key icon: class: fa-solid fa-key url: https://s.veen.world/pgp + identifier: kevin@veen.world + info: | + #### Why Use PGP? + PGP ensures your email content stays private, protecting against surveillance, data breaches, and unauthorized access. + + #### Protect Your Privacy + In an age of mass data collection, PGP empowers you to communicate securely and assert control over your information. For insights on protecting your digital rights, visit the [Electronic Frontier Foundation (EFF)](https://www.eff.org/). + + #### Build Trust + Encrypting emails demonstrates a commitment to privacy and security, fostering trust in professional and personal communication. + + #### Stand for Security + Using PGP is more than a tool—it's a statement about valuing freedom, privacy, and the security of digital communication. Explore the principles of secure communication with [privacy guides](https://privacyguides.org/). + - name: Signal description: Message me on Signal icon: @@ -211,9 +240,13 @@ navigation: class: fa-brands fa-whatsapp url: https://wa.me/491781798023 identifier: "+491781798023" - warning: Whatsapp is not hosted by me! + warning: | + ⚠️ **Caution with Meta Services** + Using software and platforms from the Meta corporation (e.g., Facebook, Instagram, WhatsApp) may compromise your data privacy and digital freedom due to centralized control, extensive data collection practices, and inconsistent moderation policies. These platforms often fail to adequately address harmful content, misinformation, and abuse. + 📌 **Recommendation:** Consider using decentralized and privacy-respecting alternatives to maintain control over your data, improve security, and foster healthier online interactions. alternatives: - link: navigation.header.contact.matrix + footer: - name: External Accounts description: Me on other plattforms diff --git a/app/static/js/modal.js b/app/static/js/modal.js index 624c90f..f5b72b2 100644 --- a/app/static/js/modal.js +++ b/app/static/js/modal.js @@ -5,60 +5,60 @@ function openDynamicPopup(subitem) { // Setze den Titel mit Icon, falls vorhanden const modalTitle = document.getElementById('dynamicModalLabel'); if (subitem.icon && subitem.icon.class) { - modalTitle.innerHTML = ` ${subitem.name}`; + modalTitle.innerHTML = ` ${subitem.name}`; } else { - modalTitle.innerText = subitem.name; + modalTitle.innerText = subitem.name; } // Setze den Identifier, falls vorhanden const identifierBox = document.getElementById('dynamicIdentifierBox'); const modalContent = document.getElementById('dynamicModalContent'); if (subitem.identifier) { - identifierBox.classList.remove('d-none'); - modalContent.value = subitem.identifier; + identifierBox.classList.remove('d-none'); + modalContent.value = subitem.identifier; } else { - identifierBox.classList.add('d-none'); - modalContent.value = ''; + identifierBox.classList.add('d-none'); + modalContent.value = ''; + } + + // Konfiguriere die Warnbox mit Markdown + const warningBox = document.getElementById('dynamicModalWarning'); + if (subitem.warning) { + warningBox.classList.remove('d-none'); + document.getElementById('dynamicModalWarningText').innerHTML = marked.parse(subitem.warning); + } else { + warningBox.classList.add('d-none'); + } + + // Konfiguriere die Infobox mit Markdown + const infoBox = document.getElementById('dynamicModalInfo'); + if (subitem.info) { + infoBox.classList.remove('d-none'); + document.getElementById('dynamicModalInfoText').innerHTML = marked.parse(subitem.info); + } else { + infoBox.classList.add('d-none'); } // Zeige die Beschreibung, falls keine URL vorhanden ist const descriptionText = document.getElementById('dynamicDescriptionText'); if (!subitem.url && subitem.description) { - descriptionText.classList.remove('d-none'); - descriptionText.innerText = subitem.description; + descriptionText.classList.remove('d-none'); + descriptionText.innerText = subitem.description; } else { - descriptionText.classList.add('d-none'); - descriptionText.innerText = ''; - } - - // Konfiguriere die Warnbox - const warningBox = document.getElementById('dynamicModalWarning'); - if (subitem.warning) { - warningBox.classList.remove('d-none'); - document.getElementById('dynamicModalWarningText').innerText = subitem.warning; - } else { - warningBox.classList.add('d-none'); - } - - // Konfiguriere die Infobox - const infoBox = document.getElementById('dynamicModalInfo'); - if (subitem.info) { - infoBox.classList.remove('d-none'); - document.getElementById('dynamicModalInfoText').innerText = subitem.info; - } else { - infoBox.classList.add('d-none'); + descriptionText.classList.add('d-none'); + descriptionText.innerText = ''; } // Konfiguriere den Link oder die Beschreibung const linkBox = document.getElementById('dynamicModalLink'); const linkHref = document.getElementById('dynamicModalLinkHref'); if (subitem.url) { - linkBox.classList.remove('d-none'); - linkHref.href = subitem.url; - linkHref.innerText = subitem.description || "Open Link"; + linkBox.classList.remove('d-none'); + linkHref.href = subitem.url; + linkHref.innerText = subitem.description || "Open Link"; } else { - linkBox.classList.add('d-none'); - linkHref.href = '#'; + linkBox.classList.add('d-none'); + linkHref.href = '#'; } // Konfiguriere die Alternativen @@ -66,28 +66,28 @@ function openDynamicPopup(subitem) { const alternativesList = document.getElementById('dynamicAlternativesList'); alternativesList.innerHTML = ''; // Clear existing alternatives if (subitem.alternatives && subitem.alternatives.length > 0) { - alternativesSection.classList.remove('d-none'); - subitem.alternatives.forEach(alt => { - const listItem = document.createElement('li'); - listItem.classList.add('list-group-item', 'd-flex', 'justify-content-between', 'align-items-center'); - listItem.innerHTML = ` - - ${alt.name} - - - `; - alternativesList.appendChild(listItem); - }); + alternativesSection.classList.remove('d-none'); + subitem.alternatives.forEach(alt => { + const listItem = document.createElement('li'); + listItem.classList.add('list-group-item', 'd-flex', 'justify-content-between', 'align-items-center'); + listItem.innerHTML = ` + + ${alt.name} + + + `; + alternativesList.appendChild(listItem); + }); } else { - alternativesSection.classList.add('d-none'); + alternativesSection.classList.add('d-none'); } // Kopierfunktion für den Identifier document.getElementById('dynamicCopyButton').addEventListener('click', function () { - modalContent.select(); - navigator.clipboard.writeText(modalContent.value).then(() => { - alert('Identifier copied to clipboard!'); - }); + modalContent.select(); + navigator.clipboard.writeText(modalContent.value).then(() => { + alert('Identifier copied to clipboard!'); + }); }); // Modal anzeigen diff --git a/app/templates/moduls/base.html.j2 b/app/templates/moduls/base.html.j2 index fb1fc23..d61766a 100644 --- a/app/templates/moduls/base.html.j2 +++ b/app/templates/moduls/base.html.j2 @@ -12,6 +12,8 @@ + + diff --git a/app/templates/moduls/modal.html.j2 b/app/templates/moduls/modal.html.j2 index 27b0979..b7fac4a 100644 --- a/app/templates/moduls/modal.html.j2 +++ b/app/templates/moduls/modal.html.j2 @@ -6,26 +6,26 @@
- + - + - +
- + - +
Alternatives: