update canvas winning team glow effect (#1326)
This commit is contained in:
@@ -505,17 +505,24 @@
|
||||
font-size: 0.7rem;
|
||||
color: rgba(255,255,255,0.8);
|
||||
}
|
||||
.rc-tk-side { display: flex; align-items: center; gap: 0.35rem; flex: 0 0 auto; min-width: 0; }
|
||||
.rc-tk-lose { justify-content: flex-end; }
|
||||
.rc-tk-name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 8rem; }
|
||||
.rc-tk-win .rc-tk-name { color: #5cdf5c; }
|
||||
.rc-tk-lose .rc-tk-name { color: #e85555; }
|
||||
.rc-tk-val { font-variant-numeric: tabular-nums; opacity: 0.85; min-width: 2.6rem; }
|
||||
.rc-tk-win .rc-tk-val { text-align: right; }
|
||||
.rc-tk-val { font-variant-numeric: tabular-nums; font-weight: 600; min-width: 2.6rem; }
|
||||
.rc-tk-val-win { color: #5cdf5c; text-align: right; }
|
||||
.rc-tk-val-lose { color: #e85555; text-align: left; }
|
||||
.rc-tk-track { flex: 1 1 auto; display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: rgba(255,255,255,0.08); }
|
||||
.rc-tk-fill { height: 100%; transition: width 0.1s linear; }
|
||||
.rc-tk-fill-win { background: #2a8f2a; }
|
||||
.rc-tk-fill-lose { background: #b22020; }
|
||||
/* Winner glow once the loser has bled out (game over) */
|
||||
.rc-tickets.rc-tk-finished .rc-tk-track { animation: rcTkGlow 1.2s ease-in-out infinite; }
|
||||
.rc-tickets.rc-tk-finished .rc-tk-val-win { animation: rcTkTextGlow 1.2s ease-in-out infinite; }
|
||||
@keyframes rcTkGlow {
|
||||
0%, 100% { box-shadow: 0 0 4px 0 rgba(92,223,92,0.5); }
|
||||
50% { box-shadow: 0 0 13px 3px rgba(92,223,92,0.95); }
|
||||
}
|
||||
@keyframes rcTkTextGlow {
|
||||
0%, 100% { text-shadow: 0 0 4px rgba(92,223,92,0.45); }
|
||||
50% { text-shadow: 0 0 11px rgba(92,223,92,0.95); }
|
||||
}
|
||||
.rc-controls {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
Reference in New Issue
Block a user