From 3e961496b02e8b1cc83b7318862cdbf9a55ebc00 Mon Sep 17 00:00:00 2001 From: "Jesse.Markowitz" Date: Sat, 29 Aug 2026 19:14:37 -0400 Subject: [PATCH] =?UTF-8?q?v0.7.5=20=E2=80=94=20solitaire=20asks=20before?= =?UTF-8?q?=20it=20deals,=20the=20same=20way=20multiplayer=20already=20doe?= =?UTF-8?q?s?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit A new #solitairesetup screen in play.html asks the full shared game-options block — type, starting hand, Extra start, revenue, victory conditions, optional rules — before a genuinely fresh visit deals a game. A saved game, an explicit ?seed=, or a URL a Deal already wrote all skip past it, same as ?lobby already skips the front doors on an invite link. The in-game dialog, the lobby and this screen now share one wireGameTypeBlock()/commitNewGame() pair instead of the dialog carrying its own copy of the questions. 859 tests pass. Not yet played in a browser. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_01AdG46Ja2PEDBkpqiDazMoX --- CHANGELOG.md | 39 ++++++ TODO.md | 11 ++ package.json | 2 +- src/web/index.html | 6 +- src/web/main.ts | 314 +++++++++++++++++++++++++++++---------------- src/web/play.html | 185 +++++++++++++++++++++++++- test/web.test.ts | 34 ++++- 7 files changed, 465 insertions(+), 126 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 145040b..e5b8891 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,45 @@ page as `v0.1.0 · · `, so what is deployed can always be identifie --- +## 0.7.5 — 2026-08-29 + +### Solitaire asks first, the same way multiplayer already does + +Jesse: "let the user choose their options like the start of a multiplayer game"; "asking first is +the only path." A bare visit to `play.html` used to deal a game on the spot, at whatever defaults +`gameOptionsFromUrl` fell back to, and the only way to see or change a setting was to open the +in-game "New game" dialog after the fact — compare a hand you already have, not one you are about +to be dealt. The lobby has asked this question for every multiplayer game since v0.6.0; solitaire +never did. + +A genuinely fresh visit now lands on a new `#solitairesetup` screen first: game type, starting hand, +where an Extra may start, the three revenue rates, victory conditions, and the three optional rules +— then a Deal button. A saved game, an explicit `?seed=`, or a URL a Deal already wrote (`hand` is +the field every write always sets, so its presence is what tells the difference) all skip straight +past it, the same way `?lobby` already skips the front doors on an invite link — those are not "no +plan yet", they are a choice already made, elsewhere. + +**One shared block instead of two copies drifting apart.** The in-game dialog, the lobby, and now +this screen all drive the identical `settings-form.ts` block through one new function, +`wireGameTypeBlock()` — factored out of what used to be dialog-only code. Only Solitaire can be +dealt outside the lobby, so the setup screen shows the other four types exactly as the dialog always +has: present, disabled, with a note pointing at the Multiplayer door. Committing an answer — from +either the dialog or the setup screen — goes through one `commitNewGame()`, which builds the URL and +navigates; `start()` is still the only place that turns a URL into a game. + +Prefilling is deliberately left to the caller rather than folded into `wireGameTypeBlock` itself: +the dialog opens on the game CURRENTLY IN PLAY, so redealing to compare keeps comparing against it, +while the setup screen opens on the plain Solitaire defaults, since there is no live game yet to +read. + +`index.html`'s door copy changed to match: "Start a game" reads "Set up a game" now, and the blurb +states the floor (15, not "20 Revenue") since that is what a player is agreeing to before they deal. + +859 tests pass. **Not yet played in a browser** — verified by `tsc --noEmit`, the full suite, and +reading the diff, not by loading `play.html` fresh and clicking through it. + +--- + ## 0.7.4 — 2026-08-29 Three rules issues off the tracker, in the order Jesse asked for them: #13, #5, #19. All three are diff --git a/TODO.md b/TODO.md index a30f539..793d6b7 100644 --- a/TODO.md +++ b/TODO.md @@ -308,6 +308,17 @@ Queued 2026-08-29, from building Gitea#11 and #16 (both shipped in v0.7.3, main Stage for switching, which needs it to know it wants time — a notion it does not have. Reasoning and the measurement are under Bot Performance. +42. ~~**Solitaire must ask before it deals, the same way multiplayer's lobby already does.**~~ — done + 2026-08-29 in v0.7.5. Jesse: "let the user choose their options like the start of a multiplayer + game"; "asking first is the only path." A new `#solitairesetup` screen in `play.html` asks the + full shared block — game type, starting hand, Extra start, revenue, victory conditions, optional + rules — before a genuinely fresh visit deals anything; a saved game, an explicit `?seed=`, or a + URL a Deal already wrote all skip past it. The in-game dialog, the lobby and this screen now + share one `wireGameTypeBlock()`/`commitNewGame()` pair instead of the dialog carrying its own + copy. Reasoning in `CHANGELOG.md`. **Committed but not yet played in a browser** — verified by + `tsc --noEmit` and the full suite (859 pass), not by loading the page and clicking through it. + Worth being an early item in the next play session, alongside #39's four unplayed v0.7.4 features. + --- ## Replay / Save Games diff --git a/package.json b/package.json index 95b3eb3..3ef440b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "station-master", - "version": "0.7.4", + "version": "0.7.5", "private": true, "type": "module", "description": "Station Master — a railroad operations game", diff --git a/src/web/index.html b/src/web/index.html index 77744c6..3fdfcbe 100644 --- a/src/web/index.html +++ b/src/web/index.html @@ -81,11 +81,11 @@ footer{margin-top:26px;color:var(--dim);font-size:11px;display:flex;gap:18px;fle

