From 965212c08ecc7bf1bc912e66aaf77dc09e7b11d0 Mon Sep 17 00:00:00 2001
From: Moritz Ruth <dev@moritz-ruth.de>
Date: Sun, 1 Dec 2019 12:28:29 +0100
Subject: [PATCH] Add legal notice and privacy policy

---
 .eslintrc.js                       |   2 +-
 assets/css/elements/_all.scss      |   1 +
 assets/css/elements/heading.scss   |   5 +-
 assets/css/elements/paragraph.scss |   7 +
 assets/css/global.scss             |   2 +-
 assets/icons/external.svg          |   1 +
 components/AnimatedLogo.vue        |   4 +-
 components/ExternalLink.vue        |  42 +++++
 components/NavigationBar.vue       |   5 +
 pages/index.vue                    |   4 +-
 pages/legal-notice.vue             |  78 ++++++++
 pages/privacy-policy.vue           | 286 +++++++++++++++++++++++++++++
 12 files changed, 429 insertions(+), 8 deletions(-)
 create mode 100644 assets/css/elements/paragraph.scss
 create mode 100644 assets/icons/external.svg
 create mode 100644 components/ExternalLink.vue
 create mode 100644 pages/legal-notice.vue
 create mode 100644 pages/privacy-policy.vue

diff --git a/.eslintrc.js b/.eslintrc.js
index 30977e7..6bbbbad 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -151,7 +151,7 @@ module.exports = {
     "vue/no-v-html": "off",
     "vue/html-self-closing": "off",
     "vue/singleline-html-element-content-newline": ["warn", {
-      ignores: ["pre", "textarea", "nuxt-link", ...INLINE_ELEMENTS]
+      ignores: ["pre", "textarea", "nuxt-link", "ExternalLink", ...INLINE_ELEMENTS]
     }]
   }
 };
diff --git a/assets/css/elements/_all.scss b/assets/css/elements/_all.scss
index 6521112..a848541 100644
--- a/assets/css/elements/_all.scss
+++ b/assets/css/elements/_all.scss
@@ -1,3 +1,4 @@
 @import "content";
 @import "link";
 @import "heading";
