From 84a2e7a93e06b2c9aa5460931dcb8b0174048034 Mon Sep 17 00:00:00 2001
From: Jared Vititoe <jjvititoe1@gmail.com>
Date: Sat, 27 Jun 2026 21:30:21 -0400
Subject: [PATCH] fix(settings): restore background swatch grid layout; verify
 N4 poll fix
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add grow="Yes" to ChatBgGrid and SeasonalBgGrid containers so they
  expand to fill their flex parent — without it the Box shrank to one
  column (~76px wide) because folds Box defaults to display:flex and
  the wrapper is a flex-row with no explicit width.
- Mark N4 (PollContent) FIXED ✅ VERIFIED in LOTUS_BUGS.md after
  confirmed pass on default Cinny themes and Lotus TDS.
- Mark B1 and B4 PASS in LOTUS_TESTING.md.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 LOTUS_BUGS.md                                 | 2 +-
 LOTUS_TESTING.md                              | 4 ++--
 src/app/features/settings/general/General.tsx | 2 ++
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/LOTUS_BUGS.md b/LOTUS_BUGS.md
index 3c84b5ef5..55a6d058e 100644
--- a/LOTUS_BUGS.md
+++ b/LOTUS_BUGS.md
@@ -301,7 +301,7 @@ This document tracks identified bugs, edge cases, and architectural discrepancie
 #### N4. `PollContent` Vote Buttons — Entirely Outside the Folds Design System
 
 - **File:** `src/app/components/message/content/PollContent.tsx`
-- **Status:** **FIXED ⚠️ UNTESTED** (`caf6318a`) — needs verification: create a poll, then view/vote on it under a **non-TDS theme** (e.g. default Cinny dark/light) and confirm borders, selected state, and progress fill are all visible.
+- **Status:** **FIXED ✅ VERIFIED** (`caf6318a`) — confirmed renders correctly on default Cinny themes and with Lotus TDS enabled; borders, selected state, and progress fill all visible.
 - **Issue:** Each poll answer is a native `<button>` with ~15 hardcoded inline style properties using undefined CSS variables (`--accent-cyan`, `--accent-cyan-dim`, `--accent-cyan-border`, `--border-color`). Checkbox/radio indicators, percentage spans, and the poll label used raw pixel/rem font sizes (`0.68rem`, `0.78rem`, `0.88rem`) and hardcoded `rgba()`/`#fff`. None of those vars exist outside TDS mode — the component rendered unstyled (invisible borders / no selected/progress state) on every non-TDS theme.
 - **Root Cause:** Custom implementation that bypassed folds tokens entirely.
 - **Fix Applied:** Kept the `<button>` structure (the progress-bar-behind-text affordance has no folds `Button` equivalent) but made every value theme-reactive: `color.Primary.*` for selected/indicator state, `color.SurfaceVariant.*` for the resting surface + progress fill, `config.*` for radii/spacing/border-width, and folds `<Text>` for the option label, percentage, and section label (dropping the raw rem sizes and `opacity` hacks). The duplicate checkbox/radio indicator spans were merged into one.
diff --git a/LOTUS_TESTING.md b/LOTUS_TESTING.md
index 6a4fecd96..b1db5beaa 100644
--- a/LOTUS_TESTING.md
+++ b/LOTUS_TESTING.md
@@ -126,7 +126,7 @@ This guards against a permanently-stuck "Loading…" call. Also covers the N96 b
 
 This was the actual bug: poll buttons used undefined CSS variables, so on the **default (non-Lotus-Terminal) themes** they rendered with invisible borders / no selected state.
 
-### B1. Poll renders on a default theme
+### B1. Poll renders on a default theme — ✅ PASS
 
 1. Switch to a **default Cinny theme** (Settings → Appearance — **not** Lotus Terminal / TDS). Test both a **dark** and a **light** theme.
 2. In any room, create a poll (composer → poll button): a **single-choice** poll with 3 options.
@@ -154,7 +154,7 @@ This was the actual bug: poll buttons used undefined CSS variables, so on the **
 - Indicators are **square checkboxes** (not circles); selected ones show a **✓** that's legible against the filled box.
 - You can select **several** options; each shows its own progress fill.
 
-### B4. Lotus Terminal theme regression
+### B4. Lotus Terminal theme regression — ✅ PASS
 
 1. Switch to **Lotus Terminal / TDS** theme and re-open a poll.
    **Expected:** still looks correct (the fix uses theme tokens, so the TDS accent should now drive it) — no worse than before.
diff --git a/src/app/features/settings/general/General.tsx b/src/app/features/settings/general/General.tsx
index 01eba4812..b69c43bce 100644
--- a/src/app/features/settings/general/General.tsx
+++ b/src/app/features/settings/general/General.tsx
@@ -1668,6 +1668,7 @@ function SeasonalBgGrid({
 }) {
   return (
     <Box
+      grow="Yes"
       style={{
         display: 'grid',
         gridTemplateColumns: `repeat(auto-fill, minmax(${toRem(76)}, 1fr))`,
@@ -1734,6 +1735,7 @@ function ChatBgGrid() {
 
   return (
     <Box
+      grow="Yes"
       style={{
         display: 'grid',
         gridTemplateColumns: `repeat(auto-fill, minmax(${toRem(76)}, 1fr))`,