Play solitaire

-

Play by yourself and run the entire division for five full days. Your goal is 20 Revenue. - Your game data is saved in your browser — if you close the tab and reopen this site +

Play by yourself and run the entire division for five full days. Clear the Revenue floor of + 15 by the end or the game is a loss. Your game data is saved in your browser — if you close the tab and reopen this site without clearing your cache, your game is preserved and you can continue automatically. During the game you can also explicitly save your progress for later replay.

- Start a game → + Set up a game → diff --git a/src/web/main.ts b/src/web/main.ts index b98e0db..2c361a3 100644 --- a/src/web/main.ts +++ b/src/web/main.ts @@ -37,6 +37,7 @@ import { } from './presets.ts'; import type { GameType, PresetName } from './presets.ts'; import { settingsForm } from './settings-form.ts'; +import type { SettingsForm } from './settings-form.ts'; const SAVE_KEY = 'station-master.save.v1'; const SETTINGS_KEY = 'station-master.settings.v1'; @@ -628,12 +629,15 @@ function noteFirstFrame(f: Frame): void { ); } -/** Toggles the two mutually-exclusive top-level screens `play.html` defines — `#lobby` (Phase 4) - * and `#gameui` (the board, whether local or remote). Both start `hidden` in the markup so neither - * ever flashes before `start()` decides which one this load actually needs. */ -function showScreen(which: 'lobby' | 'gameui'): void { +/** Toggles the three mutually-exclusive top-level screens `play.html` defines — `#lobby` (Phase 4), + * `#gameui` (the board, whether local or remote), and `#solitairesetup` (asked before the first + * solitaire deal, the same way `#lobby` is asked before the first multiplayer one — Jesse, + * 2026-08-29). All three start `hidden` in the markup so none ever flashes before `start()` decides + * which one this load actually needs. */ +function showScreen(which: 'lobby' | 'gameui' | 'solitairesetup'): void { document.getElementById('lobby')!.hidden = which !== 'lobby'; document.getElementById('gameui')!.hidden = which !== 'gameui'; + document.getElementById('solitairesetup')!.hidden = which !== 'solitairesetup'; } /** @@ -739,16 +743,35 @@ function start(): void { return; } - showScreen('gameui'); + // A saved game carries its OWN rules and re-deals itself under them, whatever the URL says — see + // `configFor`. Read once, here, so the same answer decides both whether to ask before dealing and + // (below) whether to restore. + const saved = load(); const requested = params.get('seed'); + + /** + * ASK BEFORE THE FIRST DEAL, THE SAME WAY THE LOBBY ASKS BEFORE THE FIRST MULTIPLAYER GAME + * (Jesse, 2026-08-29 — "let the user choose their options like the start of a multiplayer game"; + * "asking first is the only path"). + * + * A saved game or an explicit `seed=` both mean this visit is not "no plan yet" — a saved game is + * a game to resume, and a seed names a specific deal someone already chose to share or bookmark, + * the same reasoning `?lobby` already uses to skip past the doors on an invite link. `hand` is the + * one field every `commitNewGame` write always sets (`rulesToUrl`), so its presence means this + * navigation IS the setup screen's own Deal button, landing back here to actually deal — checking + * it is what stops the screen asking itself the question a second time. + */ + if (!saved && requested === null && !params.has('hand')) { + showScreen('solitairesetup'); + runSolitaireSetup(params); + return; + } + + showScreen('gameui'); // A seed in the URL makes a game shareable and reproducible: same link, same deal. const seed = requested !== null ? Number(requested) || 1 : Math.floor(Math.random() * 1e9); const local = createLocalSession(seed, solitaireDefaults(gameOptionsFromUrl(params))); session = local; - - // A saved game carries its OWN rules and re-deals itself under them, whatever the URL says — see - // `configFor`. That is why the restore happens after the session is built rather than feeding it. - const saved = load(); if (saved && requested === null) local.restore(saved); applyCapabilities(); @@ -1895,58 +1918,77 @@ if (leaveBtn) { }; } -const newBtn = document.getElementById('newgame'); -const dlg = document.getElementById('newgamedlg') as HTMLDialogElement | null; -if (newBtn && dlg) { - const field = (id: string): T => document.getElementById(id) as T; - const ngForm = settingsForm('ng-'); +/** + * ONE GAME-TYPE BLOCK, WIRED — the type radios, the shared rules form beneath them, and the small + * glue between them (which type is currently selected, what its note says, how Days feeds the + * floor). The in-game "New game" dialog (`ng-`) and the pre-game setup screen (`ss-`, Gitea + * "let the user choose their options like the start of a multiplayer game", 2026-08-29) both need + * an identical copy of this — factored out once so the two cannot drift apart the way the rules + * block itself already had before `settings-form.ts` existed to stop it. + * + * PREFILLING IS DELIBERATELY LEFT TO THE CALLER. The dialog opens on the game CURRENTLY IN PLAY + * (so redealing to compare keeps comparing); the setup screen opens on the plain Solitaire + * defaults, because there is no game yet to read. `setBase` plus a direct `form.write(...)` is the + * seam that lets each caller do its own version of "what do these fields show at first paint" + * without this function having to guess which one it is wiring. + */ +type WiredGameType = { + form: SettingsForm; + days(): number; + refresh(): void; + /** The common case: prefill straight from a named type's own defaults, then repaint. */ + selectPreset(name: PresetName): void; + /** The dialog's case: the caller writes the form itself (from a live game), then calls `refresh` + * — this only sets which type that write should be compared against. */ + setBase(name: PresetName, type: GameType): void; +}; - /** - * THE SAME FIVE GAME TYPES THE LOBBY OFFERS, and the same shared rules block under them. - * - * The dialog used to carry its own copy of the questions and its own idea of the defaults, which - * is how it ended up with "where an Extra may start" that the lobby did not have and none of the - * three optional rules that it did. Both screens now read `presets.ts` and drive their block - * through `settings-form.ts`; only Solitaire can actually be DEALT here, so the three multiplayer - * types are shown disabled rather than hidden — what this screen offers and what the lobby offers - * should read as one list, not two. - */ - let ngBase: PresetName = 'solitaire'; - let ngType: GameType = 'solitaire'; +function wireGameTypeBlock(prefix: string, root: ParentNode): WiredGameType { + const field = (id: string): T => document.getElementById(`${prefix}${id}`) as T; + const form = settingsForm(prefix); + + let base: PresetName = 'solitaire'; + let type: GameType = 'solitaire'; /** As in the lobby: the floor is derived from the length until the player sets one themselves. */ - let ngFloorTyped = false; + let floorTyped = false; - const ngDays = (): number => { - const raw = Number(field('ng-days').value); + const days = (): number => { + const raw = Number(field('days').value); return Number.isFinite(raw) && raw >= 1 ? Math.round(raw) : 5; }; - const ngTypeRadios = (): HTMLInputElement[] => - Array.from(dlg.querySelectorAll('input[name="ng-type"]')); + const typeRadios = (): HTMLInputElement[] => + Array.from(root.querySelectorAll(`input[name="${prefix}type"]`)); - function ngRefresh(): void { - const differing = ngForm.mark(ngBase, 1, ngDays()); - if (differing.length > 0) ngType = 'custom'; - else if (ngType === 'custom') ngType = ngBase; - for (const r of ngTypeRadios()) r.checked = r.value === ngType; - const note = field('ng-type-note'); + function refresh(): void { + const differing = form.mark(base, 1, days()); + if (differing.length > 0) type = 'custom'; + else if (type === 'custom') type = base; + for (const r of typeRadios()) r.checked = r.value === type; + const note = field('type-note'); note.textContent = - ngType === 'custom' - ? `${gameTypeLabel('custom', preset(ngBase).scoring)} · ${differing.length} ` + - `${differing.length === 1 ? 'setting differs' : 'settings differ'} from ${preset(ngBase).label}.` - : preset(ngType as PresetName).blurb; + type === 'custom' + ? `${gameTypeLabel('custom', preset(base).scoring)} · ${differing.length} ` + + `${differing.length === 1 ? 'setting differs' : 'settings differ'} from ${preset(base).label}.` + : preset(type as PresetName).blurb; } - function ngSelectPreset(name: PresetName): void { - ngBase = name; - ngType = name; - ngFloorTyped = false; - const values = presetSettings(name, 1, ngDays()); - ngForm.write(values, values); - ngRefresh(); + function selectPreset(name: PresetName): void { + base = name; + type = name; + floorTyped = false; + const values = presetSettings(name, 1, days()); + form.write(values, values); + refresh(); } - for (const r of ngTypeRadios()) { + function setBase(name: PresetName, t: GameType): void { + base = name; + type = t; + floorTyped = false; + } + + for (const r of typeRadios()) { // Nothing here can deal a multiplayer game: a `LocalSession` runs the engine in this browser and // a table needs a server. The lobby is the door, and the row says so rather than just refusing // the click (Jesse, 2026-08-23 — a disabled radio that looks enabled reads as a broken one). @@ -1964,33 +2006,99 @@ if (newBtn && dlg) { r.onchange = () => { if (!r.checked) return; if (r.value === 'custom') { - ngType = 'custom'; - ngRefresh(); + type = 'custom'; + refresh(); return; } - ngSelectPreset(r.value as PresetName); + selectPreset(r.value as PresetName); }; } - ngForm.onEdit((key) => { - if (key === 'minCombinedRevenue') ngFloorTyped = true; - ngType = 'custom'; - ngRefresh(); + form.onEdit((key) => { + if (key === 'minCombinedRevenue') floorTyped = true; + type = 'custom'; + refresh(); }); // Days is a parameter, not a rule: it re-derives the floor and never makes a game Custom by itself. - field('ng-days').oninput = () => { - if (!ngFloorTyped) { - const values = ngForm.read(); - const want = presetSettings(ngBase, 1, ngDays()); - ngForm.write({ ...values, minCombinedRevenue: want.minCombinedRevenue }, want); + field('days').oninput = () => { + if (!floorTyped) { + const values = form.read(); + const want = presetSettings(base, 1, days()); + form.write({ ...values, minCombinedRevenue: want.minCombinedRevenue }, want); } - ngRefresh(); + refresh(); }; // "Everyone moves one chair left" has no meaning at a table of one — disabled with the rest of the - // block still visible, so the two screens read the same. - ngForm.setEmployeeRotationAvailable(false); + // block still visible, so every screen that offers it reads the same. + form.setEmployeeRotationAvailable(false); + + return { form, days, refresh, selectPreset, setBase }; +} + +/** + * THE COMMIT — reads a wired block's answers and turns them into a URL, the same path `?seed=` + * already took: `start()` reads it back out, so there is exactly one place that turns a URL into a + * game, whichever screen produced it. + */ +function commitNewGame(wired: WiredGameType, seedFieldValue: string): void { + const asked = seedFieldValue.trim(); + // A seed the browser cannot parse is not a reason to refuse to deal — blank and unparseable both + // mean "surprise me", which is what leaving the box alone plainly asks for. + const seed = asked === '' || !Number.isFinite(Number(asked)) ? '' : String(Math.trunc(Number(asked))); + const settings = wired.form.read(); + const rules = houseRules({ + houseRules: { + startingHand: settings.startingHand, + extraStart: settings.extraStart, + discardTimetabled: settings.discardTimetabled, + revenue: { + passengerPerCoach: settings.passengerPerCoach, + freightPerLoad: settings.freightPerLoad, + trainPerTransit: settings.trainPerTransit, + }, + }, + }); + const victory: NewGameOptions = { + days: Math.max(1, wired.days()), + minCombinedRevenue: settings.minCombinedRevenue, + maxCollisionsPerDay: settings.maxCollisionsPerDay, + maxCollisionsTotal: settings.maxCollisionsTotal, + optionalRules: { + reducedVisibility: settings.reducedVisibility, + // Never on at a table of one, whatever the box says — the control is disabled for the same + // reason, and this is the half that reaches the engine. + employeeRotation: false, + emergencyToolbox: settings.emergencyToolbox, + }, + }; + + clearSave(); + const next = rulesToUrl(rules, victory, seed); + // Assigning the search string the page ALREADY has does nothing at all, which reads as a button + // that did not work — and it is the common case: deal a random seed, decide it was a bad deal, + // deal another at the same settings. Reload instead, and `start()` rolls a fresh seed. + if (next === location.search) location.reload(); + else location.search = next; +} + +const newBtn = document.getElementById('newgame'); +const dlg = document.getElementById('newgamedlg') as HTMLDialogElement | null; +if (newBtn && dlg) { + const field = (id: string): T => document.getElementById(id) as T; + + /** + * THE SAME FIVE GAME TYPES THE LOBBY OFFERS, and the same shared rules block under them. + * + * The dialog used to carry its own copy of the questions and its own idea of the defaults, which + * is how it ended up with "where an Extra may start" that the lobby did not have and none of the + * three optional rules that it did. Every screen now reads `presets.ts` and drives its block + * through `settings-form.ts`; only Solitaire can actually be DEALT here, so the three multiplayer + * types are shown disabled rather than hidden — what this screen offers and what the lobby offers + * should read as one list, not two. + */ + const ng = wireGameTypeBlock('ng-', dlg); /** * ASK FOR ALL OF IT, rather than documenting URL parameters in the title bar. @@ -2019,67 +2127,49 @@ if (newBtn && dlg) { field('ng-seed').value = ''; field('ng-days').value = String(f.days); - ngBase = 'solitaire'; - ngType = 'solitaire'; - ngFloorTyped = false; + ng.setBase('solitaire', 'solitaire'); // The rules actually in play, then the comparison decides what to call them. - ngForm.write(settingsOf(configFromFrame(f)), presetSettings('solitaire', 1, f.days)); - ngForm.setEmployeeRotationAvailable(false); - ngRefresh(); + ng.form.write(settingsOf(configFromFrame(f)), presetSettings('solitaire', 1, f.days)); + ng.refresh(); dlg.showModal(); }; /** * One handler for every way the dialog can close — the Deal button, the Cancel button, and Esc, * which `` answers with an empty `returnValue` and no submit event at all. - * - * The answers go into the URL and the page navigates, which is the same path `?seed=` already - * took: `start()` reads them back, so there is exactly one place that turns a URL into a game. */ dlg.addEventListener('close', () => { if (dlg.returnValue !== 'deal') return; - - const asked = field('ng-seed').value.trim(); - // A seed the browser cannot parse is not a reason to refuse to deal — blank and unparseable - // both mean "surprise me", which is what leaving the box alone plainly asks for. - const seed = asked === '' || !Number.isFinite(Number(asked)) ? '' : String(Math.trunc(Number(asked))); - const settings = ngForm.read(); - const rules = houseRules({ - houseRules: { - startingHand: settings.startingHand, - extraStart: settings.extraStart, - discardTimetabled: settings.discardTimetabled, - revenue: { - passengerPerCoach: settings.passengerPerCoach, - freightPerLoad: settings.freightPerLoad, - trainPerTransit: settings.trainPerTransit, - }, - }, - }); - const victory: NewGameOptions = { - days: Math.max(1, ngDays()), - minCombinedRevenue: settings.minCombinedRevenue, - maxCollisionsPerDay: settings.maxCollisionsPerDay, - maxCollisionsTotal: settings.maxCollisionsTotal, - optionalRules: { - reducedVisibility: settings.reducedVisibility, - // Never on at a table of one, whatever the box says — the control is disabled for the same - // reason, and this is the half that reaches the engine. - employeeRotation: false, - emergencyToolbox: settings.emergencyToolbox, - }, - }; - - clearSave(); - const next = rulesToUrl(rules, victory, seed); - // Assigning the search string the page ALREADY has does nothing at all, which reads as a button - // that did not work — and it is the common case: deal a random seed, decide it was a bad deal, - // deal another at the same settings. Reload instead, and `start()` rolls a fresh seed. - if (next === location.search) location.reload(); - else location.search = next; + commitNewGame(ng, field('ng-seed').value); }); } +/** + * THE PRE-GAME SETUP SCREEN — asked before the FIRST solitaire deal, the same way `#lobby` is + * already asked before the first multiplayer one (Jesse, 2026-08-29: "let the user choose their + * options like the start of a multiplayer game"; "asking first is the only path"). + * + * Only reached for a genuinely fresh visit — `start()` is what decides that; by the time this runs, + * there is no saved game and no URL already carrying a deal's answers. It opens on the plain + * Solitaire defaults, since there is no live game to compare against yet, and reuses the identical + * `wireGameTypeBlock`/`commitNewGame` pair the in-game dialog uses — the two are one design, not two. + */ +function runSolitaireSetup(params: URLSearchParams): void { + const screen = document.getElementById('solitairesetup'); + const dealBtn = document.getElementById('ss-deal'); + if (!screen || !dealBtn) return; + + const ss = wireGameTypeBlock('ss-', screen); + // A `?seed=` with no other rules params still means SOMETHING — a shared or bookmarked link + // naming a specific deal — so it is honoured as a prefill rather than discarded because this + // visit happened to be routed through the screen that now asks first. + const seedField = document.getElementById('ss-seed') as HTMLInputElement | null; + if (seedField) seedField.value = params.get('seed') ?? ''; + + ss.selectPreset('solitaire'); + dealBtn.onclick = () => commitNewGame(ss, seedField?.value ?? ''); +} + const zoomOutBtn = document.getElementById('zoomout') as HTMLButtonElement | null; const zoomInBtn = document.getElementById('zoomin') as HTMLButtonElement | null; const zoomLabel = document.getElementById('zoomlabel'); diff --git a/src/web/play.html b/src/web/play.html index abf3bfa..2a6cfd1 100644 --- a/src/web/play.html +++ b/src/web/play.html @@ -80,7 +80,7 @@ main{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:14px;padding:14p @media(max-width:1100px){main{grid-template-columns:1fr}} section{background:var(--panel);border:1px solid var(--line);border-radius:7px; padding:10px 12px;margin-bottom:12px} -#lobby{max-width:1040px;margin:0 auto;padding:14px} +#lobby,#solitairesetup{max-width:1040px;margin:0 auto;padding:14px} /* The create form is two short lists, not one long one: what game this is on the left, what its rules are on the right. Collapses to one column where there is no room for two. */ .lb-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:22px;align-items:start} @@ -96,8 +96,8 @@ section{background:var(--panel);border:1px solid var(--line);border-radius:7px; .ng-radio.disabled{opacity:.45;cursor:not-allowed} .ng-radio.disabled:hover{background:none} .lb-why{color:#e0b060;font-size:11px} -#lobby h2{margin-top:0} -#lobby h3{margin-bottom:2px} +#lobby h2,#solitairesetup h2{margin-top:0} +#lobby h3,#solitairesetup h3{margin-bottom:2px} .lb-seat{display:flex;align-items:center;gap:8px;padding:5px 0;border-bottom:1px solid var(--line)} .lb-seat:last-child{border-bottom:none} .lb-seat .who{flex:1} @@ -592,6 +592,185 @@ ul.blocked li{padding:2px 0} + + +