add datenschutzerklaerung

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

Dockerfile

@@ -1,4 +1,4 @@
 FROM nginx:alpine
-COPY index.html /usr/share/nginx/html/index.html
+COPY index.html impressum.html datenschutz.html legal.css /usr/share/nginx/html/
+COPY fonts /usr/share/nginx/html/fonts
 EXPOSE 80
-

datenschutz.html

@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+<meta charset="UTF-8"/>
+<meta name="viewport" content="width=device-width,initial-scale=1"/>
+<title>Datenschutz: noctura.dev</title>
+<meta name="theme-color" content="#2b2a80"/>
+<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%232b2a80'/%3E%3Cpath d='M2 14V7l4 3V7l4 3V3h4v11z' fill='%23ffc93c'/%3E%3C/svg%3E"/>
+<link rel="stylesheet" href="legal.css"/>
+</head>
+<body>
+<a class="skip" href="#inhalt">Zum Inhalt springen</a>
+<header class="wrap top">
+  <a class="logo" href="./">noctura.dev</a>
+</header>
+
+<main id="inhalt">
+  <div class="wrap">
+    <h1>Datenschutzerklärung</h1>
+
+    <h2>1. Verantwortlicher</h2>
+    <p>Verantwortlich für die Datenverarbeitung auf dieser Webseite im Sinne der DSGVO ist:</p>
+    <address>
+      Jayson Cleve<br/>
+      Zehntstr. 5<br/>
+      88356 Ostrach<br/>
+      Deutschland<br/>
+      E-Mail: <a href="mailto:Jaysonmatthew2005@gmail.com">Jaysonmatthew2005@gmail.com</a>
+    </address>
+
+    <h2>2. Überblick</h2>
+    <p>Diese Webseite ist eine private Vorstellungs- und Portfolioseite. Sie verwendet keine Cookies, kein Tracking und keine Analysedienste und bindet keine Inhalte von Drittanbietern ein. Die Schriftarten werden von diesem Server geladen. Das Mini-Puzzle läuft nur in deinem Browser und speichert oder überträgt keine Daten.</p>
+
+    <h2>3. Hosting und Server-Logfiles</h2>
+    <p>Diese Webseite wird bei der STRATO GmbH, Otto-Ostrowski-Straße 7, 10249 Berlin, auf einem Server innerhalb der Europäischen Union gehostet. Mit STRATO besteht ein Vertrag über Auftragsverarbeitung nach Art. 28 DSGVO. STRATO setzt für den Betrieb Unterauftragsverarbeiter ein, darunter die IONOS SE, Elgendorfer Straße 7, 56410 Montabaur.</p>
+    <p>Bei jedem Aufruf werden automatisch folgende Daten verarbeitet und in Logfiles gespeichert:</p>
+    <ul>
+      <li>IP-Adresse</li>
+      <li>Datum und Uhrzeit des Aufrufs</li>
+      <li>aufgerufene Datei oder Seite</li>
+      <li>Referrer-URL</li>
+      <li>Browsertyp und -version sowie Betriebssystem</li>
+      <li>übertragene Datenmenge</li>
+    </ul>
+    <p><strong>Zweck:</strong> Auslieferung der Webseite sowie Stabilität und Sicherheit des Betriebs, zum Beispiel die Abwehr von Angriffen.</p>
+    <p><strong>Rechtsgrundlage:</strong> Art. 6 Abs. 1 lit. f DSGVO. Mein berechtigtes Interesse liegt im technisch fehlerfreien und sicheren Betrieb der Webseite.</p>
+    <p><strong>Speicherdauer:</strong> Die Logfiles werden nach spätestens 4 Wochen gelöscht. Bei einem Sicherheitsvorfall können einzelne Daten im Einzelfall länger gespeichert werden, bis der Vorfall aufgeklärt ist.</p>
+
+    <h2>4. Kontakt per E-Mail</h2>
+    <p>Wenn du mir eine E-Mail schreibst, verarbeite ich deine E-Mail-Adresse, den Zeitpunkt und den Inhalt deiner Nachricht, um dir antworten zu können.</p>
+    <p><strong>Rechtsgrundlage:</strong> Art. 6 Abs. 1 lit. f DSGVO. Mein berechtigtes Interesse liegt in der Beantwortung deiner Anfrage.</p>
+    <p><strong>Empfänger:</strong> Für E-Mails nutze ich Gmail. Anbieter für Nutzer im Europäischen Wirtschaftsraum ist die Google Ireland Limited, Gordon House, Barrow Street, Dublin 4, Irland. Deine Nachricht wird dadurch bei Google verarbeitet. Eine Übermittlung in die USA ist dabei nicht ausgeschlossen. Sie stützt sich auf den Angemessenheitsbeschluss der EU-Kommission zum EU-US Data Privacy Framework, soweit das jeweilige Google-Unternehmen danach zertifiziert ist. Weitere Informationen findest du in der <a href="https://policies.google.com/privacy?hl=de">Datenschutzerklärung von Google</a>.</p>
+    <p><strong>Speicherdauer:</strong> Ich lösche deine Nachricht, sobald deine Anfrage abschließend bearbeitet ist und keine gesetzlichen Aufbewahrungspflichten entgegenstehen.</p>
+
+    <h2>5. Cookies und Speicherung auf deinem Gerät</h2>
+    <p>Diese Webseite setzt keine Cookies und speichert oder liest keine Informationen auf deinem Gerät, die über die technisch notwendige Auslieferung der Seite hinausgehen (§ 25 TDDDG). Deshalb gibt es auch keinen Cookie-Banner.</p>
+
+    <h2>6. Deine Rechte</h2>
+    <p>Du hast gegenüber mir folgende Rechte, soweit die gesetzlichen Voraussetzungen vorliegen:</p>
+    <ul>
+      <li>Auskunft über deine verarbeiteten Daten (Art. 15 DSGVO)</li>
+      <li>Berichtigung unrichtiger Daten (Art. 16 DSGVO)</li>
+      <li>Löschung (Art. 17 DSGVO)</li>
+      <li>Einschränkung der Verarbeitung (Art. 18 DSGVO)</li>
+      <li>Datenübertragbarkeit (Art. 20 DSGVO)</li>
+    </ul>
+    <p><strong>Widerspruchsrecht:</strong> Du kannst der Verarbeitung deiner Daten auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO aus Gründen, die sich aus deiner besonderen Situation ergeben, jederzeit widersprechen (Art. 21 DSGVO).</p>
+    <p>Für all das reicht eine E-Mail an die oben genannte Adresse.</p>
+    <p><strong>Beschwerderecht:</strong> Du kannst dich bei einer Datenschutz-Aufsichtsbehörde beschweren (Art. 77 DSGVO). Für mich zuständig ist:</p>
+    <address>
+      Der Landesbeauftragte für den Datenschutz und die Informationsfreiheit Baden-Württemberg<br/>
+      Heilbronner Straße 35<br/>
+      70191 Stuttgart<br/>
+      <a href="https://www.baden-wuerttemberg.datenschutz.de/">www.baden-wuerttemberg.datenschutz.de</a>
+    </address>
+
+    <h2>7. Sonstiges</h2>
+    <p>Du bist nicht verpflichtet, mir personenbezogene Daten bereitzustellen. Ohne die Logdaten aus Abschnitt 3 kann die Webseite allerdings nicht ausgeliefert werden, und ohne E-Mail-Adresse kann ich dir nicht antworten. Eine automatisierte Entscheidungsfindung einschließlich Profiling findet nicht statt.</p>
+
+    <p>Stand: November 2026</p>
+  </div>
+</main>
+
+<footer class="wrap">
+  <ul>
+    <li><a href="./">Startseite</a></li>
+    <li><a href="impressum.html">Impressum</a></li>
+  </ul>
+</footer>
+</body>
+</html>

