From 195df0154d557d3ce2d857ae737aac62126c4e65 Mon Sep 17 00:00:00 2001 From: neodk2004 Date: Sun, 21 Jun 2026 21:46:30 +0200 Subject: [PATCH] feat(legal): redesign Impressum and Datenschutz with PawFeed branding --- src/app/datenschutz/page.tsx | 215 ++++++++++++++++----------- src/app/impressum/page.tsx | 157 ++++++++++--------- src/components/legal/LegalLayout.tsx | 75 ++++++++++ 3 files changed, 285 insertions(+), 162 deletions(-) create mode 100644 src/components/legal/LegalLayout.tsx diff --git a/src/app/datenschutz/page.tsx b/src/app/datenschutz/page.tsx index d61908c..9af5be5 100644 --- a/src/app/datenschutz/page.tsx +++ b/src/app/datenschutz/page.tsx @@ -1,6 +1,8 @@ "use client"; import { useEffect, useState } from "react"; +import Link from "next/link"; +import { LegalLayout, LegalSection } from "@/components/legal/LegalLayout"; function decode(b64: string): string { try { @@ -10,112 +12,147 @@ function decode(b64: string): string { } } -const IMP_NAME = "RGFuaWVsIEJhcmFjIE9ubGluZWRpZW5zdGU="; +const IMP_NAME = "RGFuaWVsIEJhcmFjIE9ubGluZWRpZW5zdGU="; const IMP_STREET = "QWxwZW52ZWlsY2hlbndlZyA3"; -const IMP_CITY = "ODIxNDAgT2xjaGluZw=="; -const IMP_EMAIL = "d2VibWFzdGVyQHBhd2ZlZWQub3Jn"; +const IMP_CITY = "ODIxNDAgT2xjaGluZw=="; +const IMP_EMAIL = "d2VibWFzdGVyQHBhd2ZlZWQub3Jn"; export default function DatenschutzPage() { const [revealed, setRevealed] = useState(false); + useEffect(() => { setRevealed(true); }, []); - useEffect(() => { - setRevealed(true); - }, []); - - const name = revealed ? decode(IMP_NAME) : "––"; + const name = revealed ? decode(IMP_NAME) : "––"; const street = revealed ? decode(IMP_STREET) : "––"; - const city = revealed ? decode(IMP_CITY) : "––"; - const email = revealed ? decode(IMP_EMAIL) : "––"; + const city = revealed ? decode(IMP_CITY) : "––"; + const email = revealed ? decode(IMP_EMAIL) : "––"; + + const emailLink = revealed ? ( + + {email} + + ) : <>––; return ( -
-

Datenschutzerklärung

+ + +
+

{name}

+

{street}

+

{city}

+

E-Mail: {emailLink}

+
+ -

1. Verantwortlicher

-
-

{name}

-

{street}

-

{city}

- {revealed ? ( -

E-Mail: {email}

- ) : ( -

E-Mail: ––

- )} -
+ +

Wir erheben und verarbeiten personenbezogene Daten nur, soweit dies zur Bereitstellung unserer Plattform erforderlich ist oder Sie uns Daten freiwillig mitgeteilt haben:

+
    +
  • Kontodaten (E-Mail-Adresse, Passwort-Hash) zur Authentifizierung
    • +
  • Profilangaben (Name des Haustiers, Tierart, Fotos, Biografie)
    • +
  • Von Ihnen erstellte Inhalte (Beiträge, Kommentare, Nachrichten)
    • +
  • Nutzungsdaten (IP-Adresse, Zeitstempel, Seitenaufrufe)
    • +
+ -

2. Erhebung und Verarbeitung personenbezogener Daten

-

- Wir erheben und verarbeiten personenbezogene Daten nur, soweit dies zur Bereitstellung - unserer Plattform erforderlich ist oder Sie uns Daten freiwillig mitgeteilt haben. -

-
    -
  • Kontodaten (E-Mail-Adresse, Passwort-Hash) zur Authentifizierung
    • -
  • Profilangaben (Name des Haustiers, Tierart, Fotos, Biografie)
    • -
  • Von Ihnen erstellte Inhalte (Beiträge, Kommentare, Nachrichten)
    • -
  • Nutzungsdaten (IP-Adresse, Zeitstempel, Seitenaufrufe)
    • -
+ +

+ Die Verarbeitung personenbezogener Daten erfolgt auf Grundlage von Art. 6 Abs. 1 lit. b + DSGVO (Vertragserfüllung) sowie Art. 6 Abs. 1 lit. f DSGVO (berechtigte Interessen, + insbesondere Betrieb und Sicherheit der Plattform). +

+ -

3. Rechtsgrundlagen der Verarbeitung

-

- Die Verarbeitung personenbezogener Daten erfolgt auf Grundlage von Art. 6 Abs. 1 lit. b - DSGVO (Vertragserfüllung) sowie Art. 6 Abs. 1 lit. f DSGVO (berechtigte Interessen, - insbesondere Betrieb und Sicherheit der Plattform). -

+ +
    + {[ + { name: "Clerk Inc.", detail: "Authentifizierungsdienst (USA) · Datenübertragung auf Basis von EU-SCC" }, + { name: "Supabase Inc.", detail: "Datenbankhosting (AWS EU-West) · AVV abgeschlossen" }, + { name: "Cloudflare Inc.", detail: "Medienspeicherung und CDN (USA/EU) · AVV abgeschlossen" }, + { name: "Mux Inc.", detail: "Videoverarbeitung (USA) · SCC-Basis" }, + ].map((p) => ( +
  • + {p.name} + {p.detail} +
    • + ))} +
+ -

4. Drittanbieter und Auftragsverarbeiter

-
    -
  • Clerk Inc. – Authentifizierungsdienst (USA). Datenübertragung auf Basis von EU-SCC.
    • -
  • Supabase Inc. – Datenbankhosting (AWS EU-West). AVV abgeschlossen.
    • -
  • Cloudflare Inc. – Medienspeicherung und CDN (USA/EU). AVV abgeschlossen.
    • -
  • Mux Inc. – Videoverarbeitung (USA). SCC-Basis.
    • -
+ +

+ Wir verwenden technisch notwendige Cookies zur Sitzungsverwaltung. Tracking-Cookies oder + Cookies zu Werbezwecken werden ohne Ihre ausdrückliche Einwilligung nicht gesetzt. +

+ -

5. Cookies und Tracking

-

- Wir verwenden technisch notwendige Cookies zur Sitzungsverwaltung. Tracking-Cookies oder - Cookies zu Werbezwecken werden ohne Ihre ausdrückliche Einwilligung nicht gesetzt. -

+ +

+ Personenbezogene Daten werden gelöscht, sobald der Zweck der Verarbeitung entfällt und + keine gesetzlichen Aufbewahrungspflichten entgegenstehen. Kontodaten werden nach + Löschung des Kontos innerhalb von 30 Tagen gelöscht. +

+ -

6. Speicherdauer

-

- Personenbezogene Daten werden gelöscht, sobald der Zweck der Verarbeitung entfällt und - keine gesetzlichen Aufbewahrungspflichten entgegenstehen. Kontodaten werden nach Löschung - des Kontos innerhalb von 30 Tagen gelöscht. -

+ +
    + {[ + "Auskunft (Art. 15 DSGVO)", + "Berichtigung (Art. 16 DSGVO)", + "Löschung (Art. 17 DSGVO)", + "Einschränkung (Art. 18 DSGVO)", + "Datenübertragbarkeit (Art. 20 DSGVO)", + "Widerspruchsrecht (Art. 21 DSGVO)", + ].map((right) => ( +
  • + + {right} +
    • + ))} +
+

Zur Ausübung Ihrer Rechte wenden Sie sich per E-Mail an {emailLink}.

+ -

7. Ihre Rechte

-
    -
  • Auskunft (Art. 15 DSGVO)
    • -
  • Berichtigung (Art. 16 DSGVO)
    • -
  • Löschung (Art. 17 DSGVO)
    • -
  • Einschränkung der Verarbeitung (Art. 18 DSGVO)
    • -
  • Datenübertragbarkeit (Art. 20 DSGVO)
    • -
  • Widerspruchsrecht (Art. 21 DSGVO)
    • -
-

- Zur Ausübung Ihrer Rechte wenden Sie sich per E-Mail an{" "} - {revealed ? {email} : "––"}. -

+ +

+ Sie haben das Recht, sich bei einer Datenschutz-Aufsichtsbehörde zu beschweren. + Zuständig ist das Bayerische Landesamt für Datenschutzaufsicht (BayLDA),{" "} + + www.lda.bayern.de + + . +

+ -

8. Beschwerderecht

-

- Sie haben das Recht, sich bei einer Datenschutz-Aufsichtsbehörde zu beschweren. Zuständig - ist das Bayerische Landesamt für Datenschutzaufsicht (BayLDA),{" "} - - www.lda.bayern.de - - . -

+ +

+ Unser Angebot richtet sich nicht an Personen unter 13 Jahren. Wir erheben wissentlich + keine personenbezogenen Daten von Kindern unter 13 Jahren. +

+ -

9. Minderjährigenschutz

-

- Unser Angebot richtet sich nicht an Personen unter 13 Jahren. Wir erheben wissentlich keine - personenbezogenen Daten von Kindern unter 13 Jahren. -

+ +

+ Stand: Juni 2026. Durch die Weiterentwicklung unserer Plattform kann es notwendig + werden, diese Erklärung zu ändern. Die jeweils aktuelle Fassung ist stets auf dieser + Seite abrufbar. +

+ -

10. Aktualität dieser Erklärung

-

Stand: Juni 2026. Durch die Weiterentwicklung unserer Plattform kann es notwendig werden, - diese Erklärung zu ändern.

-
+
+

Weitere rechtliche Informationen

+
+ + Impressum + + + AGB + +
+
+ ); } diff --git a/src/app/impressum/page.tsx b/src/app/impressum/page.tsx index 0294a84..a2e5ea7 100644 --- a/src/app/impressum/page.tsx +++ b/src/app/impressum/page.tsx @@ -1,6 +1,8 @@ "use client"; import { useEffect, useState } from "react"; +import Link from "next/link"; +import { LegalLayout, LegalSection } from "@/components/legal/LegalLayout"; function decode(b64: string): string { try { @@ -10,95 +12,104 @@ function decode(b64: string): string { } } -// Base64-encoded contact data — decoded client-side only; crawlers see placeholders. -const IMP_NAME = "RGFuaWVsIEJhcmFjIE9ubGluZWRpZW5zdGU="; +const IMP_NAME = "RGFuaWVsIEJhcmFjIE9ubGluZWRpZW5zdGU="; const IMP_STREET = "QWxwZW52ZWlsY2hlbndlZyA3"; -const IMP_CITY = "ODIxNDAgT2xjaGluZw=="; -const IMP_EMAIL = "d2VibWFzdGVyQHBhd2ZlZWQub3Jn"; +const IMP_CITY = "ODIxNDAgT2xjaGluZw=="; +const IMP_EMAIL = "d2VibWFzdGVyQHBhd2ZlZWQub3Jn"; export default function ImpressumPage() { const [revealed, setRevealed] = useState(false); + useEffect(() => { setRevealed(true); }, []); - useEffect(() => { - setRevealed(true); - }, []); + const name = revealed ? decode(IMP_NAME) : "––"; + const street = revealed ? decode(IMP_STREET) : "––"; + const city = revealed ? decode(IMP_CITY) : "––"; + const email = revealed ? decode(IMP_EMAIL) : "––"; return ( -
-

Impressum

- -

Angaben gemäß § 5 TMG

- {revealed ? ( -
-

{decode(IMP_NAME)}

-

{decode(IMP_STREET)}

-

{decode(IMP_CITY)}

+ + +
+

{name}

+

{street}

+

{city}

- ) : ( -
-

​

-

​

-

​

-
- )} + -

Kontakt

- {revealed ? ( +

E-Mail:{" "} - {decode(IMP_EMAIL)} + {revealed ? ( + + {email} + + ) : ( + "––" + )}

- ) : ( -

- ​ + + + +

+

{name}

+

{street}

+

{city}

+
+ + + +

+ Die Europäische Kommission stellt eine Plattform zur Online-Streitbeilegung bereit:{" "} + + ec.europa.eu/consumers/odr + + . Wir nehmen nicht an Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teil.

- )} + -

Verantwortlich für den Inhalt nach § 55 Abs. 2 RStV

- {revealed ? ( -
-

{decode(IMP_NAME)}

-

{decode(IMP_STREET)}

-

{decode(IMP_CITY)}

-
- ) : ( -
-

​

-
- )} + +

+ Als Diensteanbieter sind wir gemäß § 7 Abs. 1 TMG für eigene Inhalte nach den + allgemeinen Gesetzen verantwortlich. Nach §§ 8–10 TMG sind wir nicht verpflichtet, + übermittelte oder gespeicherte fremde Informationen zu überwachen. +

+ -

Streitschlichtung

-

- Die Europäische Kommission stellt eine Plattform zur Online-Streitbeilegung (OS) bereit:{" "} - - https://ec.europa.eu/consumers/odr/ - - . Wir sind nicht bereit oder verpflichtet, an Streitbeilegungsverfahren vor einer - Verbraucherschlichtungsstelle teilzunehmen. -

+ +

+ Unser Angebot enthält Links zu externen Websites. Für deren Inhalte ist stets der + jeweilige Anbieter verantwortlich. Eine dauerhafte Kontrolle der verlinkten Seiten ist + ohne konkrete Anhaltspunkte einer Rechtsverletzung nicht zumutbar. +

+ -

Haftung für Inhalte

-

- Als Diensteanbieter sind wir gemäß § 7 Abs. 1 TMG für eigene Inhalte auf diesen Seiten nach - den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter - jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu - überwachen oder nach Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen. -

+ +

+ Die durch uns erstellten Inhalte und Werke unterliegen dem deutschen Urheberrecht. + Vervielfältigung, Bearbeitung und Verbreitung außerhalb der Grenzen des Urheberrechts + bedürfen der schriftlichen Zustimmung. +

+ -

Haftung für Links

-

- Unser Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte wir keinen - Einfluss haben. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder - Betreiber der Seiten verantwortlich. -

- -

Urheberrecht

-

- Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen - dem deutschen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der - Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen Zustimmung - des jeweiligen Autors bzw. Erstellers. -

-
+
+

Weitere rechtliche Informationen

+
+ + Datenschutz + + + AGB + +
+
+ ); } diff --git a/src/components/legal/LegalLayout.tsx b/src/components/legal/LegalLayout.tsx new file mode 100644 index 0000000..19d9029 --- /dev/null +++ b/src/components/legal/LegalLayout.tsx @@ -0,0 +1,75 @@ +import Link from "next/link"; +import { PawPrint, ArrowLeft } from "lucide-react"; + +export function LegalLayout({ + title, + subtitle, + children, +}: { + title: string; + subtitle?: string; + children: React.ReactNode; +}) { + return ( +
+
+ {/* Back link */} + + + Zurück zu PawFeed + + + {/* Logo */} +
+
+ +
+ PawFeed +
+ + {/* Page title card */} +
+

{title}

+ {subtitle && ( +

{subtitle}

+ )} +
+ + {/* Sections */} +
{children}
+ + {/* Footer */} +

+ © {new Date().getFullYear()} PawFeed · Alle Rechte vorbehalten +

+
+
+ ); +} + +export function LegalSection({ + number, + title, + children, +}: { + number: string | number; + title: string; + children: React.ReactNode; +}) { + return ( +
+
+ + {number} + +

{title}

+
+
+ {children} +
+
+ ); +}