This commit is contained in:
NotSoToothless
2026-06-14 22:58:26 -07:00
committed by GitHub
parent 7b22e70714
commit a70e7e0d74
2 changed files with 14 additions and 10 deletions
+4 -2
View File
@@ -769,8 +769,10 @@ class ReplayCanvas {
this._tkLoseFill.style.width = (100 - wPct).toFixed(1) + '%'; this._tkLoseFill.style.width = (100 - wPct).toFixed(1) + '%';
this._tkWinVal.textContent = w; this._tkWinVal.textContent = w;
this._tkLoseVal.textContent = l; this._tkLoseVal.textContent = l;
// Game over (loser bled out) → glow the winning side. // Game over (loser bled out) → glow the winning side (bar, number, and
this.ticketsBar.classList.toggle('rc-tk-finished', l <= 0); // the winning team panel). Class goes on the shared container so the CSS
// can reach both the bar and the side panel.
this.container.classList.toggle('rc-game-over', l <= 0);
} }
async _loadEntityIcons() { async _loadEntityIcons() {
+10 -8
View File
@@ -512,16 +512,18 @@
.rc-tk-fill { height: 100%; transition: width 0.1s linear; } .rc-tk-fill { height: 100%; transition: width 0.1s linear; }
.rc-tk-fill-win { background: #2a8f2a; } .rc-tk-fill-win { background: #2a8f2a; }
.rc-tk-fill-lose { background: #b22020; } .rc-tk-fill-lose { background: #b22020; }
/* Winner glow once the loser has bled out (game over) */ /* Game over (loser bled out): softly glow the winning side — bar,
.rc-tickets.rc-tk-finished .rc-tk-track { animation: rcTkGlow 1.2s ease-in-out infinite; } ticket number, and the winning team name in the side panel. */
.rc-tickets.rc-tk-finished .rc-tk-val-win { animation: rcTkTextGlow 1.2s ease-in-out infinite; } .rc-game-over .rc-tk-track { animation: rcTkGlow 1.4s ease-in-out infinite; }
.rc-game-over .rc-tk-val-win,
.rc-game-over .rc-panel-win .rc-panel-label { animation: rcTkTextGlow 1.4s ease-in-out infinite; }
@keyframes rcTkGlow { @keyframes rcTkGlow {
0%, 100% { box-shadow: 0 0 4px 0 rgba(92,223,92,0.5); } 0%, 100% { box-shadow: 0 0 2px 0 rgba(92,223,92,0.25); }
50% { box-shadow: 0 0 13px 3px rgba(92,223,92,0.95); } 50% { box-shadow: 0 0 7px 1px rgba(92,223,92,0.55); }
} }
@keyframes rcTkTextGlow { @keyframes rcTkTextGlow {
0%, 100% { text-shadow: 0 0 4px rgba(92,223,92,0.45); } 0%, 100% { text-shadow: 0 0 3px rgba(92,223,92,0.35); }
50% { text-shadow: 0 0 11px rgba(92,223,92,0.95); } 50% { text-shadow: 0 0 9px rgba(92,223,92,0.85); }
} }
.rc-controls { .rc-controls {
display: flex; display: flex;
@@ -747,7 +749,7 @@
<script src="/js/api-client.js?v=3"></script> <script src="/js/api-client.js?v=3"></script>
<script src="/js/vehicle-i18n.js"></script> <script src="/js/vehicle-i18n.js"></script>
<script src="/js/header-search.js?v=2"></script> <script src="/js/header-search.js?v=2"></script>
<script src="/js/replay-canvas.js?v=14"></script> <script src="/js/replay-canvas.js?v=15"></script>
<script> <script>
const sessionId = '<%= sessionId %>'; const sessionId = '<%= sessionId %>';
const __t = window.__t; const __t = window.__t;