impressum.html

@@ -0,0 +1,45 @@
+<!DOCTYPE html>
+<html lang="de">
+<head>
+<meta charset="UTF-8"/>
+<meta name="viewport" content="width=device-width,initial-scale=1"/>
+<title>Impressum: noctura.dev</title>
+<meta name="theme-color" content="#2b2a80"/>
+<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%232b2a80'/%3E%3Cpath d='M2 14V7l4 3V7l4 3V3h4v11z' fill='%23ffc93c'/%3E%3C/svg%3E"/>
+<link rel="stylesheet" href="legal.css"/>
+</head>
+<body>
+<a class="skip" href="#inhalt">Zum Inhalt springen</a>
+<header class="wrap top">
+  <a class="logo" href="./">noctura.dev</a>
+</header>
+
+<main id="inhalt">
+  <div class="wrap">
+    <h1>Impressum</h1>
+
+    <h2>Angaben gemäß § 5 DDG</h2>
+    <address>
+      Jayson Cleve<br/>
+      Zehntstr. 5<br/>
+      88356 Ostrach<br/>
+      Deutschland
+    </address>
+
+    <h2>Kontakt</h2>
+    <p>E-Mail: <a href="mailto:Jaysonmatthew2005@gmail.com">Jaysonmatthew2005@gmail.com</a></p>
+
+    <p>Dies ist eine private Webseite zur persönlichen Vorstellung und als Portfolio.</p>
+
+    <p>Stand: November 2026</p>
+  </div>
+</main>
+
+<footer class="wrap">
+  <ul>
+    <li><a href="./">Startseite</a></li>
+    <li><a href="datenschutz.html">Datenschutz</a></li>
+  </ul>
+</footer>
+</body>
+</html>

