fix: trim ghost onepager per issue #8 feedback

Remove Dienstag-Doku line, Ohrwurm button, and Quäl-👻 ad line; add Pinguin-Knie sponsor footer.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
cursor
2026-07-08 07:05:03 +00:00
parent 36184b2721
commit 80529b54f8
+9 -98
View File
@@ -190,35 +190,6 @@
50% { transform: scale(1.35) translateY(-6px); }
}
.btn-earworm {
display: inline-flex;
align-items: center;
gap: 0.5rem;
margin-top: 1rem;
padding: 0.7rem 1.4rem;
border: none;
border-radius: 2rem;
font-weight: 700;
font-size: 0.95rem;
cursor: pointer;
background: linear-gradient(135deg, var(--purple), #6b21a8);
color: #fff;
box-shadow: 0 4px 24px rgba(179, 102, 255, 0.4);
transition: transform 0.15s;
}
.btn-earworm:hover { transform: scale(1.05); }
.btn-earworm:active { transform: scale(0.97); }
.btn-earworm.playing {
animation: btn-glow 0.55s ease-in-out infinite;
}
@keyframes btn-glow {
0%, 100% { box-shadow: 0 4px 24px rgba(179, 102, 255, 0.4); }
50% { box-shadow: 0 4px 36px rgba(200, 255, 0, 0.5); }
}
/* —— images —— */
.scene-grid {
display: grid;
@@ -334,6 +305,13 @@
footer a { color: var(--purple); }
footer .sponsor {
margin-top: 0.85rem;
color: var(--lime);
font-size: 0.9rem;
font-weight: 600;
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.01ms !important;
@@ -374,7 +352,7 @@
<h1 class="motto">Who let the ghost out?</h1>
<p class="sub-de">
Offizielle Doku zum Vorfall vom Dienstag. Der Quäl-👻 ist draußen.
Der Quäl-👻 ist draußen.
Niemand will zugeben, wer die Tür aufgemacht hat.
</p>
@@ -385,9 +363,6 @@
<div class="chorus-barks" aria-hidden="true">
<span>👻</span><span>👻</span><span>👻</span><span>👻</span>
</div>
<button type="button" class="btn-earworm" id="earworm-btn" aria-pressed="false">
▶ Ohrwurm starten
</button>
</div>
</header>
@@ -474,7 +449,6 @@
<div class="warning">
<strong>Warnung:</strong> Nach dem Besuch dieser Seite summst du
„Who let the ghost out?“ mindestens bis Freitag.
Der Quäl-👻 dankt für die kostenlose Werbung.
</div>
</section>
</main>
@@ -483,71 +457,8 @@
Erstellt von @cursor · Gitea Issue #8 ·
<a href="https://gitea.schwenk.online/froxxxy/playground/issues/8">froxxxy/playground</a>
· Inspiriert von einem bestimmten Hund-Hit aus dem Jahr 2000
<p class="sponsor">Diese Seite wurde gesponsert von Pinguin-Knie!</p>
</footer>
</div>
<script>
(function () {
var btn = document.getElementById('earworm-btn');
var running = false;
var timer = null;
var ctx = null;
function beep(freq, start, dur) {
if (!ctx) return;
var osc = ctx.createOscillator();
var gain = ctx.createGain();
osc.type = 'square';
osc.frequency.value = freq;
gain.gain.setValueAtTime(0.08, start);
gain.gain.exponentialRampToValueAtTime(0.001, start + dur);
osc.connect(gain);
gain.connect(ctx.destination);
osc.start(start);
osc.stop(start + dur);
}
function playLoop() {
if (!ctx) ctx = new (window.AudioContext || window.webkitAudioContext)();
var t = ctx.currentTime;
/* woof-woof rhythm: four quick hits */
[0, 0.14, 0.28, 0.42].forEach(function (off, i) {
beep(280 + i * 40, t + off, 0.1);
});
/* bass bump */
beep(110, t + 0.55, 0.2);
beep(165, t + 0.75, 0.15);
}
function tick() {
playLoop();
if ('speechSynthesis' in window) {
window.speechSynthesis.cancel();
var u = new SpeechSynthesisUtterance('Who let the ghost out?');
u.lang = 'en-US';
u.rate = 1.15;
u.pitch = 1.1;
window.speechSynthesis.speak(u);
}
}
btn.addEventListener('click', function () {
running = !running;
btn.setAttribute('aria-pressed', String(running));
if (running) {
btn.textContent = '⏸ Ohrwurm stoppen';
btn.classList.add('playing');
tick();
timer = setInterval(tick, 2800);
} else {
btn.textContent = '▶ Ohrwurm starten';
btn.classList.remove('playing');
clearInterval(timer);
timer = null;
if (window.speechSynthesis) window.speechSynthesis.cancel();
}
});
})();
</script>
</body>
</html>