From a41f502c6dc7a2dbdcefbef648c7c852f4d67002 Mon Sep 17 00:00:00 2001
From: Thomas Ruoff <ThomasRuoff@gmail.com>
Date: Thu, 10 Dec 2020 23:55:08 +0100
Subject: [PATCH] complete privacy and impressum

---
 components/footer.tsx | 17 +++++++++----
 components/header.tsx | 14 ++++++++---
 pages/impressum.tsx   | 55 +++++++++++++++++++++++++++++++++++++++++++
 pages/privacy.tsx     | 50 +++++++++++++++++++++------------------
 4 files changed, 106 insertions(+), 30 deletions(-)
 create mode 100644 pages/impressum.tsx

diff --git a/components/footer.tsx b/components/footer.tsx
index cec7914..fbb0b36 100644
--- a/components/footer.tsx
+++ b/components/footer.tsx
@@ -1,12 +1,21 @@
 import React from 'react'
+import Link from 'next/link'
 
 export default function Footer() {
   return (
     <footer className="footer">
-      <p>i.A. des Freundeskreis des VCP Rosenfeld</p>
-      <p>
-        Hier sollte es irgendwann ein Impressum, Datenschutzhinweise usw. geben.
-      </p>
+      <ul className="flex flex-row gap-2">
+        <li>
+          <Link href="/privacy">
+            <a className="link">Datenschutzerklärung</a>
+          </Link>
+        </li>
+        <li>
+          <Link href="/impressum">
+            <a className="link">Impressum</a>
+          </Link>
+        </li>
+      </ul>
     </footer>
   )
 }
diff --git a/components/header.tsx b/components/header.tsx
index 66e99e7..7810f3e 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -29,9 +29,17 @@ export default function Header({ label }: { label?: string }) {
                 Admin
               </div>
             )}
-            <h2 className="mr-3 flex-grow">
-              <span className="font-extrabold">{label}</span>
-            </h2>
+            <>
+              <h2 className="mr-1">
+                <Link href="/">
+                  <a className="font-extrabold">Home</a>
+                </Link>
+              </h2>
+              {'>'}
+              <h2 className="mx-1 flex-grow">
+                <span className="font-extrabold">{label}</span>
+              </h2>
+            </>
           </div>
         )}
       </div>
diff --git a/pages/impressum.tsx b/pages/impressum.tsx
new file mode 100644
index 0000000..e444bfc
--- /dev/null
+++ b/pages/impressum.tsx
@@ -0,0 +1,55 @@
+import React from 'react'
+import Header from '../components/header'
+
+export default function Impressum() {
+  return (
+    <>
+      <Header label="impressum" />
+      <main className="main">
+        <h1 className="mb-3 text-xl font-extrabold">Impressum</h1>
+
+        <address className="mb-3">
+          Freundeskreis des VCP Rosenfeld e.V.
+          <br />
+          Mozartstr. 11
+          <br />
+          72348 Rosenfeld
+          <br />
+        </address>
+
+        <h2 className="text-lg">1. Vorsitzender:</h2>
+        <address className="mb-3">
+          Kevin Deckert
+          <br />
+          Mozartstr. 11
+          <br />
+          72348 Rosenfeld
+          <br />
+          Telefon: +49 7428 3423
+          <br />
+        </address>
+
+        <h2 className="text-lg">
+          Bussle-Wart und Technisch Verantwortlicher dieser Webanwendung:
+        </h2>
+        <address className="mb-3">
+          Thomas Ruoff
+          <br />
+          Mömpelgardgasse 25
+          <br />
+          72348 Rosenfeld
+          <br />
+          Telefon: +49 151 21225362
+          <br />
+        </address>
+
+        <p>
+          Das Impressum gilt für:{' '}
+          <a className="link" href="https://pfadi-bussle.tomru.space">
+            https://pfadi-bussle.tomru.space
+          </a>
+        </p>
+      </main>
+    </>
+  )
+}
diff --git a/pages/privacy.tsx b/pages/privacy.tsx
index f6b7bf5..d81d21e 100644
--- a/pages/privacy.tsx
+++ b/pages/privacy.tsx
@@ -1,21 +1,24 @@
 import React from 'react'
