65 lines
1.6 KiB
HTML
65 lines
1.6 KiB
HTML
<!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>
|