From 0a6bfcf6ccf6103b658e2f1abdb521ad4524d8e7 Mon Sep 17 00:00:00 2001 From: Disco DeDisco Date: Mon, 8 Jun 2026 00:25:11 -0400 Subject: [PATCH] =?UTF-8?q?Sea=20Select=20options:=20fixed-width=20chunks?= =?UTF-8?q?=20+=202-line=20spread=20names=20(add=20Rider-)=20=E2=80=94=20T?= =?UTF-8?q?DD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - The option chunks' width tracked the select label length (jumped between the two spreads). Fix the `.sea-form-col` to 19rem (a touch wider) so all three chunks share a standard width. - Split the spread label onto two lines around the comma + add the "Rider-" prefix now there's room: "Celtic Cross," / "Rider-Waite-Smith" and "Celtic Cross," / "Escape Velocity". combobox.js now writes the current label via `innerHTML` (not textContent) so the `
` survives a selection — plain-text options (sky / my_sea) are unaffected (their innerHTML == textContent). - ITs updated for the new gameroom labels (my_sea's single-line names untouched). 953 epic+gameboard ITs + Jasmine green. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/apps/epic/static/apps/epic/combobox.js | 6 +++++- src/apps/epic/tests/integrated/test_views.py | 5 +++-- src/static_src/scss/_sky.scss | 17 +++++------------ .../apps/gameboard/_partials/_sea_overlay.html | 10 +++++----- 4 files changed, 18 insertions(+), 20 deletions(-) diff --git a/src/apps/epic/static/apps/epic/combobox.js b/src/apps/epic/static/apps/epic/combobox.js index d4acd12..7fac4e8 100644 --- a/src/apps/epic/static/apps/epic/combobox.js +++ b/src/apps/epic/static/apps/epic/combobox.js @@ -55,7 +55,11 @@ var Combobox = (function () { o.setAttribute('aria-selected', idx === i ? 'true' : 'false'); }); var picked = options[i]; - if (current) current.textContent = picked.textContent.trim(); + // innerHTML (not textContent) so an option label carrying a
(the + // gameroom Sea Select 2-line spread names) keeps the line break in the + // current display. Plain-text options (sky / my_sea) are unaffected — + // their innerHTML == textContent. + if (current) current.innerHTML = picked.innerHTML.trim(); if (hidden && hidden.value !== picked.dataset.value) { hidden.value = picked.dataset.value; hidden.dispatchEvent(new Event('change', { bubbles: true })); diff --git a/src/apps/epic/tests/integrated/test_views.py b/src/apps/epic/tests/integrated/test_views.py index 6c067db..3a9f739 100644 --- a/src/apps/epic/tests/integrated/test_views.py +++ b/src/apps/epic/tests/integrated/test_views.py @@ -2618,7 +2618,8 @@ class PickSeaRenderingTest(TestCase): def test_sea_overlay_select_defaults_to_waite_smith_for_levity(self): self._confirm_sky() response = self.client.get(self.url) - self.assertContains(response, "Celtic Cross, Waite-Smith") + # 2-line spread label (split around the comma; "Rider-" prefix added). + self.assertContains(response, "Celtic Cross,
Rider-Waite-Smith") def test_sea_overlay_select_defaults_to_escape_velocity_for_gravity(self): ec_gamer = self.gamers[2] # EC — gravity @@ -2626,7 +2627,7 @@ class PickSeaRenderingTest(TestCase): ec_seat = TableSeat.objects.get(room=self.room, role="EC") self._confirm_sky(seat=ec_seat) response = self.client.get(self.url) - self.assertContains(response, "Celtic Cross, Escape Velocity") + self.assertContains(response, "Celtic Cross,
Escape Velocity") def test_user_polarity_in_context_at_sky_select(self): response = self.client.get(self.url) diff --git a/src/static_src/scss/_sky.scss b/src/static_src/scss/_sky.scss index a43c2e3..e1eaaa8 100644 --- a/src/static_src/scss/_sky.scss +++ b/src/static_src/scss/_sky.scss @@ -120,12 +120,14 @@ html.sea-open .sea-page.sea-page--room { // is its own --priUser rounded rectangle (the GAME POST .form-control look). .sea-page--room .sea-options-col .sea-form-col { background: transparent; - width: auto; - min-width: 15rem; - max-width: 22rem; + width: 19rem; // FIXED — independent of the select option text length + max-width: 90vw; padding: 0; gap: 0.6rem; } +// The selected-spread label wraps to two lines (around the comma) — let it sit +// left-aligned + tight, the
in the option label does the splitting. +.sea-page--room .sea-options-col .sea-select-current { line-height: 1.15; } .sea-page--room .sea-options-col .sea-form-main { flex: 0 0 auto; overflow: visible; @@ -162,15 +164,6 @@ html.sea-open .sea-page.sea-page--room { gap: 0.75rem; } -// A disabled btn (OK × / DEL ×) inside a --priUser chunk would BLEND into it — -// the global `.btn-disabled` bg is also --priUser → no visible circle. Drop them -// to the felt --duoUser so they read as a distinct disabled circle (like the -// deck-stack FLIP ×, user-spec 2026-06-08). The active/depress treatment is -// irrelevant here (the btns are inert). -.sea-page--room .sea-options-col .btn-disabled { - background-color: rgba(var(--duoUser), 1) !important; -} - // Pre-confirm: only the options show (the cross is hidden), filling the aperture // (mirrors `body:not(.sky-saved) .sky-wheel-col{display:none}`). .sea-page--room:not(.sea-spread-chosen) .sea-cross-col { display: none; } diff --git a/src/templates/apps/gameboard/_partials/_sea_overlay.html b/src/templates/apps/gameboard/_partials/_sea_overlay.html index 91b7dc3..0631813 100644 --- a/src/templates/apps/gameboard/_partials/_sea_overlay.html +++ b/src/templates/apps/gameboard/_partials/_sea_overlay.html @@ -41,15 +41,15 @@ via epic:sea_save. `?seat` threads the CARTE-selected seat onto the action URLs. aria-haspopup="listbox" aria-labelledby="id_sea_spread_label" tabindex="0"> - {% if sea_default_spread == "escape-velocity" %}Celtic Cross, Escape Velocity{% else %}Celtic Cross, Waite-Smith{% endif %} + {% if sea_default_spread == "escape-velocity" %}Celtic Cross,
Escape Velocity{% else %}Celtic Cross,
Rider-Waite-Smith{% endif %}