Light up the seat that's holding the game up #57

Merged
jheaps merged 9 commits from feature/casino-holdem-acting-seat into master 2026-09-01 09:31:52 -06:00
Showing only changes of commit a72f199139 - Show all commits
+42 -4
View File
@@ -2029,12 +2029,50 @@ body.hasActionBar #holdemSidebar {
color: #f0d9a8;
}
/* Whose turn it is, shown on the table itself as well as in the bar. */
/* Whose turn it is, shown on the table itself as well as in the bar.
Dealers say the biggest single time sink at a home table isn't how fast the cards
come out — it's players not noticing the action is on them. So this is the one
state that has to be unmistakable from across a table at a glance, and it was
distinguished only by a rim colour: a gold border and a 2px ring where a live seat
has a green border and a 1px one. Same fill, same size, nothing moving.
It now reads as lit rather than merely outlined: a solid ring at full strength, a
warm glow that separates it from the felt, and a lift of its own. The seat's
`transform` positions it around the table, so the lift is box-shadow rather than
translate — setting transform here would throw the seat off its spot. */
.seat.seatActing {
border-color: #d8b46a;
border-color: #f0cd85;
background: linear-gradient(160deg, #3a3222, #241f16);
box-shadow:
0 0 0 2px rgba(216, 180, 106, 0.45),
0 4px 16px rgba(0, 0, 0, 0.55);
0 0 0 3px rgba(216, 180, 106, 0.9),
0 0 18px 2px rgba(216, 180, 106, 0.35),
0 6px 20px rgba(0, 0, 0, 0.6);
z-index: 4;
}
/* A slow breath, so a dealer glancing up finds it without hunting. Deliberately
gentle and deliberately optional — the ring above carries the whole job on its own
for anyone who'd rather nothing moved. */
@media (prefers-reduced-motion: no-preference) {
.seat.seatActing {
animation: seatActingPulse 2.4s ease-in-out infinite;
}
@keyframes seatActingPulse {
0%, 100% {
box-shadow:
0 0 0 3px rgba(216, 180, 106, 0.9),
0 0 18px 2px rgba(216, 180, 106, 0.35),
0 6px 20px rgba(0, 0, 0, 0.6);
}
50% {
box-shadow:
0 0 0 3px rgba(216, 180, 106, 0.65),
0 0 26px 5px rgba(216, 180, 106, 0.5),
0 6px 20px rgba(0, 0, 0, 0.6);
}
}
}
.seatPuckStack {