From 25ac21b852935f8c506c5370a2a6dab27198b991 Mon Sep 17 00:00:00 2001 From: Oliver Rieger Date: Mon, 31 Aug 2026 16:00:49 +0200 Subject: [PATCH] Unearned shields go dead, and the halo leaves the honours row MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Two bugs in one rule. The grey sat on the IMAGE while the breathing halo was an animation on the same image — and a filter in a keyframe outranks a static one, so the glow was painting the greyscale away. Worse, the selector that handed out that halo still read `img:not(.dark)` from when the class hung on the image; the class moved to the cell in the inscription pass, so every shield on the row was matching it, lit or not. The grey lives on the cell now, where nothing animates. And the halo is gone from the row entirely (Oliver): the glints do that job, and a permanent breathing glow under an occasional flash was two effects saying the same thing. The league panel's crest keeps its own. Co-Authored-By: Claude Fable 5 --- index.html | 19 +++++++++++-------- 1 file changed, 11 insertions(+), 8 deletions(-) diff --git a/index.html b/index.html index 4ee96a0..9f5f9c3 100644 --- a/index.html +++ b/index.html @@ -355,7 +355,8 @@ if (location.hostname !== 'splatter-tennis.wuwi.one' && !window.Capacitor?.isNat grid-template-areas: "crest league" "crest level" "bar bar" "xp xp" "career career"; } /* THE CREST STANDS BESIDE THE LEAGUE (2026-08-31, Oliver: on its own row it pushed the text down), so the two things that say WHERE YOU ARE share a line instead of stacking. */ - #cdBadge { grid-area: crest; width: 56px; image-rendering: pixelated; align-self: center; } + #cdBadge { grid-area: crest; width: 56px; image-rendering: pixelated; align-self: center; + filter: drop-shadow(0 2px 4px rgba(0,0,0,0.5)); } #cdLeague { grid-area: league; align-self: end; font: 700 10px/1.5 Silkscreen, monospace; text-decoration: none; letter-spacing: 1.5px; } #cdLeague i { display: block; font-style: normal; font-size: 9px; opacity: 0.85; } @@ -387,13 +388,15 @@ if (location.hostname !== 'splatter-tennis.wuwi.one' && !window.Capacitor?.isNat #cdBadges img { height: 46px; image-rendering: pixelated; } #cdBadges .badge u { font: 700 7px Silkscreen, monospace; color: var(--acid); letter-spacing: 0.5px; text-decoration: none; white-space: nowrap; } - #cdBadges .badge.dark img { filter: grayscale(1) brightness(0.3); } + /* AN UNEARNED SLOT IS DEAD (2026-08-31): the grey sits on the CELL, not the image, so nothing + can animate over it — the breathing halo used to, because `filter` in a keyframe outranks a + static one, and a stale `img:not(.dark)` selector (from when the class hung on the image) was + handing that halo to every shield on the row, lit or not. That is why the dark slots glowed + in colour instead of standing grey and still. */ + #cdBadges .badge.dark { filter: grayscale(1) brightness(0.38); } #cdBadges .badge.dark u { color: #3f4d45; } - #cdBadges img.dark { filter: grayscale(1) brightness(0.3); } - /* earned badges BREATHE — a subtle gold halo, CSS-only (the menu parks the game loop, CSS - animations do not care). The dark slots stay dead, which is the point of them. */ - #cdBadges .badge:not(.dark) img, #cdBadges img:not(.dark), #cdBadge { - animation: badgeGlow 2.6s ease-in-out infinite; } + /* ...and the halo itself is GONE from this row (Oliver): the glints do that job now, and a + permanent breathing glow under an occasional flash was two effects saying the same thing. */ @keyframes badgeGlow { 0%, 100% { filter: drop-shadow(0 0 2px rgba(232, 178, 58, 0.25)); } 50% { filter: drop-shadow(0 0 7px rgba(232, 178, 58, 0.75)); } } @@ -1077,6 +1080,6 @@ if (location.hostname !== 'splatter-tennis.wuwi.one' && !window.Capacitor?.isNat - +