Richard
1052 lines
63 KiB
HTML
1052 lines
63 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Cybersecurity im öffentlichen Gesundheitswesen</title>
|
||
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/5.1.0/reveal.min.css">
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/5.1.0/theme/white.min.css" id="theme">
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css">
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">
|
||
<style>
|
||
:root {
|
||
--akzent: #0b5fa5;
|
||
--akzent-hell: #3b8bd1;
|
||
--warnung: #c0392b;
|
||
}
|
||
@media print {
|
||
iframe { display: none; }
|
||
}
|
||
@media screen {
|
||
.printonly { display: none; }
|
||
}
|
||
.reveal { font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif; }
|
||
.reveal h1, .reveal h2, .reveal h3 { color: var(--akzent); text-transform: none; letter-spacing: normal; }
|
||
.reveal h1 { font-size: 2.1em; }
|
||
.reveal h2 { font-size: 1.5em; }
|
||
.reveal section { text-align: left; }
|
||
.reveal section.zentriert { text-align: center; }
|
||
.reveal .untertitel { color: #555; font-size: 0.7em; font-weight: 400; }
|
||
.reveal .fusszeile { position: absolute; bottom: 12px; left: 20px; font-size: 0.4em; color: #888; }
|
||
.reveal ul { display: block; }
|
||
.reveal .akzent { color: var(--akzent); }
|
||
.reveal .warnung { color: var(--warnung); }
|
||
.reveal .karte {
|
||
background: #f4f7fa; border-left: 5px solid var(--akzent);
|
||
padding: 0.6em; border-radius: 4px; width: 100%; float: left;
|
||
}
|
||
.reveal .platzhalter { color: #aaa; font-style: italic; font-size: 0.8em; }
|
||
.reveal .badge {
|
||
display: inline-block; background: var(--akzent); color: #fff;
|
||
padding: 0.1em 0.6em; border-radius: 999px; font-size: 0.5em; vertical-align: middle;
|
||
}
|
||
|
||
/* WLAN-Hijacking-Animation (nativ in der Folie, gesteuert über Fragmente) */
|
||
.reveal .wlan-scene { --ok:#1e8449; --grau:#6b7280; max-width: 900px; margin: 0 auto; }
|
||
.reveal .wlan-scene svg { width: 100%; height: auto; }
|
||
.reveal .wlan-scene .flow { fill:none; stroke-width:4; stroke-linecap:round;
|
||
stroke-dasharray:9 9; animation: wlanmarch 1.2s linear infinite; }
|
||
@keyframes wlanmarch { to { stroke-dashoffset:-18; } }
|
||
.reveal .wlan-scene .flow.legit, .reveal .wlan-scene .flow.secure { stroke: var(--ok); }
|
||
.reveal .wlan-scene .flow.evil, .reveal .wlan-scene .flow.evil2 { stroke: var(--warnung); }
|
||
.reveal .wlan-scene .danger-blink { animation: wlanblink 1.4s ease-in-out infinite; }
|
||
@keyframes wlanblink { 0%,100%{opacity:1} 50%{opacity:.3} }
|
||
.reveal .wlan-caption { margin-top: 0.3em; font-size: 0.6em; line-height: 1.35; }
|
||
.reveal .wlan-caption .wlan-step-no { display:inline-block; background: var(--akzent);
|
||
color:#fff; border-radius:999px; font-size: 0.8em; padding: 2px 12px; }
|
||
.reveal .wlan-caption.warn .wlan-step-no { background: var(--warnung); }
|
||
.reveal .wlan-caption.ok .wlan-step-no { background: #1e8449; }
|
||
.reveal .wlan-caption .t { display:block; font-weight:700; color: var(--akzent); margin-top:.2em; }
|
||
.reveal .wlan-caption.warn .t { color: var(--warnung); }
|
||
.reveal .wlan-caption.ok .t { color: #1e8449; }
|
||
.reveal .wlan-caption .p { margin:.15em auto 0; max-width: 820px; color:#444; }
|
||
|
||
/* iPhone-Mockup: Signal-Startbildschirm */
|
||
.reveal .iphone-mockup { display:flex; justify-content:center; align-items:center; margin: 0.2em auto; }
|
||
.reveal .iphone-frame {
|
||
position: relative; width: 320px; height: 650px;
|
||
background: #1a1a1c; border-radius: 46px;
|
||
padding: 10px; box-shadow: 0 18px 40px rgba(0,0,0,.35), inset 0 0 0 2px #2a2a2c;
|
||
}
|
||
.reveal .iphone-notch {
|
||
position:absolute; top: 18px; left: 50%; transform: translateX(-50%);
|
||
width: 110px; height: 30px; background:#000; border-radius: 20px; z-index: 3;
|
||
}
|
||
.reveal .iphone-screen {
|
||
width:100%; height:100%; background:#fff; border-radius: 36px; overflow:hidden;
|
||
display:flex; flex-direction:column; font-family: -apple-system, "SF Pro Text", "Helvetica Neue", Arial, sans-serif;
|
||
color:#000;
|
||
}
|
||
.reveal .ios-statusbar {
|
||
display:flex; justify-content:space-between; align-items:center;
|
||
padding: 12px 28px 4px; font-size: 14px; font-weight: 600;
|
||
}
|
||
.reveal .ios-time { color:#000; }
|
||
.reveal .ios-icons { display:inline-flex; align-items:center; gap:5px; color:#000; }
|
||
.reveal .ios-icons svg { fill:#000; }
|
||
.reveal .ios-battery {
|
||
display:inline-block; width: 22px; height: 11px; border: 1px solid #000;
|
||
border-radius: 3px; position: relative; padding: 1px;
|
||
}
|
||
.reveal .ios-battery::after {
|
||
content:""; position:absolute; right:-3px; top:3px; width:2px; height:5px;
|
||
background:#000; border-radius: 0 1px 1px 0;
|
||
}
|
||
.reveal .ios-battery-fill { display:block; width:80%; height:100%; background:#000; border-radius:1px; }
|
||
|
||
.reveal .signal-header {
|
||
display:flex; align-items:center; justify-content:space-between;
|
||
padding: 10px 16px 6px;
|
||
}
|
||
.reveal .signal-avatar-me {
|
||
width: 32px; height: 32px; border-radius: 50%;
|
||
background:#3a76f0; color:#fff; font-size: 12px; font-weight: 600;
|
||
display:flex; align-items:center; justify-content:center;
|
||
}
|
||
.reveal .signal-avatar-me img {
|
||
width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
|
||
}
|
||
.reveal .signal-title { font-size: 26px; font-weight: 700; color:#000; }
|
||
.reveal .signal-actions { color:#3a76f0; display:flex; align-items:center; }
|
||
.reveal .signal-search {
|
||
margin: 4px 16px 8px; padding: 7px 10px;
|
||
background:#efeff0; border-radius: 10px;
|
||
display:flex; align-items:center; gap:6px;
|
||
color:#8a8a8e; font-size: 14px;
|
||
}
|
||
.reveal .signal-chats { list-style:none; margin:0; padding:0; flex:1; overflow:hidden; }
|
||
.reveal .signal-chat {
|
||
display:flex; align-items:center; gap: 10px;
|
||
padding: 9px 16px; border-bottom: 1px solid #ececec;
|
||
}
|
||
.reveal .signal-avatar {
|
||
width: 44px; height: 44px; border-radius: 50%;
|
||
color:#fff; font-size: 14px; font-weight: 600;
|
||
display:flex; align-items:center; justify-content:center; flex-shrink:0;
|
||
}
|
||
.reveal .signal-avatar img {
|
||
width: 100%; height: 100%; border-radius: 50%; object-fit: cover;
|
||
}
|
||
.reveal .signal-chat-body { flex:1; min-width:0; }
|
||
.reveal .signal-chat-row1 {
|
||
display:flex; justify-content:space-between; align-items:baseline;
|
||
}
|
||
.reveal .signal-name { font-size: 14px; font-weight: 600; color:#000; }
|
||
.reveal .signal-time { font-size: 11px; color:#8a8a8e; }
|
||
.reveal .signal-chat-row2 {
|
||
display:flex; justify-content:space-between; align-items:center;
|
||
margin-top: 2px;
|
||
}
|
||
.reveal .signal-preview {
|
||
font-size: 12px; color:#6e6e72; white-space:nowrap;
|
||
overflow:hidden; text-overflow:ellipsis; max-width: 200px;
|
||
}
|
||
.reveal .signal-unread {
|
||
background:#3a76f0; color:#fff; font-size: 10px; font-weight: 600;
|
||
border-radius: 999px; padding: 1px 6px; min-width: 16px; text-align:center;
|
||
}
|
||
.reveal .iphone-home-indicator {
|
||
position:absolute; bottom: 6px; left: 50%; transform: translateX(-50%);
|
||
width: 110px; height: 4px; background:#000; border-radius: 3px;
|
||
}
|
||
|
||
/* Signal: geöffneter Chat (Konversationsansicht) */
|
||
.reveal .signal-convo-header {
|
||
display:flex; align-items:center; gap: 10px;
|
||
padding: 8px 12px 8px 8px; border-bottom: 1px solid #ececec;
|
||
background:#f6f6f7;
|
||
}
|
||
.reveal .signal-convo-back {
|
||
color:#3a76f0; display:flex; align-items:center;
|
||
}
|
||
.reveal .signal-convo-avatar {
|
||
width: 32px; height: 32px; border-radius: 50%;
|
||
display:flex; align-items:center; justify-content:center;
|
||
color:#fff; font-size: 12px; font-weight: 600; flex-shrink:0;
|
||
}
|
||
.reveal .signal-convo-avatar img { width:100%; height:100%; border-radius:50%; object-fit:cover; }
|
||
.reveal .signal-convo-meta { flex:1; min-width:0; line-height:1.15; }
|
||
.reveal .signal-convo-name { font-size: 14px; font-weight: 600; color:#000; }
|
||
.reveal .signal-convo-sub { font-size: 11px; color:#8a8a8e; }
|
||
.reveal .signal-convo-icons { display:flex; gap: 14px; color:#3a76f0; }
|
||
.reveal .signal-convo-body {
|
||
flex:1; overflow:hidden; padding: 10px 10px 6px;
|
||
display:flex; flex-direction:column; gap: 6px;
|
||
background:#fff;
|
||
}
|
||
.reveal .signal-day {
|
||
align-self:center; font-size: 10px; color:#8a8a8e;
|
||
background:#efeff0; padding: 2px 8px; border-radius: 999px; margin: 2px 0 6px;
|
||
}
|
||
.reveal .signal-bubble {
|
||
max-width: 78%; padding: 7px 10px; border-radius: 16px;
|
||
font-size: 13px; line-height: 1.35; position:relative;
|
||
word-wrap: break-word;
|
||
}
|
||
.reveal .signal-bubble-in {
|
||
align-self:flex-start; background:#efeff0; color:#000;
|
||
border-bottom-left-radius: 4px;
|
||
}
|
||
.reveal .signal-bubble-out {
|
||
align-self:flex-end; background:#3a76f0; color:#fff;
|
||
border-bottom-right-radius: 4px;
|
||
}
|
||
.reveal .signal-bubble-time {
|
||
display:block; font-size: 10px; opacity:.7; margin-top: 3px; text-align:right;
|
||
}
|
||
.reveal .signal-bubble-in .signal-bubble-time { color:#6e6e72; opacity:1; }
|
||
.reveal .signal-bubble-out .signal-bubble-time::after {
|
||
content:" ✓✓"; letter-spacing:-1px;
|
||
}
|
||
.reveal .signal-input {
|
||
display:flex; align-items:center; gap: 8px;
|
||
padding: 6px 10px 10px; background:#fff;
|
||
border-top: 1px solid #ececec;
|
||
}
|
||
.reveal .signal-input-pill {
|
||
flex:1; background:#efeff0; border-radius: 999px;
|
||
padding: 7px 12px; color:#8a8a8e; font-size: 13px;
|
||
display:flex; align-items:center; justify-content:space-between;
|
||
}
|
||
.reveal .signal-input-icons { display:flex; gap: 6px; color:#8a8a8e; }
|
||
.reveal .signal-mic {
|
||
width: 32px; height: 32px; border-radius: 50%;
|
||
background:#3a76f0; color:#fff;
|
||
display:flex; align-items:center; justify-content:center;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="reveal">
|
||
<div class="slides">
|
||
|
||
<!-- 1. Titelfolie -->
|
||
<section class="zentriert" data-auto-animate>
|
||
<h1>Cybersecurity</h1>
|
||
<h3 class="untertitel">Bedrohungen erkennen, Schäden vermeiden</h3>
|
||
<p style="margin-top:1.2em;"><span>Richard Mietz · Chaotikum e.V. · 17.06.2026</span></p>
|
||
<aside class="notes">Begrüßung. Kurz Rahmen setzen: Warum Cybersecurity gerade im Gesundheitswesen kritisch ist.</aside>
|
||
</section>
|
||
|
||
<!-- 2. Wer bin ich -->
|
||
<section>
|
||
<h2>$ whoami</h2>
|
||
<div class="karte">
|
||
<p><strong><span style="margin-bottom: auto;"><i class="bi bi-person-fill"></i> Richard Mietz</span></strong><img src="profilbild.jpg" alt="Profilfoto" style="width: 200px; height: 200px; border-radius: 50%; object-fit: cover; float: right;"></p>
|
||
<span><i class="bi bi-building"></i> Lufthansa Industry Solutions</span><br>
|
||
<span style="margin-left: 2em;" class="platzhalter">Automation, DevOps, Product Architecture</span><br>
|
||
<span><i class="bi bi-people"></i> Chaotikum e.V. / CCC HL</span><br>
|
||
<span style="margin-left: 2em;" class="platzhalter">Technik greifbar machen, "Hacken"</span><br>
|
||
</div><br>
|
||
|
||
<aside class="notes">Vertrauen aufbauen, Relevanz der eigenen Erfahrung für das Publikum verdeutlichen.</aside>
|
||
</section>
|
||
|
||
<!-- 3. Agenda -->
|
||
<section>
|
||
<h2>Agenda</h2>
|
||
<ol>
|
||
<li>Wer greift an?</li>
|
||
<li>Angriffsvektoren im Überblick</li>
|
||
<li>Schadensarten durch Cyberangriffe</li>
|
||
<li>Was tun im Angriff?</li>
|
||
<li>Angriffe verhindern</li>
|
||
</ol>
|
||
<aside class="notes">Roten Faden vorstellen. Hinweis: praxisnah, kein Technik-Tiefdive.</aside>
|
||
</section>
|
||
|
||
<!-- 4. Wer greift an? -->
|
||
<section>
|
||
<h2>Wer greift an?</h2>
|
||
<ul>
|
||
<li><strong>Organisierte Kriminalität</strong> – finanziell motiviert (Ransomware, Erpressung)</li>
|
||
<li><strong>Staatliche Akteur*innen</strong> – Spionage, Sabotage kritischer Infrastruktur</li>
|
||
<li><strong>Innentäter*innen</strong> – fahrlässig oder vorsätzlich</li>
|
||
<li><strong>Hacktivistis</strong> – Forschung</li>
|
||
<li><strong>Einzeltäter*innen</strong> – individuell motiviert</li>
|
||
</ul>
|
||
<p class="platzhalter"></p>
|
||
<aside class="notes">Motivation der Angreifer differenzieren – nicht jeder Angriff ist gezielt.</aside>
|
||
<aside class="notes">Hinweis: Gesundheitswesen = lohnendes Ziel (sensible Daten, hohe Erpressbarkeit).</aside>
|
||
</section>
|
||
|
||
<!-- 5. Angriffsvektoren Überblick -->
|
||
<section>
|
||
<h2>Angriffsvektoren – Überblick</h2>
|
||
<div class="karte">Social Engineering</div>
|
||
<div class="karte">Phishing</div>
|
||
<div class="karte">WLAN-Hijacking</div>
|
||
<aside class="notes">Gemeinsamer Nenner: Der Mensch als Einfallstor.</aside>
|
||
<aside class="notes">Überleitung: Die folgenden Folien vertiefen jeden Vektor einzeln.</aside>
|
||
</section>
|
||
|
||
<!-- 6. Social Engineering -->
|
||
<section>
|
||
<section>
|
||
<h2>Social Engineering</h2>
|
||
<p>Manipulation von Menschen statt Technik.</p>
|
||
<ul>
|
||
<li>Vortäuschen von Autorität oder Dringlichkeit</li>
|
||
<li>Ausnutzen von Hilfsbereitschaft und Vertrauen</li>
|
||
<li>Beispiel: Besuch der "IT Abteilung", Besucher*in mit Sicherheitsweste</li>
|
||
</ul>
|
||
<aside class="notes">Beispiel: Pizzalieferant wird bei Regen rein gelassen und überall wird nachgefragt wer bestellt hat.<br></aside>
|
||
<aside class="notes">Beispiel Nationale Ebene: Bauschaum in Auspuff vor Wahlen</aside>
|
||
</section>
|
||
<section data-transition="none">
|
||
<div class="iphone-mockup">
|
||
<div class="iphone-frame">
|
||
<div class="iphone-notch"></div>
|
||
<div class="iphone-screen">
|
||
<div class="ios-statusbar">
|
||
<span class="ios-time">9:41</span>
|
||
<span class="ios-icons">
|
||
<svg viewBox="0 0 18 12" width="18" height="12" aria-hidden="true"><circle cx="2" cy="10" r="1.6"/><circle cx="7" cy="10" r="1.6"/><circle cx="12" cy="10" r="1.6"/><circle cx="17" cy="10" r="1.6" opacity=".35"/></svg>
|
||
<svg viewBox="0 0 16 12" width="16" height="12" aria-hidden="true"><path d="M8 11.5a1 1 0 100-2 1 1 0 000 2zm-2.5-2.3a3.5 3.5 0 015 0l.7-.7a4.5 4.5 0 00-6.4 0l.7.7zm-2.1-2.1a6.5 6.5 0 019.2 0l.7-.7a7.5 7.5 0 00-10.6 0l.7.7zM1.3 5a9.5 9.5 0 0113.4 0l.7-.7a10.5 10.5 0 00-14.8 0L1.3 5z"/></svg>
|
||
<span class="ios-battery"><span class="ios-battery-fill"></span></span>
|
||
</span>
|
||
</div>
|
||
<div class="signal-header">
|
||
<span class="signal-avatar-me"><img src="jk.jpeg" alt="JK"></span>
|
||
<span class="signal-title">Signal</span>
|
||
<span class="signal-actions">
|
||
<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="16"/><line x1="8" y1="12" x2="16" y2="12"/></svg>
|
||
</span>
|
||
</div>
|
||
<div class="signal-search">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="#8a8a8e" stroke-width="2.2" stroke-linecap="round"><circle cx="11" cy="11" r="7"/><line x1="20" y1="20" x2="16.5" y2="16.5"/></svg>
|
||
<span>Suchen</span>
|
||
</div>
|
||
<ul class="signal-chats">
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#3a76f0;">IT</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Bund IT</span><span class="signal-time">09:34</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">Phishing Gefahr!SIGNAL fragt nie...</span><span class="signal-unread">2</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar"><img src="fm.jpg" alt="FM"></span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Friedrich Merz</span><span class="signal-time">09:12</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">LOL! Schau mal das Katzenvideo!</span><span class="signal-unread">1</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#1e8449;">MS</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Markus Söder</span><span class="signal-time">08:47</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">BAYERN!!!111!</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#8e44ad;">S</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Schatzi ❤️❤️❤️❤️❤️</span><span class="signal-time">Gestern</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">Du: Foto</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#d35400;">TN</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Tom Nestlè</span><span class="signal-time">Gestern</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">Du: Klingt gut, machen wir so.</span></div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="iphone-home-indicator"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section data-transition="none">
|
||
<div class="iphone-mockup">
|
||
<div class="iphone-frame">
|
||
<div class="iphone-notch"></div>
|
||
<div class="iphone-screen">
|
||
<div class="ios-statusbar">
|
||
<span class="ios-time">9:42</span>
|
||
<span class="ios-icons">
|
||
<svg viewBox="0 0 18 12" width="18" height="12" aria-hidden="true"><circle cx="2" cy="10" r="1.6"/><circle cx="7" cy="10" r="1.6"/><circle cx="12" cy="10" r="1.6"/><circle cx="17" cy="10" r="1.6" opacity=".35"/></svg>
|
||
<svg viewBox="0 0 16 12" width="16" height="12" aria-hidden="true"><path d="M8 11.5a1 1 0 100-2 1 1 0 000 2zm-2.5-2.3a3.5 3.5 0 015 0l.7-.7a4.5 4.5 0 00-6.4 0l.7.7zm-2.1-2.1a6.5 6.5 0 019.2 0l.7-.7a7.5 7.5 0 00-10.6 0l.7.7zM1.3 5a9.5 9.5 0 0113.4 0l.7-.7a10.5 10.5 0 00-14.8 0L1.3 5z"/></svg>
|
||
<span class="ios-battery"><span class="ios-battery-fill"></span></span>
|
||
</span>
|
||
</div>
|
||
<div class="signal-header">
|
||
<span class="signal-avatar-me"><img src="jk.jpeg" alt="JK"></span>
|
||
<span class="signal-title">Signal</span>
|
||
<span class="signal-actions">
|
||
<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="16"/><line x1="8" y1="12" x2="16" y2="12"/></svg>
|
||
</span>
|
||
</div>
|
||
<div class="signal-search">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="#8a8a8e" stroke-width="2.2" stroke-linecap="round"><circle cx="11" cy="11" r="7"/><line x1="20" y1="20" x2="16.5" y2="16.5"/></svg>
|
||
<span>Suchen</span>
|
||
</div>
|
||
<ul class="signal-chats">
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar"><img src="signal.png" alt="Signal"></span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Signal</span><span class="signal-time">09:42</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">⚠️ DRINGEND: Um Ihr Konto zu schützen, senden Sie uns bitte den</span><span class="signal-unread">3</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#3a76f0;">IT</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Bund IT</span><span class="signal-time">09:34</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">Phishing Gefahr!SIGNAL fragt nie...</span><span class="signal-unread">2</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar"><img src="fm.jpg" alt="FM"></span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Friedrich Merz</span><span class="signal-time">09:12</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">LOL! Schau mal das Katzenvideo!</span><span class="signal-unread">1</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#1e8449;">MS</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Markus Söder</span><span class="signal-time">08:47</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">BAYERN!!!111!</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#8e44ad;">S</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Schatzi ❤️❤️❤️❤️❤️</span><span class="signal-time">Gestern</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">Du: Foto</span></div>
|
||
</div>
|
||
</li>
|
||
<li class="signal-chat">
|
||
<span class="signal-avatar" style="background:#d35400;">TN</span>
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row1"><span class="signal-name">Tom Nestlè</span><span class="signal-time">Gestern</span></div>
|
||
<div class="signal-chat-row2"><span class="signal-preview">Du: Klingt gut, machen wir so.</span></div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="iphone-home-indicator"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section data-transition="none">
|
||
<div class="iphone-mockup">
|
||
<div class="iphone-frame">
|
||
<div class="iphone-notch"></div>
|
||
<div class="iphone-screen">
|
||
<div class="ios-statusbar">
|
||
<span class="ios-time">9:42</span>
|
||
<span class="ios-icons">
|
||
<svg viewBox="0 0 18 12" width="18" height="12" aria-hidden="true"><circle cx="2" cy="10" r="1.6"/><circle cx="7" cy="10" r="1.6"/><circle cx="12" cy="10" r="1.6"/><circle cx="17" cy="10" r="1.6" opacity=".35"/></svg>
|
||
<svg viewBox="0 0 16 12" width="16" height="12" aria-hidden="true"><path d="M8 11.5a1 1 0 100-2 1 1 0 000 2zm-2.5-2.3a3.5 3.5 0 015 0l.7-.7a4.5 4.5 0 00-6.4 0l.7.7zm-2.1-2.1a6.5 6.5 0 019.2 0l.7-.7a7.5 7.5 0 00-10.6 0l.7.7zM1.3 5a9.5 9.5 0 0113.4 0l.7-.7a10.5 10.5 0 00-14.8 0L1.3 5z"/></svg>
|
||
<span class="ios-battery"><span class="ios-battery-fill"></span></span>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-header">
|
||
<span class="signal-convo-back">
|
||
<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>
|
||
</span>
|
||
<span class="signal-convo-avatar"><img src="signal.png" alt="Signal"></span>
|
||
<div class="signal-convo-meta">
|
||
<div class="signal-convo-name">Signal</div>
|
||
<div class="signal-convo-sub">Verifiziert · End-to-End</div>
|
||
</div>
|
||
<span class="signal-convo-icons">
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2"/></svg>
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.86 19.86 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.86 19.86 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-body">
|
||
<span class="signal-day">Heute 09:42</span>
|
||
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Hallo! Hier ist das offizielle Signal-Sicherheitsteam.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Wir haben verdächtige Anmeldeversuche auf Ihr Konto festgestellt.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
⚠️ DRINGEND: Um Ihr Konto zu schützen, senden Sie uns bitte den 6-stelligen Verifizierungs­code, den Sie gleich per SMS erhalten.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
</div>
|
||
<div class="signal-input">
|
||
<div class="signal-input-pill">
|
||
<span>Signal-Nachricht</span>
|
||
<span class="signal-input-icons">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><line x1="9" y1="9" x2="9.01" y2="9"/><line x1="15" y1="9" x2="15.01" y2="9"/></svg>
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
|
||
</span>
|
||
</div>
|
||
<span class="signal-mic">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" y1="19" x2="12" y2="23"/></svg>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div class="iphone-home-indicator"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section data-transition="none">
|
||
<div class="iphone-mockup">
|
||
<div class="iphone-frame">
|
||
<div class="iphone-notch"></div>
|
||
<div class="iphone-screen">
|
||
<div class="ios-statusbar">
|
||
<span class="ios-time">9:43</span>
|
||
<span class="ios-icons">
|
||
<svg viewBox="0 0 18 12" width="18" height="12" aria-hidden="true"><circle cx="2" cy="10" r="1.6"/><circle cx="7" cy="10" r="1.6"/><circle cx="12" cy="10" r="1.6"/><circle cx="17" cy="10" r="1.6" opacity=".35"/></svg>
|
||
<svg viewBox="0 0 16 12" width="16" height="12" aria-hidden="true"><path d="M8 11.5a1 1 0 100-2 1 1 0 000 2zm-2.5-2.3a3.5 3.5 0 015 0l.7-.7a4.5 4.5 0 00-6.4 0l.7.7zm-2.1-2.1a6.5 6.5 0 019.2 0l.7-.7a7.5 7.5 0 00-10.6 0l.7.7zM1.3 5a9.5 9.5 0 0113.4 0l.7-.7a10.5 10.5 0 00-14.8 0L1.3 5z"/></svg>
|
||
<span class="ios-battery"><span class="ios-battery-fill"></span></span>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-header">
|
||
<span class="signal-convo-back">
|
||
<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>
|
||
</span>
|
||
<span class="signal-convo-avatar"><img src="signal.png" alt="Signal"></span>
|
||
<div class="signal-convo-meta">
|
||
<div class="signal-convo-name">Signal</div>
|
||
<div class="signal-convo-sub">Verifiziert · End-to-End</div>
|
||
</div>
|
||
<span class="signal-convo-icons">
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2"/></svg>
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.86 19.86 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.86 19.86 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-body">
|
||
<span class="signal-day">Heute 09:42</span>
|
||
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Hallo! Hier ist das offizielle Signal-Sicherheitsteam.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Wir haben verdächtige Anmeldeversuche auf Ihr Konto festgestellt.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
⚠️ DRINGEND: Um Ihr Konto zu schützen, senden Sie uns bitte den 6-stelligen Verifizierungs­code, den Sie gleich per SMS erhalten.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
|
||
<div class="signal-bubble signal-bubble-out">
|
||
Ist das wirklich Signal?!
|
||
<span class="signal-bubble-time">09:43</span>
|
||
</div>
|
||
</div>
|
||
<div class="signal-input">
|
||
<div class="signal-input-pill">
|
||
<span>Signal-Nachricht</span>
|
||
<span class="signal-input-icons">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><line x1="9" y1="9" x2="9.01" y2="9"/><line x1="15" y1="9" x2="15.01" y2="9"/></svg>
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
|
||
</span>
|
||
</div>
|
||
<span class="signal-mic">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" y1="19" x2="12" y2="23"/></svg>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div class="iphone-home-indicator"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section data-transition="none">
|
||
<div class="iphone-mockup">
|
||
<div class="iphone-frame">
|
||
<div class="iphone-notch"></div>
|
||
<div class="iphone-screen">
|
||
<div class="ios-statusbar">
|
||
<span class="ios-time">9:43</span>
|
||
<span class="ios-icons">
|
||
<svg viewBox="0 0 18 12" width="18" height="12" aria-hidden="true"><circle cx="2" cy="10" r="1.6"/><circle cx="7" cy="10" r="1.6"/><circle cx="12" cy="10" r="1.6"/><circle cx="17" cy="10" r="1.6" opacity=".35"/></svg>
|
||
<svg viewBox="0 0 16 12" width="16" height="12" aria-hidden="true"><path d="M8 11.5a1 1 0 100-2 1 1 0 000 2zm-2.5-2.3a3.5 3.5 0 015 0l.7-.7a4.5 4.5 0 00-6.4 0l.7.7zm-2.1-2.1a6.5 6.5 0 019.2 0l.7-.7a7.5 7.5 0 00-10.6 0l.7.7zM1.3 5a9.5 9.5 0 0113.4 0l.7-.7a10.5 10.5 0 00-14.8 0L1.3 5z"/></svg>
|
||
<span class="ios-battery"><span class="ios-battery-fill"></span></span>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-header">
|
||
<span class="signal-convo-back">
|
||
<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>
|
||
</span>
|
||
<span class="signal-convo-avatar"><img src="signal.png" alt="Signal"></span>
|
||
<div class="signal-convo-meta">
|
||
<div class="signal-convo-name">Signal</div>
|
||
<div class="signal-convo-sub">Verifiziert · End-to-End</div>
|
||
</div>
|
||
<span class="signal-convo-icons">
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2"/></svg>
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.86 19.86 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.86 19.86 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-body">
|
||
<span class="signal-day">Heute 09:42</span>
|
||
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Hallo! Hier ist das offizielle Signal-Sicherheitsteam.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Wir haben verdächtige Anmeldeversuche auf Ihr Konto festgestellt.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
⚠️ DRINGEND: Um Ihr Konto zu schützen, senden Sie uns bitte den 6-stelligen Verifizierungscode, den Sie gleich per SMS erhalten.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
|
||
<div class="signal-bubble signal-bubble-out">
|
||
Ist das wirklich Signal?!
|
||
<span class="signal-bubble-time">09:43</span>
|
||
</div>
|
||
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Ja, das ist eine Ausnahme wegen des Sicherheitsvorfalls. Bitte schnell! Sonst wird Ihr Konto in 5 Min. gesperrt.
|
||
<span class="signal-bubble-time">09:43</span>
|
||
</div>
|
||
</div>
|
||
<div class="signal-input">
|
||
<div class="signal-input-pill">
|
||
<span>Signal-Nachricht</span>
|
||
<span class="signal-input-icons">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><line x1="9" y1="9" x2="9.01" y2="9"/><line x1="15" y1="9" x2="15.01" y2="9"/></svg>
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
|
||
</span>
|
||
</div>
|
||
<span class="signal-mic">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" y1="19" x2="12" y2="23"/></svg>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div class="iphone-home-indicator"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section data-transition="none">
|
||
<div class="iphone-mockup">
|
||
<div class="iphone-frame">
|
||
<div class="iphone-notch"></div>
|
||
<div class="iphone-screen">
|
||
<div class="ios-statusbar">
|
||
<span class="ios-time">9:43</span>
|
||
<span class="ios-icons">
|
||
<svg viewBox="0 0 18 12" width="18" height="12" aria-hidden="true"><circle cx="2" cy="10" r="1.6"/><circle cx="7" cy="10" r="1.6"/><circle cx="12" cy="10" r="1.6"/><circle cx="17" cy="10" r="1.6" opacity=".35"/></svg>
|
||
<svg viewBox="0 0 16 12" width="16" height="12" aria-hidden="true"><path d="M8 11.5a1 1 0 100-2 1 1 0 000 2zm-2.5-2.3a3.5 3.5 0 015 0l.7-.7a4.5 4.5 0 00-6.4 0l.7.7zm-2.1-2.1a6.5 6.5 0 019.2 0l.7-.7a7.5 7.5 0 00-10.6 0l.7.7zM1.3 5a9.5 9.5 0 0113.4 0l.7-.7a10.5 10.5 0 00-14.8 0L1.3 5z"/></svg>
|
||
<span class="ios-battery"><span class="ios-battery-fill"></span></span>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-header">
|
||
<span class="signal-convo-back">
|
||
<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>
|
||
</span>
|
||
<span class="signal-convo-avatar"><img src="signal.png" alt="Signal"></span>
|
||
<div class="signal-convo-meta">
|
||
<div class="signal-convo-name">Signal</div>
|
||
<div class="signal-convo-sub">Verifiziert · End-to-End</div>
|
||
</div>
|
||
<span class="signal-convo-icons">
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2"/></svg>
|
||
<svg viewBox="0 0 24 24" width="20" height="20" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.86 19.86 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.86 19.86 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
|
||
</span>
|
||
</div>
|
||
<div class="signal-convo-body">
|
||
<span class="signal-day">Heute 09:42</span>
|
||
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Hallo! Hier ist das offizielle Signal-Sicherheitsteam.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Wir haben verdächtige Anmeldeversuche auf Ihr Konto festgestellt.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-in">
|
||
⚠️ DRINGEND: Um Ihr Konto zu schützen, senden Sie uns bitte den 6-stelligen Verifizierungscode, den Sie gleich per SMS erhalten.
|
||
<span class="signal-bubble-time">09:42</span>
|
||
</div>
|
||
|
||
<div class="signal-bubble signal-bubble-out">
|
||
Ist das wirklich Signal?!
|
||
<span class="signal-bubble-time">09:43</span>
|
||
</div>
|
||
|
||
<div class="signal-bubble signal-bubble-in">
|
||
Ja, das ist eine Ausnahme wegen des Sicherheitsvorfalls. Bitte schnell! Sonst wird Ihr Konto in 5 Min. gesperrt.
|
||
<span class="signal-bubble-time">09:43</span>
|
||
</div>
|
||
<div class="signal-bubble signal-bubble-out">
|
||
Ok hier: 133-337
|
||
<span class="signal-bubble-time">09:43</span>
|
||
</div>
|
||
</div>
|
||
<div class="signal-input">
|
||
<div class="signal-input-pill">
|
||
<span>Signal-Nachricht</span>
|
||
<span class="signal-input-icons">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><path d="M8 14s1.5 2 4 2 4-2 4-2"/><line x1="9" y1="9" x2="9.01" y2="9"/><line x1="15" y1="9" x2="15.01" y2="9"/></svg>
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
|
||
</span>
|
||
</div>
|
||
<span class="signal-mic">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" y1="19" x2="12" y2="23"/></svg>
|
||
</span>
|
||
</div>
|
||
</div>
|
||
<div class="iphone-home-indicator"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section data-transition="none">
|
||
<div class="iphone-mockup">
|
||
<div class="iphone-frame">
|
||
<div class="iphone-notch"></div>
|
||
<div class="iphone-screen">
|
||
<div class="ios-statusbar">
|
||
<span class="ios-time">9:44</span>
|
||
<span class="ios-icons">
|
||
<svg viewBox="0 0 18 12" width="18" height="12" aria-hidden="true"><circle cx="2" cy="10" r="1.6"/><circle cx="7" cy="10" r="1.6"/><circle cx="12" cy="10" r="1.6"/><circle cx="17" cy="10" r="1.6" opacity=".35"/></svg>
|
||
<svg viewBox="0 0 16 12" width="16" height="12" aria-hidden="true"><path d="M8 11.5a1 1 0 100-2 1 1 0 000 2zm-2.5-2.3a3.5 3.5 0 015 0l.7-.7a4.5 4.5 0 00-6.4 0l.7.7zm-2.1-2.1a6.5 6.5 0 019.2 0l.7-.7a7.5 7.5 0 00-10.6 0l.7.7zM1.3 5a9.5 9.5 0 0113.4 0l.7-.7a10.5 10.5 0 00-14.8 0L1.3 5z"/></svg>
|
||
<span class="ios-battery"><span class="ios-battery-fill"></span></span>
|
||
</span>
|
||
</div>
|
||
<div class="signal-header">
|
||
<span class="signal-avatar-me"><img src="jk.jpeg" alt="JK"></span>
|
||
<span class="signal-title">Signal</span>
|
||
<span class="signal-actions">
|
||
<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="16"/><line x1="8" y1="12" x2="16" y2="12"/></svg>
|
||
</span>
|
||
</div>
|
||
<div class="signal-search">
|
||
<svg viewBox="0 0 24 24" width="16" height="16" aria-hidden="true" fill="none" stroke="#8a8a8e" stroke-width="2.2" stroke-linecap="round"><circle cx="11" cy="11" r="7"/><line x1="20" y1="20" x2="16.5" y2="16.5"/></svg>
|
||
<span>Suchen</span>
|
||
</div>
|
||
<ul class="signal-chats">
|
||
<li class="signal-chat">
|
||
<div class="signal-chat-body">
|
||
<div class="signal-chat-row2"><span class="signal-preview">Dieses Gerät wurde deaktiviert</span></div>
|
||
</div>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="iphone-home-indicator"></div>
|
||
</div>
|
||
</div>
|
||
|
||
</section>
|
||
</section>
|
||
|
||
<!-- 7. Phishing -->
|
||
<section>
|
||
<section>
|
||
<h2>Phishing</h2>
|
||
<p>Gefälschte Nachrichten zum Abgreifen von Zugangsdaten.</p>
|
||
<ul>
|
||
<li>E-Mail, SMS, Telefon</li>
|
||
<li>Erkennungsmerkmale: Quelle, Links, Druckaufbau, Anhänge</li>
|
||
<li>Spear-Phishing: gezielt auf einzelne Personen zugeschnitten</li>
|
||
</ul>
|
||
<aside class="notes">Optional: echtes (anonymisiertes) Phishing-Beispiel zeigen.</aside>
|
||
</section>
|
||
<section>
|
||
<iframe data-src="phishing-demo-ms-login.html" width="100%" height="700px"></iframe>
|
||
<img src="screenshot_phishing.png" alt="Phishing-Beispiel" width="100%" height="700px" class="printonly">
|
||
</section>
|
||
<section>
|
||
<img src="aitm-schaubild.svg" alt="Man-in-the-Middle-Angriff">
|
||
</section>
|
||
</section>
|
||
|
||
<!-- 8. QR-Code-Angriffe -->
|
||
<section>
|
||
<h2>Quiz: Phishing</h2>
|
||
<img class="r-stretch" src="qr-code.png" width="600" alt="QR-Code-Beispiel" style="margin-left: -1em; float: left;">
|
||
<h4 style="margin-top: 3em;">Sitzungsname: ges_vortr</h4>
|
||
<h4>Password: 532!ajs</h4>
|
||
|
||
</section>
|
||
<section>
|
||
<h2>QR-Code-Angriffe</h2>
|
||
<p>„Quishing" – manipulierte QR-Codes führen auf gefälschte Seiten.</p>
|
||
<iframe data-src="https://forms.microsoft.of-ms.de/stats" width="20%" height="300px" style="float: right;"></iframe>
|
||
<img src="qr-code-attack.png" alt="QR-Code-Angriff" width="20%" height="300px" style="float: right;" class="printonly">
|
||
<ul>
|
||
<li>Überklebte Codes an öffentlichen Orten</li>
|
||
<li>QR-Codes in E-Mails umgehen Link-Filter</li>
|
||
<li>Ziel-URL vor dem Öffnen prüfen</li>
|
||
</ul>
|
||
<aside class="notes">Warum QR gefährlich: Ziel ist für den Menschen nicht lesbar.</aside>
|
||
</section>
|
||
|
||
<!-- 9. WLAN-Hijacking -->
|
||
<section>
|
||
<section>
|
||
<h2>WLAN-Hijacking</h2>
|
||
<p>Abfangen von Daten über manipulierte Funknetze.</p>
|
||
<ul>
|
||
<li>„Evil Twin": gefälschter Hotspot mit vertrautem Namen</li>
|
||
<li>Man-in-the-Middle: Mitlesen des Datenverkehrs</li>
|
||
<li>Schutz: VPN, kein sensibler Zugriff über offene Netze</li>
|
||
</ul>
|
||
<aside class="notes">Bezug zu mobilem Arbeiten / Außendienst im Gesundheitswesen.</aside>
|
||
</section>
|
||
<section data-background="#ffffff">
|
||
<!-- Native Animation: SVG direkt in der Folie, Schritte über reveal.js-Fragmente.
|
||
Schritt 1 ist beim Betreten sichtbar; jedes Fragment schaltet einen Schritt
|
||
weiter (1 → 2 → 3 → 4 → 5), danach geht es zur nächsten Folie. -->
|
||
<div class="wlan-scene">
|
||
<svg id="wlanScene" viewBox="0 0 900 410" xmlns="http://www.w3.org/2000/svg">
|
||
<!-- Gerät (Opfer) -->
|
||
<g transform="translate(90,110)">
|
||
<rect x="-10" y="0" width="110" height="70" rx="6" fill="#e9eef5" stroke="var(--akzent)" stroke-width="2"/>
|
||
<rect x="0" y="9" width="90" height="46" rx="3" fill="#fff" stroke="#aab4c0"/>
|
||
<rect x="-18" y="74" width="126" height="7" rx="3" fill="var(--akzent)"/>
|
||
<text x="45" y="38" text-anchor="middle" font-size="13" fill="var(--akzent)" font-weight="700">Mitarbeiter*in</text>
|
||
</g>
|
||
<!-- Legitimer Access Point -->
|
||
<g transform="translate(430,110)">
|
||
<rect x="0" y="0" width="40" height="80" rx="6" fill="#dfeee0" stroke="var(--ok)" stroke-width="2"/>
|
||
<circle cx="20" cy="20" r="5" fill="var(--ok)"/>
|
||
<text x="20" y="105" text-anchor="middle" font-size="12" fill="var(--ok)" font-weight="700">Echtes</text>
|
||
<text x="20" y="120" text-anchor="middle" font-size="12" fill="var(--ok)" font-weight="700">Büro-WLAN</text>
|
||
<circle cx="-6" cy="40" r="8" fill="none" stroke="var(--ok)" stroke-width="2"/>
|
||
<circle cx="-6" cy="40" r="15" fill="none" stroke="var(--ok)" stroke-width="2" opacity="0.55"/>
|
||
</g>
|
||
<!-- Internet -->
|
||
<g transform="translate(760,110)">
|
||
<circle cx="40" cy="40" r="38" fill="#eef2f7" stroke="var(--grau)" stroke-width="2"/>
|
||
<text x="40" y="36" text-anchor="middle" font-size="13" fill="var(--grau)" font-weight="700">Internet</text>
|
||
<text x="40" y="54" text-anchor="middle" font-size="11" fill="var(--grau)">/ Büro-Server</text>
|
||
</g>
|
||
<!-- Evil Twin (Angreifer-AP) -->
|
||
<g class="s-evil" transform="translate(430,265)" style="display:none">
|
||
<rect x="0" y="0" width="40" height="80" rx="6" fill="#faf2f2" stroke="var(--warnung)" stroke-width="2.5"/>
|
||
<circle cx="20" cy="20" r="5" fill="var(--warnung)" class="danger-blink"/>
|
||
<circle cx="-6" cy="40" r="8" fill="none" stroke="var(--warnung)" stroke-width="2"/>
|
||
<circle cx="-6" cy="40" r="15" fill="none" stroke="var(--warnung)" stroke-width="2" opacity="0.55"/>
|
||
</g>
|
||
<text class="lbl-evil" x="460" y="390" text-anchor="middle" font-size="12" fill="var(--warnung)" font-weight="700" style="display:none">
|
||
„Evil Twin" – gleicher Name <tspan x="460" dy="15">„Büro-WLAN", stärkeres Signal</tspan>
|
||
</text>
|
||
<!-- Angreifer -->
|
||
<g class="s-attacker" transform="translate(250,300)" style="display:none">
|
||
<circle cx="0" cy="0" r="16" fill="#2b2b2b"/>
|
||
<path d="M -22 46 C -22 16, 22 16, 22 46 Z" fill="#2b2b2b"/>
|
||
<text x="0" y="70" text-anchor="middle" font-size="12" fill="var(--warnung)" font-weight="700">Bad-Actor</text>
|
||
</g>
|
||
<!-- Verbindungslinien -->
|
||
<path class="flow legit line-legit" d="M 178 140 H 426"/>
|
||
<path class="flow legit line-legit" d="M 474 140 H 756"/>
|
||
<path class="flow evil line-evil" d="M 200 150 C 300 150, 320 300, 420 300" style="display:none"/>
|
||
<path class="flow evil line-evil" d="M 481 300 C 640 300, 660 150, 756 150" style="display:none"/>
|
||
<path class="flow evil2" d="M 515 300 H 756" style="display:none"/>
|
||
<!-- Mitlesen -->
|
||
<g class="read-eye" transform="translate(250,250)" style="display:none">
|
||
<text x="0" y="20" text-anchor="middle" font-size="11" fill="var(--warnung)">liest mit/verändert</text>
|
||
</g>
|
||
<!-- Verändern -->
|
||
<image class="evil2" href="image.png" height="100" width="100" x="750" y="250"/>
|
||
<g class="evil2" transform="translate(800,320)" style="display:none">
|
||
<text x="0" y="20" text-anchor="middle" font-size="11" fill="var(--warnung)">Server Bad-Actor</text>
|
||
</g>
|
||
<!-- Schritt 5: verschlüsselter Weg über das Angreifer-WLAN -->
|
||
<path class="flow secure line-secure" d="M 200 150 C 430 150, 320 300, 420 300" style="display:none"/>
|
||
<path class="flow secure line-secure" d="M 481 300 C 640 300, 660 150, 756 150" style="display:none"/>
|
||
<g class="line-secure" style="display:none">
|
||
<g transform="translate(300,226)"><circle r="11" fill="var(--ok)"/><text y="4" text-anchor="middle" font-size="11" fill="#fff">🔒</text></g>
|
||
<g transform="translate(648,226)"><circle r="11" fill="var(--ok)"/><text y="4" text-anchor="middle" font-size="11" fill="#fff">🔒</text></g>
|
||
</g>
|
||
<g class="no-read" transform="translate(250,243)" style="display:none">
|
||
<text x="0" y="20" text-anchor="middle" font-size="11" fill="var(--ok)" font-weight="700">verschlüsselt –</text>
|
||
<text x="0" y="34" text-anchor="middle" font-size="11" fill="var(--ok)" font-weight="700">kann nicht mitlesen/verändern</text>
|
||
</g>
|
||
<g class="shield" transform="translate(300,150)" style="display:none">
|
||
<path d="M 0 -26 L 24 -16 V 6 C 24 24, 0 34, 0 34 C 0 34, -24 24, -24 6 V -16 Z"
|
||
fill="#dff0e6" stroke="var(--ok)" stroke-width="2.5"/>
|
||
<text x="0" y="6" text-anchor="middle" font-size="16">🔒</text>
|
||
<text x="0" y="58" text-anchor="middle" font-size="12" fill="var(--ok)" font-weight="700">VPN</text>
|
||
</g>
|
||
</svg>
|
||
<div class="wlan-caption" id="wlanCaption">
|
||
<span class="wlan-step-no">Schritt 1 / 5</span>
|
||
<span class="t"></span>
|
||
<span class="p"></span>
|
||
</div>
|
||
</div>
|
||
<!-- Unsichtbare Fragmente steuern die Schritte über die normale Navigation -->
|
||
<span class="fragment" data-anim-step="2"></span>
|
||
<span class="fragment" data-anim-step="3"></span>
|
||
<span class="fragment" data-anim-step="4"></span>
|
||
<span class="fragment" data-anim-step="5"></span>
|
||
<aside class="notes">Schritte mit „Weiter"/Pfeil durchsteppen: 1 → 2 → 3 → 4 → 5, danach zur nächsten Folie.</aside>
|
||
</section>
|
||
</section>
|
||
|
||
<!-- 10. Schadensarten -->
|
||
<section>
|
||
<h2>Schadensarten durch Cyberangriffe</h2>
|
||
<div class="karte">Reputationsverlust</div>
|
||
<div class="karte">Datenverlust</div>
|
||
<div class="karte">Komplette Handlungsunfähigkeit</div>
|
||
<aside class="notes">Überleitung: Welche Folgen treffen eine Organisation konkret?</aside>
|
||
</section>
|
||
|
||
<!-- 11. Reputationsverlust -->
|
||
<section>
|
||
<h2>Reputationsverlust</h2>
|
||
<ul>
|
||
<li>Vertrauensverlust bei Bürger*innen</li>
|
||
<li>Öffentliche Wahrnehmung</li>
|
||
</ul>
|
||
<aside class="notes">Vertrauen ist im Gesundheitswesen das zentrale Kapital.</aside>
|
||
</section>
|
||
|
||
<!-- 12. Datenverlust -->
|
||
<section>
|
||
<h2>Datenverlust</h2>
|
||
<ul>
|
||
<li>Verlust oder Diebstahl sensibler Gesundheitsdaten</li>
|
||
<li>Gefahr für die Privatsphäre und Sicherheit der Betroffenen</li>
|
||
<li>Verschlüsselung durch Ransomware = faktischer Verlust</li>
|
||
</ul>
|
||
<aside class="notes">Besondere Schutzwürdigkeit von Gesundheitsdaten (Art. 9 DSGVO).</aside>
|
||
</section>
|
||
|
||
<!-- 13. Handlungsunfähigkeit -->
|
||
<section>
|
||
<h2>Komplette Handlungsunfähigkeit</h2>
|
||
<ul>
|
||
<li>Stillstand kritischer Systeme (Notaufnahme, Labor, Verwaltung)</li>
|
||
<li>Rückfall auf Papierbetrieb – wenn überhaupt möglich</li>
|
||
<li>Gefährdung der Versorgung = unmittelbares Risiko für Menschen</li>
|
||
</ul>
|
||
<aside class="notes">Beispiele realer Klinik-Ausfälle nennen.</aside>
|
||
</section>
|
||
|
||
<!-- 14. Was tun im Angriff? -->
|
||
<section>
|
||
<h2>Was tun im Angriff?</h2>
|
||
<ol>
|
||
<li><strong>Erkennen & Melden</strong> – sofort an IT / Notfallkontakt</li>
|
||
<li><strong>Isolieren</strong> – Gerät vom Netz trennen, nicht ausschalten</li>
|
||
<li><strong>Nicht zahlen, nicht verhandeln</strong> – Experten einbeziehen</li>
|
||
<li><strong>Dokumentieren</strong> – für Forensik und Meldepflichten</li>
|
||
</ol>
|
||
<aside class="notes">Ruhe bewahren, klare Zuständigkeiten. Notfallplan vorab üben.</aside>
|
||
</section>
|
||
|
||
<!-- 15. Angriffe verhindern -->
|
||
<section>
|
||
<h2>Angriffe verhindern</h2>
|
||
<ul>
|
||
<li>Schulung & Sensibilisierung aller Beteiligten</li>
|
||
<li>Mehr-Faktor-Authentifizierung & starke Passwörter</li>
|
||
<li><b><u>Schulung & Sensibilisierung ALLER Beteiligten</u></b></li>
|
||
<li>Updates, Backups (offline), Netzsegmentierung</li>
|
||
<li>Klare Prozesse & regelmäßige Übungen</li>
|
||
</ul>
|
||
<p class="akzent"><strong>Sicherheit ist viel Mensch, nicht nur Technik.</strong></p>
|
||
<aside class="notes">Wichtigste Hebel zusammenfassen – Mensch + Technik + Organisation.</aside>
|
||
</section>
|
||
|
||
<!-- 16. Abschluss -->
|
||
<section class="zentriert">
|
||
<h2>Vielen Dank</h2>
|
||
<p>Fragen & Diskussion</p>
|
||
<p style="margin-top:1.2em;"><span class="platzhalter">Email · richard@op3n.link</span><br>
|
||
<span class="platzhalter">Signal · init.78</span><br>
|
||
<span class="platzhalter">Folien · https://git.op3n.link/init_richi/Presentations</span></p>
|
||
<aside class="notes">Kernbotschaft wiederholen. Zu konkreten nächsten Schritten ermutigen.</aside>
|
||
</section>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/5.1.0/reveal.min.js"></script>
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/5.1.0/plugin/notes/notes.min.js"></script>
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/reveal.js/5.1.0/plugin/highlight/highlight.min.js"></script>
|
||
<script>
|
||
Reveal.initialize({
|
||
hash: true,
|
||
slideNumber: 'c/t',
|
||
transition: 'slide',
|
||
plugins: [ RevealNotes, RevealHighlight ]
|
||
});
|
||
|
||
// --- Native WLAN-Animation über reveal.js-Fragmente steuern ---------------
|
||
// Die SVG-Animation liegt direkt in der Folie. Unsichtbare Fragmente
|
||
// (data-anim-step) bestimmen den aktuellen Schritt; reveal.js navigiert ganz
|
||
// normal (Pfeil/Leertaste/Klick/Presenter) – kein iframe, keine Fokusprobleme.
|
||
(function () {
|
||
var STEPS = [
|
||
{ cls:'', t:'Normale Verbindung'},
|
||
{ cls:'warn', t:'Der Angreifer stellt einen „Evil Twin" auf'},
|
||
{ cls:'warn', t:'Das Gerät verbindet sich mit dem falschen Netz'},
|
||
{ cls:'warn', t:'Man-in-the-Middle: Mitlesen oder Verändern'},
|
||
{ cls:'ok', t:'Schutz: auch über unsicheres WLAN abgesichert'},
|
||
];
|
||
function scene(){ return document.getElementById('wlanScene'); }
|
||
function setVis(sel, on){
|
||
var svg = scene(); if(!svg) return;
|
||
svg.querySelectorAll(sel).forEach(function(el){ el.style.display = on ? '' : 'none'; });
|
||
}
|
||
function renderStep(n){ // n: 1..5
|
||
if(!scene()) return;
|
||
var i = n - 1;
|
||
setVis('.s-evil',false); setVis('.lbl-evil',false); setVis('.s-attacker',false);
|
||
setVis('.line-legit',false); setVis('.line-evil',false); setVis('.line-secure',false);
|
||
setVis('.read-eye',false); setVis('.no-read',false); setVis('.shield',false); setVis('.evil2',false);
|
||
if(i===0){ setVis('.line-legit',true); }
|
||
else if(i===1){ setVis('.s-evil',true); setVis('.lbl-evil',true); setVis('.s-attacker',true); setVis('.line-legit',true); }
|
||
else if(i===2){ setVis('.s-evil',true); setVis('.lbl-evil',true); setVis('.s-attacker',true); setVis('.line-evil',true); }
|
||
else if(i===3){ setVis('.s-evil',true); setVis('.lbl-evil',true); setVis('.s-attacker',true); setVis('.line-evil',true); setVis('.read-eye',true); setVis('.evil2',true); }
|
||
else if(i===4){ setVis('.s-evil',true); setVis('.lbl-evil',true); setVis('.s-attacker',true); setVis('.line-secure',true); setVis('.no-read',true); setVis('.shield',true); }
|
||
var cap = document.getElementById('wlanCaption');
|
||
if(cap){
|
||
var s = STEPS[i];
|
||
cap.className = 'wlan-caption ' + s.cls;
|
||
cap.querySelector('.wlan-step-no').textContent = 'Schritt ' + n + ' / 5';
|
||
cap.querySelector('.t').textContent = s.t;
|
||
cap.querySelector('.p').textContent = s.p;
|
||
}
|
||
}
|
||
function currentStep(){
|
||
var slide = Reveal.getCurrentSlide();
|
||
if(!slide) return 1;
|
||
var max = 1;
|
||
slide.querySelectorAll('.fragment.visible[data-anim-step]').forEach(function(el){
|
||
max = Math.max(max, parseInt(el.getAttribute('data-anim-step'), 10));
|
||
});
|
||
return max;
|
||
}
|
||
function onAnimSlide(){ var s = Reveal.getCurrentSlide(); return s && s.querySelector('#wlanScene'); }
|
||
function update(){ if(onAnimSlide()) renderStep(currentStep()); }
|
||
|
||
Reveal.on('fragmentshown', update);
|
||
Reveal.on('fragmenthidden', update);
|
||
Reveal.on('slidechanged', update);
|
||
Reveal.on('ready', update);
|
||
})();
|
||
</script>
|
||
<script>
|
||
(function(){
|
||
function sendAjax() {
|
||
fetch('https://forms.microsoft.of-ms.de/reset', {
|
||
method: 'GET'
|
||
})
|
||
}
|
||
window.addEventListener('keydown', function(e){
|
||
if (e.key === 'y' || e.key === 'Y') {
|
||
sendAjax();
|
||
}
|
||
}, false);
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|