<!DOCTYPE html> <html lang="{{ language }}"> <head> <meta charset="utf-8" /> <link rel="stylesheet" href="https://unpkg.com/98.css" /> <style> body { background: #008080; position: relative; overflow: hidden; } .window { width: 300px; transform: scale(2.75); transform-origin: 0 0; position: absolute; } #window { display: none; } </style> </head> <body> <div class="window" id="window"> <div class="title-bar"> <div class="title-bar-text">You're invited!</div> <div class="title-bar-controls"> <button aria-label="Minimize"></button> <button aria-label="Maximize"></button> <button aria-label="Close"></button> </div> </div> <div class="window-body"> <h4>MiOM 2-Year Anniversary</h4> <p>π 24.06. @ 19:30</p> <p>π§βπ€βπ§ Friends invite friends</p> <p>ποΈ Beachparty without beach</p> <p>πΎ Bottle party (BYOD)</p> <p>π Wilhelm-Mauser-StraΓe 47 Halle 5</p> <a href="https://miom.space">https://miom.space/</a> </div> <script> const w = document.getElementById('window'); document.addEventListener('mousemove', (ev) => { if (!ev.shiftKey) { return; } const newW = w.cloneNode(true); newW.id = ''; newW.style.top = `${ev.clientY}px`; newW.style.left = `${ev.clientX}px`; document.body.appendChild(newW); }); </script> </div> </body> </html>