+@import "paragraph";
diff --git a/assets/css/elements/heading.scss b/assets/css/elements/heading.scss
index 2ecf0f0..850f405 100644
--- a/assets/css/elements/heading.scss
+++ b/assets/css/elements/heading.scss
@@ -4,11 +4,11 @@
 }
 
 .heading--1 {
-  font-size: 4.4rem;
+  font-size: 3.8rem;
 }
 
 .heading--2 {
-  font-size: 3.2rem;
+  font-size: 3rem;
 }
 
 .heading--3 {
@@ -26,4 +26,3 @@
 .heading--6 {
   font-size: 1.4rem;
 }
-
diff --git a/assets/css/elements/paragraph.scss b/assets/css/elements/paragraph.scss
new file mode 100644
index 0000000..8de6b89
--- /dev/null
+++ b/assets/css/elements/paragraph.scss
@@ -0,0 +1,7 @@
+.paragraph {
+  margin: 20px 0;
+
+  li {
+    margin-left: 20px;
+  }
+}
diff --git a/assets/css/global.scss b/assets/css/global.scss
index f6e7cbb..75c9e83 100644
--- a/assets/css/global.scss
+++ b/assets/css/global.scss
@@ -24,7 +24,7 @@ body {
 html, body, #__nuxt, #__layout, .fill-screen {
   max-width: 100vw;
   min-height: 100vh;
-  overflow-x: hidden;
+  overflow-x: auto;
 }
 
 ::selection {
diff --git a/assets/icons/external.svg b/assets/icons/external.svg
new file mode 100644
index 0000000..5ab2abf
--- /dev/null
+++ b/assets/icons/external.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"/></svg>
diff --git a/components/AnimatedLogo.vue b/components/AnimatedLogo.vue
index ee3cf77..a940ca8 100644
--- a/components/AnimatedLogo.vue
+++ b/components/AnimatedLogo.vue
@@ -8,7 +8,7 @@
 
 <style scoped lang="scss">
   .animated-logo {
-    animation: logo-width 800ms 1s ease, logo-height 800ms 1900ms ease;
+    animation: logo-width 800ms 1s ease, logo-height 600ms 1.9s ease;
     animation-fill-mode: both;
 
     overflow: hidden;
@@ -49,7 +49,7 @@
     right: 0;
     height: 6px;
 
-    animation: fadeOut 600ms 2.8s ease-in both;
+    animation: fadeOut 400ms 2.8s ease-in both;
   }
 
   .animated-logo__bar-1 {
diff --git a/components/ExternalLink.vue b/components/ExternalLink.vue
new file mode 100644
index 0000000..8bab975
--- /dev/null
+++ b/components/ExternalLink.vue
@@ -0,0 +1,42 @@
+<template>
+  <a
+    class="external-link link"
+    rel="noopener"
+    target="_blank"
+    :href="href"
+  >{{ label || href }}<ExternalIcon class="external-link__icon"/></a>
+</template>
+
+<style scoped lang="scss">
+  .external-link {
+    padding-right: 5px;
+    overflow-wrap: break-word;
+  }
+
+  .external-link__icon {
+    margin-left: 5px;
+
+    width: 15px;
+    position: relative;
+    top: 2px;
+  }
+</style>
+
+<script>
+  import ExternalIcon from "@/assets/icons/external.svg";
+
+  export default {
+    name: "ExternalLink",
+    components: { ExternalIcon },
+    props: {
+      href: {
+        type: String,
+        required: true
+      },
+      label: {
+        type: String,
+        default: null
+      }
+    }
+  };
+</script>
diff --git a/components/NavigationBar.vue b/components/NavigationBar.vue
index df07f0c..8127003 100644
--- a/components/NavigationBar.vue
+++ b/components/NavigationBar.vue
@@ -74,6 +74,11 @@
   .navigation-bar__title {
     font-size: 1.5rem;
     font-weight: bold;
+    text-overflow: ellipsis;
+    overflow: hidden;
+
+    flex-shrink: 0;
+    max-width: calc(100% - 50px);
 
     transition: 200ms ease;
     transition-property: opacity, transform;
diff --git a/pages/index.vue b/pages/index.vue
index 8f1393f..328fe96 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -35,7 +35,7 @@
   }
 
   .index-page__name {
-    animation: appear 400ms 3.8s ease both;
+    animation: appear 800ms 3.5s ease both;
 
     font-size: 2rem;
   }
@@ -62,6 +62,8 @@
   }
 
   .index-page__social-link {
+    color: black;
+
     &:not(:last-child) {
       margin-right: 15px;
     }
diff --git a/pages/legal-notice.vue b/pages/legal-notice.vue
new file mode 100644
index 0000000..a386ca2
--- /dev/null
+++ b/pages/legal-notice.vue
@@ -0,0 +1,78 @@
+<template>
+  <div class="legal-notice-page">
+    <NavigationBar show-background title="Legal Notice"/>
+    <h1 class="heading--1">
+      Legal Notice
+    </h1>
+    <h2 class="heading--3">
+      Diensteanbieter
+    </h2>
+    <p class="paragraph">
+      Moritz Ruth<br>
+      Zum Galgenberg 19<br>
+      66539 Neunkirchen<br>
+      Deutschland
+    </p>
+    <h2 class="heading--3">
+      Kontaktmöglichkeiten
+    </h2>
+    <p class="paragraph">
+      <b>Telefon</b>: +49 176 46146329
+    </p>
+    <p class="paragraph">
+      <b>E-Mail</b>: <a class="link" href="mailto:legal@moritz-ruth.de">legal@moritz-ruth.de</a>
+    </p>
+    <h2 class="heading--3">
+      Haftungs- und Urheberrechtshinweise
+    </h2>
+    <p class="paragraph">
+      <b>Haftungsausschluss</b>:
+      Die Inhalte dieses Onlineangebotes wurden sorgfältig und nach unserem aktuellen Kenntnisstand
+      erstellt, dienen jedoch nur der Information und entfalten keine rechtlich bindende Wirkung, sofern es sich nicht
+      um gesetzlich verpflichtende Informationen (z.B. das Impressum, die Datenschutzerklärung, AGB oder
+      Widerrufsbelehrungen für Verbraucher) handelt. Wir behalten uns vor, die Inhalte vollständig oder teilweise zu
+      ändern oder zu löschen, soweit vertragliche Verpflichtungen unberührt bleiben. Alle Angebote sind freibleibend und
+      unverbindlich.
+    </p>
+    <p class="paragraph">
+      <b>Links auf fremde Webseiten</b>:
+      Inhalte fremder Webseiten, auf die wir direkt oder indirekt verweisen, liegen
+      außerhalb unseres Verantwortungsbereiches und machen wir uns nicht zu Eigen. Für alle Inhalte und insbesondere für
+      Schäden, die aus der Nutzung der in den verlinkten Webseiten aufrufbaren Informationen entstehen, haftet allein
+      der Anbieter der verlinkten Webseiten.
+    </p>
+    <p class="paragraph">
+      <b>Urheberrechte und Markenrechte</b>:
+      Alle auf dieser Website dargestellten Inhalte, wie Texte, Fotografien, Grafiken,
+      Marken und Warenzeichen sind durch die jeweiligen Schutzrechte (Urheberrechte, Markenrechte) geschützt. Die
+      Verwendung, Vervielfältigung usw. unterliegen unseren Rechten oder den Rechten der jeweiligen Urheber bzw.
+      Rechteverwalter.
+    </p>
+    <p class="paragraph">
+      <b>Hinweise auf Rechtsverstöße</b>:
+      Sollten Sie innerhalb unseres Internetauftritts Rechtsverstöße bemerken, bitten wir
+      Sie uns auf diese hinzuweisen. Wir werden rechtswidrige Inhalte und Links nach Kenntnisnahme unverzüglich
+      entfernen.
+    </p>
+    <a
+      class="link"
+      href="https://datenschutz-generator.de/?l=de"
+      rel="noopener"
+      title="Rechtstext von Dr. Schwenke - für weitere Informationen bitte anklicken."
+      target="_blank"
+    >Erstellt mit kostenlosem Datenschutz-Generator.de von Dr. Thomas Schwenke</a>
+  </div>
+</template>
+
+<style scoped lang="scss">
+
+</style>
+
+<script>
+  import NavigationBar from "@/components/NavigationBar";
+
+  export default {
+    name: "LegalNoticePage",
+    components: { NavigationBar }
+  };
+</script>
diff --git a/pages/privacy-policy.vue b/pages/privacy-policy.vue
new file mode 100644
index 0000000..5e2d64b
--- /dev/null
+++ b/pages/privacy-policy.vue
@@ -0,0 +1,286 @@
+<template>
+  <div class="privacy-policy-page">
+    <NavigationBar show-background title="Datenschutzerklärung"/>
+    <h1 class="heading--1">
+      Datenschutzerklärung
+    </h1>
+    <p class="paragraph">
+      Verantwortlicher im Sinne der Datenschutzgesetze, insbesondere der EU-Datenschutzgrundverordnung (DSGVO), ist:
+    </p>
+    <p class="paragraph">
+      Moritz Ruth<br>
+      Zum Galgenberg 19<br>
+      66539 Neunkirchen<br>
+      Deutschland
+    </p>
+    <h2 class="heading--2">
+      Ihre Betroffenenrechte
+    </h2>
+    <p class="paragraph">
+      Unter den angegebenen Kontaktdaten unseres Datenschutzbeauftragten können Sie jederzeit folgende Rechte ausüben:
+    </p>
+    <ul class="paragraph">
+      <li>Auskunft über Ihre bei uns gespeicherten Daten und deren Verarbeitung (Art. 15 DSGVO),</li>
+      <li>Berichtigung unrichtiger personenbezogener Daten (Art. 16 DSGVO),</li>
+      <li>Löschung Ihrer bei uns gespeicherten Daten (Art. 17 DSGVO),</li>
+      <li>
+        Einschränkung der Datenverarbeitung, sofern wir Ihre Daten aufgrund gesetzlicher Pflichten noch nicht löschen
+        dürfen (Art. 18 DSGVO),
+      </li>
+      <li>Widerspruch gegen die Verarbeitung Ihrer Daten bei uns (Art. 21 DSGVO) und</li>
+      <li>
+        Datenübertragbarkeit, sofern Sie in die Datenverarbeitung eingewilligt haben oder einen Vertrag mit uns
+        abgeschlossen haben (Art. 20 DSGVO).
+      </li>
+    </ul>
+    <p class="paragraph">
+      Sofern Sie uns eine Einwilligung erteilt haben, können Sie diese jederzeit mit Wirkung für die Zukunft widerrufen.
+    </p>
+    <p class="paragraph">
+      Sie können sich jederzeit mit einer Beschwerde an eine Aufsichtsbehörde wenden, z. B. an die zuständige
+      Aufsichtsbehörde des Bundeslands Ihres Wohnsitzes oder an die für uns als verantwortliche Stelle zuständige
+      Behörde.
+    </p>
+    <p class="paragraph">
+      Eine Liste der Aufsichtsbehörden (für den nichtöffentlichen Bereich) mit Anschrift finden Sie unter:
+      <ExternalLink href="https://www.bfdi.bund.de/DE/Infothek/Anschriften_Links/anschriften_links-node.html"/>.
+    </p>
+    <h2 class="heading--2">
+      Erfassung allgemeiner Informationen beim Besuch unserer Website
+    </h2>
+    <h3 class="heading--3">
+      Art und Zweck der Verarbeitung
+    </h3>
+    <p class="paragraph">
+      Wenn Sie auf unsere Website zugreifen, d.h., wenn Sie sich nicht registrieren oder anderweitig Informationen
+      übermitteln, werden automatisch Informationen allgemeiner Natur erfasst. Diese Informationen (Server-Logfiles)
+      beinhalten etwa die Art des Webbrowsers, das verwendete Betriebssystem, den Domainnamen Ihres
+      Internet-Service-Providers, Ihre IP-Adresse und ähnliches.
+    </p>
+    <p class="paragraph">
+      Sie werden insbesondere zu folgenden Zwecken verarbeitet
+    </p>
+    <ul class="paragraph">
+      <li>Sicherstellung eines problemlosen Verbindungsaufbaus der Website,</li>
+      <li>Sicherstellung einer reibungslosen Nutzung unserer Website,</li>
+      <li>Auswertung der Systemsicherheit und -stabilität sowie</li>
+      <li>zu weiteren administrativen Zwecken.</li>
+    </ul>
+    <p class="paragraph">
+      Wir verwenden Ihre Daten nicht, um Rückschlüsse auf Ihre Person zu ziehen. Informationen dieser Art werden von uns
+      ggfs. statistisch ausgewertet, um unseren Internetauftritt und die dahinterstehende Technik zu optimieren.
+    </p>
+    <h3 class="heading--3">
+      Rechtsgrundlage
+    </h3>
+    <p class="paragraph">
+      Die Verarbeitung erfolgt gemäß Art. 6 Abs. 1 lit. f DSGVO auf Basis unseres berechtigten Interesses an der
+      Verbesserung der Stabilität und Funktionalität unserer Website.
+    </p>
+    <h3 class="heading--3">
+      Empfänger
+    </h3>
+    <p class="paragraph">
+      Empfänger der Daten sind ggf. technische Dienstleister, die für den Betrieb und die Wartung unserer Webseite als
+      Auftragsverarbeiter tätig werden.
+    </p>
+    <h3 class="heading--3">
+      Speicherdauer
+    </h3>
+    <p class="paragraph">
+      Die Daten werden gelöscht, sobald diese für den Zweck der Erhebung nicht mehr erforderlich sind. Dies ist für die
+      Daten, die der Bereitstellung der Webseite dienen, grundsätzlich der Fall, wenn die jeweilige Sitzung beendet ist.
+    </p>
+    <h3 class="heading--3">
+      Bereitstellung vorgeschrieben oder erforderlich
+    </h3>
+    <p class="paragraph">
+      Die Bereitstellung der vorgenannten personenbezogenen Daten ist weder gesetzlich noch vertraglich vorgeschrieben.
+      Ohne die IP-Adresse ist jedoch der Dienst und die Funktionsfähigkeit unserer Website nicht gewährleistet. Zudem
+      können einzelne Dienste und Services nicht verfügbar oder eingeschränkt sein. Aus diesem Grund ist ein Widerspruch
+      ausgeschlossen.
+    </p>
+    <h2 class="heading--2">
+      Verwendung von Scriptbibliotheken (Google Webfonts)
+    </h2>
+    <h3 class="heading--3">
+      Art und Zweck der Verarbeitung
+    </h3>
+    <p class="paragraph">
+      Um unsere Inhalte browserübergreifend korrekt und grafisch ansprechend darzustellen, verwenden wir auf dieser
+      Website „Google Web Fonts“ der Google LLC (1600 Amphitheatre Parkway, Mountain View, CA 94043, USA; nachfolgend
+      „Google“) zur Darstellung von Schriften.
+    </p>
+    <p class="paragraph">
+      Die Datenschutzrichtlinie des Bibliothekbetreibers Google finden Sie hier:
+      <ExternalLink href="https://www.google.com/policies/privacy/"/>
+    </p>
+    <h3 class="heading--3">
+      Rechtsgrundlage
+    </h3>
+    <p class="paragraph">
+      Rechtsgrundlage für die Einbindung von Google Webfonts und dem damit verbundenen Datentransfer zu Google ist Ihre
+      Einwilligung (Art. 6 Abs. 1 lit. a DSGVO).
+    </p>
+    <h3 class="heading--3">
+      Empfänger
+    </h3>
+    <p class="paragraph">
+      Der Aufruf von Scriptbibliotheken oder Schriftbibliotheken löst automatisch eine Verbindung zum Betreiber der
+      Bibliothek aus. Dabei ist es theoretisch möglich – aktuell allerdings auch unklar ob und ggf. zu welchen Zwecken
+      – dass der Betreiber in diesem Fall Google Daten erhebt.
+    </p>
+    <h3 class="heading--3">
+      Speicherdauer
+    </h3>
+    <p class="paragraph">
+      Wir erheben keine personenbezogenen Daten, durch die Einbindung von Google Webfonts.
+    </p>
+    <p class="paragraph">
+      Weitere Informationen zu Google Web Fonts finden Sie unter
+      <ExternalLink href="https://developers.google.com/fonts/faq"/> und in der Datenschutzerklärung von Google:
+      <ExternalLink href="https://www.google.com/policies/privacy/"/>.
+    </p>
+    <h3 class="heading--3">
+      Drittlandtransfer
+    </h3>
+    <p class="paragraph">
+      Google verarbeitet Ihre Daten in den USA und hat sich dem EU_US Privacy Shield unterworfen
+      <ExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
+    </p>
+    <h3 class="heading--3">
+      Bereitstellung vorgeschrieben oder erforderlich
+    </h3>
+    <p class="paragraph">
+      Die Bereitstellung der personenbezogenen Daten ist weder gesetzlich, noch vertraglich vorgeschrieben. Allerdings
+      kann ggfs. die korrekte Darstellung der Inhalte durch Standardschriften nicht möglich sein.
+    </p>
+    <h3 class="heading--3">
+      Widerruf der Einwilligung
+    </h3>
+    <p class="paragraph">
+      Zur Darstellung der Inhalte wird regelmäßig die Programmiersprache JavaScript verwendet. Sie können der
+      Datenverarbeitung daher widersprechen, indem Sie die Ausführung von JavaScript in Ihrem Browser deaktivieren oder
+      einen JavaScript-Blocker installieren. Bitte beachten Sie, dass es hierdurch zu Funktionseinschränkungen auf der
+      Website kommen kann.
+    </p>
+    <h2 class="heading--2">
+      Eingebettete YouTube-Videos
+    </h2>
+    <h3 class="heading--3">
+      Art und Zweck der Verarbeitung
+    </h3>
+    <p class="paragraph">
+      Auf einigen unserer Webseiten betten wir YouTube-Videos ein. Betreiber der entsprechenden Plugins ist die YouTube,
+      LLC, 901 Cherry Ave., San Bruno, CA 94066, USA (nachfolgend „YouTube“). Wenn Sie eine Seite mit dem YouTube-Plugin
+      besuchen, wird eine Verbindung zu Servern von YouTube hergestellt. Dabei wird YouTube mitgeteilt, welche Seiten
+      Sie besuchen. Wenn Sie in Ihrem YouTube-Account eingeloggt sind, kann YouTube Ihr Surfverhalten Ihnen persönlich
+      zuzuordnen. Dies verhindern Sie, indem Sie sich vorher aus Ihrem YouTube-Account ausloggen.
+    </p>
+    <p class="paragraph">
+      Wird ein YouTube-Video gestartet, setzt der Anbieter Cookies ein, die Hinweise über das Nutzerverhalten sammeln.
+    </p>
+    <p class="paragraph">
+      Weitere Informationen zu Zweck und Umfang der Datenerhebung und ihrer Verarbeitung durch YouTube erhalten Sie in
+      den Datenschutzerklärungen des Anbieters, Dort erhalten Sie auch weitere Informationen zu Ihren diesbezüglichen
+      Rechten und Einstellungsmöglichkeiten zum Schutze Ihrer Privatsphäre
+      (<ExternalLink href="https://policies.google.com/privacy"/>). Google verarbeitet Ihre Daten in den USA und hat
+      sich dem EU-US Privacy Shield unterworfen <ExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
+    </p>
+    <h3 class="heading--3">
+      Rechtsgrundlage
+    </h3>
+    <p class="paragraph">
+      Rechtsgrundlage für die Einbindung von YouTube und dem damit verbundenen Datentransfer zu Google ist Ihre
+      Einwilligung (Art. 6 Abs. 1 lit. a DSGVO).
+    </p>
+    <h3 class="heading--3">
+      Empfänger
+    </h3>
+    <p class="paragraph">
+      Der Aufruf von YouTube löst automatisch eine Verbindung zu Google aus.
+    </p>
+    <h3 class="heading--3">
+      Speicherdauer und Widerruf der Einwilligung:
+    </h3>
+    <p class="paragraph">
+      Wer das Speichern von Cookies für das Google-Ad-Programm deaktiviert hat, wird auch beim Anschauen von
+      YouTube-Videos mit keinen solchen Cookies rechnen müssen. YouTube legt aber auch in anderen Cookies
+      nicht-personenbezogene Nutzungsinformationen ab. Möchten Sie dies verhindern, so müssen Sie das Speichern von
+      Cookies im Browser blockieren.
+    </p>
+    <p class="paragraph">
+      Weitere Informationen zum Datenschutz bei „YouTube“ finden Sie in der Datenschutzerklärung des Anbieters unter:
+      <ExternalLink href="https://www.google.de/intl/de/policies/privacy/"/>
+    </p>
+    <h3 class="heading--3">
+      Drittlandtransfer
+    </h3>
+    <p class="paragraph">
+      Google verarbeitet Ihre Daten in den USA und hat sich dem EU_US Privacy Shield unterworfen
+      <ExternalLink href="https://www.privacyshield.gov/EU-US-Framework"/>.
+    </p>
+    <h3 class="heading--3">
+      Bereitstellung vorgeschrieben oder erforderlich
+    </h3>
+    <p class="paragraph">
+      Die Bereitstellung Ihrer personenbezogenen Daten erfolgt freiwillig, allein auf Basis Ihrer Einwilligung. Sofern
+      Sie den Zugriff unterbinden, kann es hierdurch zu Funktionseinschränkungen auf der Website kommen.
+    </p>
+    <h2 class="heading--2">
+      SSL-Verschlüsselung
+    </h2>
+    <p class="paragraph">
+      Um die Sicherheit Ihrer Daten bei der Übertragung zu schützen, verwenden wir dem aktuellen Stand der Technik
+      entsprechende Verschlüsselungsverfahren (z. B. SSL) über HTTPS.
+    </p>
+    <h2 class="heading--2">
+      Änderung unserer Datenschutzbestimmungen
+    </h2>
+    <p class="paragraph">
+      Wir behalten uns vor, diese Datenschutzerklärung anzupassen, damit sie stets den aktuellen rechtlichen
+      Anforderungen entspricht oder um Änderungen unserer Leistungen in der Datenschutzerklärung umzusetzen, z.B. bei
+      der Einführung neuer Services. Für Ihren erneuten Besuch gilt dann die neue Datenschutzerklärung.
+    </p>
+    <h2 class="heading--2">
+      Fragen an den Datenschutzbeauftragten
+    </h2>
+    <p class="paragraph">
+      Wenn Sie Fragen zum Datenschutz haben, schreiben Sie uns bitte eine E-Mail oder wenden Sie sich direkt an die für
+      den Datenschutz verantwortliche Person:
+    </p>
+    <p class="paragraph">
+      Moritz Ruth<br>
+      Zum Galgenberg 19<br>
+      66539 Neunkirchen<br>
+      Deutschland
+    </p>
+    <p class="paragraph">
+      <b>Telefon</b>: +49 176 46146329
+    </p>
+    <p class="paragraph">
+      <b>E-Mail</b>: <a class="link" href="mailto:legal@moritz-ruth.de">legal@moritz-ruth.de</a>
+    </p>
+    <p class="paragraph">
+      Die Datenschutzerklärung wurde mithilfe der activeMind AG erstellt, den Experten für
+      <ExternalLink
+        href="https://www.activemind.de/datenschutz/datenschutzhinweis-generator/"
+        label="externe Datenschutzbeauftragte"
+      /> (Version #2019-04-10).
+    </p>
+  </div>
+</template>
+
+<style scoped lang="scss">
+
+</style>
+
+<script>
+  import NavigationBar from "@/components/NavigationBar";
+  import ExternalLink from "@/components/ExternalLink";
+
+  export default {
+    name: "PrivacyPolicyPage",
+    components: { ExternalLink, NavigationBar }
+  };
+</script>