legal.css

@@ -0,0 +1,67 @@
+@font-face{
+  font-family:'Lilita One';
+  src:url('fonts/lilita-one.woff2') format('woff2');
+  font-display:swap;
+}
+@font-face{
+  font-family:'Nunito';
+  src:url('fonts/nunito.woff2') format('woff2');
+  font-weight:200 1000;
+  font-display:swap;
+}
+
+*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
+:root{
+  --ink:#1a1648;
+  --night:#2b2a80;
+  --lamp:#ffc93c;
+  --paper:#fffaf0;
+  --ff-display:'Lilita One',system-ui,sans-serif;
+  --ff-body:'Nunito',system-ui,sans-serif;
+  --gutter:clamp(1rem,4vw,3rem);
+}
+html{font-size:100%;-webkit-text-size-adjust:100%}
+body{
+  background:var(--night);
+  color:var(--paper);
+  font-family:var(--ff-body);
+  font-size:1.0625rem;
+  font-weight:600;
+  line-height:1.6;
+  overflow-x:clip;
+}
+::selection{background:var(--lamp);color:var(--ink)}
+a{color:inherit}
+:focus-visible{outline:3px solid var(--lamp);outline-offset:3px}
+main :focus-visible{outline-color:var(--ink)}
+.skip{
+  position:absolute;left:var(--gutter);top:-5rem;z-index:10;
+  padding:.6rem 1rem;background:var(--lamp);color:var(--ink);font-weight:800;
+}
+.skip:focus{top:.75rem}
+.wrap{max-width:48rem;margin-inline:auto;padding-inline:var(--gutter)}
+.top{padding-block:1.25rem}
+.logo{font-family:var(--ff-display);font-size:1.6rem;text-decoration:none;color:var(--lamp)}
+main{
+  position:relative;
+  margin-top:24px;
+  background:var(--paper);color:var(--ink);
+  padding-block:clamp(2.5rem,6vw,4rem);
+}
+main::before{
+  content:'';position:absolute;left:0;right:0;bottom:100%;height:24px;
+  background:linear-gradient(to top right,var(--paper) 50%,transparent 51%) 0 100%/48px 24px repeat-x;
+}
+h1,h2{font-family:var(--ff-display);font-weight:400;line-height:1.1;text-wrap:balance}
+h1{font-size:clamp(2.4rem,7vw,3.75rem)}
+h2{margin-top:2.25rem;font-size:1.5rem}
+h3{margin-top:1.25rem;font-size:1.0625rem;font-weight:800}
+p,ul{margin-top:.6rem}
+ul{padding-left:1.25rem}
+li{margin-top:.25rem}
+address{margin-top:.6rem;font-style:normal}
+main a{overflow-wrap:anywhere;text-underline-offset:.15em}
+footer{padding-block:1.5rem 2rem}
+footer ul{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem;margin:0;padding:0;list-style:none}
+footer li{margin:0}
+footer a{font-weight:800}