-import Footer from '../components/footer'
 import Header from '../components/header'
 
 export default function Privacy() {
   return (
     <>
-      <Header />
-      <main className="main">
-        <h1>Datenschutzerklärung</h1>
-        <h2>Geltungsbereich</h2>
-        <p>
+      <Header label="Datenschutzerklärung" />
+      <main className="main text-gray-900">
+        <h1 className="mb-3 text-xl font-extrabold">Datenschutzerklärung</h1>
+        <h2 className="mb-2 text-lg font-extrabold">Geltungsbereich</h2>
+        <p className="mb-2">
           Diese Datenschutzerklärung soll die Nutzer dieser Website gemäß
           Bundesdatenschutzgesetz und Telemediengesetz über die Art, den Umfang
           und den Zweck der Erhebung und Verwendung personenbezogener Daten
-          durch den Websitebetreiber [Ihre Kontaktdaten einfügen] informieren.
+          durch den Websitebetreiber{' '}
+          <a className="link" href="mailto:pfadibussle@mail.id0.link">
+            Thomas Ruoff
+          </a>{' '}
+          informieren.
         </p>
-        <p>
+        <p className="mb-2">
           Der Websitebetreiber nimmt Ihren Datenschutz sehr ernst und behandelt
           Ihre personenbezogenen Daten vertraulich und entsprechend der
           gesetzlichen Vorschriften. Bedenken Sie, dass die Datenübertragung im
@@ -23,13 +26,13 @@ export default function Privacy() {
           vollumfänglicher Schutz vor dem Zugriff durch Fremde ist nicht
           realisierbar.
         </p>
-        <h2>Zugriffsdaten</h2>
-        <p>
+        <h2 className="mb-2 text-lg font-extrabold">Zugriffsdaten</h2>
+        <p className="mb-2">
           Der Websitebetreiber bzw. Seitenprovider erhebt Daten über Zugriffe
           auf die Seite und speichert diese als „Server-Logfiles“ ab. Folgende
           Daten werden so protokolliert:{' '}
         </p>
-        <ul>
+        <ul className="mb-2 list-disc list-inside">
           <li>Besuchte URL</li>
           <li>Uhrzeit zum Zeitpunkt des Zugriffes</li>
           <li>Menge der gesendeten Daten in Byte</li>
@@ -39,7 +42,7 @@ export default function Privacy() {
           <li>Verwendete IP-Adresse</li>
         </ul>
 
-        <p>
+        <p className="mb-2">
           Die erhobenen Daten dienen lediglich statistischen Auswertungen und
           zur Verbesserung der Website. Der Websitebetreiber behält sich
           allerdings vor, die Server-Logfiles nachträglich zu überprüfen,
@@ -47,15 +50,17 @@ export default function Privacy() {
           hinweisen.
         </p>
 
-        <h2>Cookies</h2>
-        <p>Diese Website verwendet keine Cookies.</p>
-        <h2>Benutzerkonto</h2>
-        <p>
+        <h2 className="mb-2 text-lg font-extrabold">Cookies</h2>
+        <p className="mb-2">Diese Website verwendet keine Cookies.</p>
+        <h2 className="mb-2 text-lg font-extrabold">Benutzerkonto</h2>
+        <p className="mb-2">
           Um über dieses Angebot Buchungsanfragen tätigen zu können, ist kein
           Kundenkonto notwendig noch vorgesehen.
         </p>
-        <h2>Buchungsanfragedaten merken</h2>
-        <p>
+        <h2 className="mb-2 text-lg font-extrabold">
+          Buchungsanfragedaten merken
+        </h2>
+        <p className="mb-2">
           Wenn sie eine Buchungsanfrage tätigen, wird Ihnen angeboten, die
           Buchunsanfragedaten für die nächste Buchung zu merken um weitere
           Anfragen zu beschleunigen. Die Speicherung der Buchungsdaten erfolgt
@@ -74,12 +79,12 @@ export default function Privacy() {
           vorausgefüllt. Falls Sie diese Daten löschen möchten, können Sie dies
           über einen Link in der Info-Nachricht bewerkstelligen.
         </p>
-        <h2>Buchungsanfrage</h2>
-        <p>
+        <h2 className="mb-2 text-lg font-extrabold">Buchungsanfrage</h2>
+        <p className="mb-2">
           Sämtliche Daten, welche im Rahmen einer Bestellabwicklung von den
           Kunden eingegeben werden, werden gespeichert. Dazu gehören:
         </p>
-        <ul>
+        <ul className="mb-2 list-disc list-inside">
           <li>Start- und Enddatum der Anfrage</li>
           <li>Zweck und Ziel der Fahrt (sofern angegeben)</li>
           <li>Verein (sofern angegeben)</li>
@@ -88,14 +93,13 @@ export default function Privacy() {
           <li>E-Mail-Adresse</li>
           <li>Telefonnummer (falls angegeben)</li>
         </ul>
-        <p>
+        <p className="mb-2">
           Jene Daten, welche zur Auftragsabwicklung zwingend notwendig sind,
           werden an dritte Dienstleister weitergegeben. Sowie die Aufbewahrung
           Ihrer Daten nicht mehr erforderlich oder gesetzlich geboten ist,
           werden diese gelöscht.
         </p>
       </main>
-      <Footer />
     </>
   )
 }