diff --git a/public/css/events.css b/public/css/events.css index 3e50f2d..0590952 100644 --- a/public/css/events.css +++ b/public/css/events.css @@ -406,6 +406,32 @@ white-space: nowrap; } +/* ── Holz-Spenden Stempel ── */ +.wood-btn-wrap { + position: relative; + width: 100%; +} + +.wood-stamp { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%) rotate(-20deg); + padding: 5px 10px; + border: 3px solid #c8400a; + border-radius: 5px; + color: #e85010; + background: rgba(0, 0, 0, 0.5); + font-family: "Cinzel", serif; + font-size: 13px; + font-weight: bold; + letter-spacing: 1px; + white-space: nowrap; + pointer-events: none; + box-shadow: 0 0 8px rgba(200, 64, 10, 0.5); + text-shadow: 0 0 6px rgba(200, 64, 10, 0.6); +} + .event-done-overlay { position: absolute; inset: 0; diff --git a/public/js/quickmenu/events.js b/public/js/quickmenu/events.js index dc96ffb..8e6edf9 100644 --- a/public/js/quickmenu/events.js +++ b/public/js/quickmenu/events.js @@ -114,16 +114,18 @@ export async function loadEvents() {
- Holz Spenden +
+ Holz Spenden +
Bitte Spenden
+
100 Holz spenden
-
- ${Array.from({length: 5}, (_, i) => ` -
-
- ? -
-
`).join("")} +
+
+
+ ? +
+
@@ -415,16 +417,16 @@ export async function loadEvents() { isWoodSpinning = false; woodRevealed = false; - for (let i = 0; i < 5; i++) { - const inner = body.querySelector(`#wood-slot-${i} .booster-slot-inner`); - inner.innerHTML = `?`; - body.querySelector(`#wood-slot-${i}`).classList.remove("revealed", "spinning"); - } + const inner = body.querySelector(`#wood-slot-0 .booster-slot-inner`); + inner.innerHTML = `?`; + body.querySelector(`#wood-slot-0`).classList.remove("revealed", "spinning"); - const btn = body.querySelector("#wood-btn"); + const btn = body.querySelector("#wood-btn"); + const stamp = body.querySelector("#wood-stamp"); btn.classList.remove("used"); btn.style.opacity = "1"; btn.style.cursor = "pointer"; + if (stamp) stamp.style.display = ""; body.querySelector("#wood-hint").textContent = "100 Holz spenden"; preloadRarity3(); } @@ -466,10 +468,12 @@ export async function loadEvents() { isWoodSpinning = true; - const btn = body.querySelector("#wood-btn"); + const btn = body.querySelector("#wood-btn"); + const stamp = body.querySelector("#wood-stamp"); btn.classList.add("used"); - btn.style.opacity = "0.35"; - btn.style.cursor = "default"; + btn.style.opacity = "0.35"; + btn.style.cursor = "default"; + if (stamp) stamp.style.display = "none"; body.querySelector("#wood-hint").textContent = "Wird verarbeitet..."; const backBtn = body.querySelector("#wood-back-btn"); @@ -498,12 +502,12 @@ export async function loadEvents() { return; } - // Alle 5 Slots starten - for (let i = 0; i < 5; i++) startWoodSlot(i); + // Nur Slot 0 starten + startWoodSlot(0); - // Nach 5 Sekunden alle gleichzeitig enthüllen (dieselbe Karte) + // Nach 5 Sekunden enthüllen setTimeout(() => { - for (let i = 0; i < 5; i++) revealWoodSlot(i, drawnCard); + revealWoodSlot(0, drawnCard); body.querySelector("#wood-hint").textContent = "Karte erhalten! ✓"; isWoodSpinning = false;