games: no mercy on the felt, and the bill that went to the wrong window
The engine has been able to play No Mercy since aca523e. Now a browser can.
The switch is a switch, not a fourth table: the tier is still the table size,
because that is what you are paid for, and the deck is the other dial. Six faces
the normal box does not print, sized by the card's own vars and never by the box
they sit in. The stack says what the bill is on the felt, in the turn line and on
the button, and under it the deck is dead — you cannot draw your way out of a
bill somebody has run up and pointed at you.
The wild draws glow. That started as decoration and turned out to be doing work:
No Mercy prints a coloured +4 right beside the wild one, and in a hand of twenty
the glow is what tells them apart.
A buried seat is not an empty one, which is the whole trap here — a seat killed
at twenty-five holds no cards, and neither does a seat that just went out and
won. The view asks the engine which it is instead of counting to zero, so the
winner is never the corpse.
Two bugs, both found in a browser and neither findable anywhere else:
The felt's stack bill was writing into the chip bar. It was [data-pending], and
so is the bar's "your chips are still coming" readout — and the bar lives inside
the table's own root and comes first in the document. A stack quietly overwrote
the escrow message and never appeared on the felt at all. A table's attributes
are not a private namespace.
And hold'em, re-driven on the 20M-hand policy (six hands, got up 61 ahead of a
100 buy-in, money conserved to the chip — Phase 4 closed), let you click a button
that did nothing: Deal, Leave and Top up stayed alive through the whole deal
animation, where send() drops the click on purpose. The lock is on the buttons
now, not only in the variable.
Claude-Session: https://claude.ai/code/session_013M5nD7PgUboJXoDcYHzpuJ
This commit is contained in:
@@ -1750,11 +1750,134 @@ html[data-phase="night"] {
|
||||
.pete-uno-swatch[data-c="yellow"] { --sw: #e0b02c; color: #2b2118; }
|
||||
.pete-uno-swatch[data-c="green"] { --sw: #46a86b; }
|
||||
|
||||
/* ---- No Mercy -------------------------------------------------------------
|
||||
A rules dial, not a fourth table, and the felt says so: the same table, the
|
||||
same cards, plus six faces the normal box doesn't print and one thing that
|
||||
can be pointed at you — a stack of draw cards with a bill on it.
|
||||
|
||||
Sizing note, and it is the rule this table was taught the hard way: a card is
|
||||
sized by --uno-h/--uno-w and nothing else. These faces set a *font*, never a
|
||||
box, so a "DISCARD ALL" is the same card as a "7" at every width. */
|
||||
|
||||
/* The long faces. "DISCARD ALL" does not fit across an oval at card size, so it
|
||||
wraps — and the oval is tilted, so it wraps on the tilt, which is what the
|
||||
printed card does too. Specificity has to clear the wild rule above (a
|
||||
reverse-draw-four is a wild), hence the .pete-uno-card in front. */
|
||||
.pete-uno-card .pete-uno-oval[data-size="mid"] { font-size: 1.05rem; }
|
||||
.pete-uno-card .pete-uno-oval[data-size="words"] {
|
||||
font-size: 0.5rem;
|
||||
line-height: 1.1;
|
||||
letter-spacing: 0.02em;
|
||||
text-align: center;
|
||||
padding: 0 0.15rem;
|
||||
}
|
||||
|
||||
/* The wild draws glow.
|
||||
|
||||
These are the cards that decide a game, and No Mercy prints a *coloured* +4
|
||||
right next to the wild one, so at a glance in a hand of twenty they have to be
|
||||
tellable apart. The aura is a sibling behind the card rather than a shadow on
|
||||
it: a box-shadow here would fight the one that says which colour a played wild
|
||||
was named as (data-named, above), and lose.
|
||||
|
||||
It sits under the card (z-index -1) and does not take clicks, so the card is
|
||||
still the button. */
|
||||
.pete-uno-card[data-glow="1"] { position: relative; z-index: 0; }
|
||||
.pete-uno-card[data-glow="1"]::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: -0.35rem;
|
||||
z-index: -1;
|
||||
border-radius: 0.9rem;
|
||||
pointer-events: none;
|
||||
background: conic-gradient(from 0deg,
|
||||
#d64545, #e0b02c, #46a86b, #3d7fd6, #d64545);
|
||||
filter: blur(7px);
|
||||
opacity: 0.75;
|
||||
animation: pete-uno-glow 3.2s linear infinite;
|
||||
}
|
||||
/* The shimmer across the face itself: a slow sweep of light, the way a foil card
|
||||
catches the room when you tilt it. */
|
||||
.pete-uno-card[data-glow="1"] .pete-uno-face::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
z-index: 2;
|
||||
pointer-events: none;
|
||||
background: linear-gradient(115deg,
|
||||
transparent 35%, rgba(255,255,255,0.55) 50%, transparent 65%);
|
||||
background-size: 260% 100%;
|
||||
animation: pete-uno-shine 2.6s ease-in-out infinite;
|
||||
}
|
||||
@keyframes pete-uno-glow {
|
||||
to { transform: rotate(1turn); }
|
||||
}
|
||||
@keyframes pete-uno-shine {
|
||||
0% { background-position: 140% 0; }
|
||||
55% { background-position: -40% 0; }
|
||||
100% { background-position: -40% 0; }
|
||||
}
|
||||
|
||||
/* The bill. While a stack stands it is the only thing on the table that matters,
|
||||
so it is loud, and it is red. */
|
||||
.pete-uno-pending {
|
||||
font-family: "Fredoka", ui-sans-serif, system-ui, sans-serif;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
padding: 0.18rem 0.7rem;
|
||||
border-radius: 999px;
|
||||
color: #fff;
|
||||
background: #cc3d4a;
|
||||
box-shadow: 0 3px 0 rgba(0,0,0,0.2);
|
||||
animation: pete-uno-bill 1.1s ease-in-out infinite;
|
||||
}
|
||||
@keyframes pete-uno-bill {
|
||||
0%, 100% { transform: scale(1); }
|
||||
50% { transform: scale(1.06); }
|
||||
}
|
||||
|
||||
/* A seat the mercy rule buried. It stays at the table — the felt would jump if
|
||||
it didn't, and you want to see who's gone — but it is plainly out. */
|
||||
.pete-uno-seat[data-out="1"] {
|
||||
opacity: 0.4;
|
||||
filter: grayscale(1);
|
||||
}
|
||||
.pete-uno-seat[data-out="1"] .pete-uno-count { color: #ffb3ba; }
|
||||
|
||||
/* The rules switch: two dials, and this is the one that isn't the table size. */
|
||||
.pete-seg {
|
||||
display: inline-flex;
|
||||
padding: 0.2rem;
|
||||
border-radius: 999px;
|
||||
background: color-mix(in srgb, var(--ink) 6%, transparent);
|
||||
}
|
||||
.pete-seg-btn {
|
||||
padding: 0.3rem 0.9rem;
|
||||
border-radius: 999px;
|
||||
font-family: "Fredoka", ui-sans-serif, system-ui, sans-serif;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
color: color-mix(in srgb, var(--ink) 55%, transparent);
|
||||
transition: background 0.15s ease, color 0.15s ease;
|
||||
}
|
||||
.pete-seg-btn:hover { color: var(--ink); }
|
||||
.pete-seg-btn[data-on="1"] {
|
||||
background: var(--accent);
|
||||
color: #fff;
|
||||
box-shadow: 0 2px 0 rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
/* A phone. The cards get smaller so a hand of ten still fits without the felt
|
||||
scrolling sideways, which is the thing to check at 390px with a game on it. */
|
||||
scrolling sideways, which is the thing to check at 390px with a game on it.
|
||||
No Mercy deals bigger hands than that — it is a deck built to bury you — so
|
||||
this is the table where a twenty-card hand has to wrap and not overflow. */
|
||||
@media (max-width: 639px) {
|
||||
.pete-uno-hand { --uno-h: 5.2rem; --uno-w: 3.5rem; gap: 0.3rem; }
|
||||
.pete-uno-deck { --uno-h: 5.2rem; --uno-w: 3.5rem; }
|
||||
.pete-uno-card .pete-uno-oval[data-size="words"] { font-size: 0.42rem; }
|
||||
.pete-uno-card .pete-uno-oval[data-size="mid"] { font-size: 0.9rem; }
|
||||
/* The vars, not just the box: the card in the discard is a .pete-uno-card and
|
||||
takes its size from them, so sizing the box alone left a full-size card
|
||||
hanging out of a small hole, on top of the colour in play. */
|
||||
@@ -1783,6 +1906,11 @@ html[data-phase="night"] {
|
||||
.pete-clock[data-hot="1"],
|
||||
.pete-answer[data-state="wrong"] { animation: none; }
|
||||
.pete-rung { transition: none; }
|
||||
/* The wild draws keep their glow — it is what tells the card apart from the
|
||||
coloured +4 beside it, so it is information — but it stops moving. */
|
||||
.pete-uno-card[data-glow="1"]::before { animation: none; }
|
||||
.pete-uno-card[data-glow="1"] .pete-uno-face::after { display: none; }
|
||||
.pete-uno-pending { animation: none; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user