ct-public/isparkclaw-webui
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: remove bubble_layout setting end-to-end (#777)

Browse Source 
Removes the bubble_layout toggle from Settings, all persistence, CSS, i18n strings, and the UI docs demo. The CSS was already effectively dead. Users with a saved bubble_layout value in settings.json get a clean migration via _SETTINGS_LEGACY_DROP_KEYS.

Credit: @aronprins (PR #760 / #777)

Co-authored-by: aronprins <aronprins@users.noreply.github.com>
This commit is contained in:
nesquena-hermes
2026-04-20 15:34:45 -07:00
committed by GitHub
parent 63f9b719bb
commit 76e602af25
9 changed files with 8 additions and 395 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
docs/ui-ux/index.html
View File

@@ -62,7 +62,6 @@
<button data-theme-btn="nord">Nord</button>
<button data-theme-btn="oled">OLED</button>
<span style="width:1px;height:18px;background:var(--border);margin:0 4px;align-self:center;"></span>
<button id="toggleBubble">Bubble layout: off</button>
</div>
</header>
@@ -664,24 +663,7 @@ Run typecheck to confirm, then patch.</pre></div>
</div>
</section>
<!-- ============================================================= -->
<section class="doc-section">
<div class="doc-kicker">11 · Bubble layout</div>
<h2 class="doc-h">Opt-in via <code>body.bubble-layout</code> — extra bubble padding for assistant too</h2>
<p class="doc-note">The default layout already right-aligns user messages (the redesign adopted it globally), so this toggle mostly affects additional padding / boundary handling. Flip the <strong>Bubble layout</strong> toggle in the header to see the mode applied.</p>
<div class="doc-card"><span class="doc-label">Conversation sample</span>
<div class="messages doc-messages"><div class="messages-inner doc-inner">
<div class="msg-row" data-role="user"><div class="msg-body"><p>Can you add a retry button next to the regenerate one?</p></div></div>
<div class="msg-row assistant-turn" data-role="assistant">
<div class="msg-role assistant"><span class="role-icon assistant">H</span><span>Hermes</span></div>
<div class="assistant-turn-blocks"><div class="assistant-segment">
<div class="msg-body"><p>Yes — it can share <code>.msg-action-btn</code> and live in the same <code>.msg-actions</code> container. I'll wire it up on <code>_lastError</code>.</p></div>
</div></div>
</div>
<div class="msg-row" data-role="user"><div class="msg-body"><p>Perfect, go for it.</p></div></div>
</div></div>
</div>
</section>
<!-- ============================================================= -->
<section class="doc-section">
@@ -845,13 +827,7 @@ Run typecheck to confirm, then patch.</pre></div>
});
});
// Bubble-layout toggle
const bubbleBtn = document.getElementById('toggleBubble');
bubbleBtn.addEventListener('click', () => {
document.body.classList.toggle('bubble-layout');
const on = document.body.classList.contains('bubble-layout');
bubbleBtn.textContent = 'Bubble layout: ' + (on ? 'on' : 'off');
bubbleBtn.classList.toggle('on', on);
});
// Thinking / tool-card click-to-toggle (so the demo feels live)
document.querySelectorAll('.thinking-card-header, .tool-card-header').forEach(h => {
h.addEventListener('click', () => h.parentElement.classList.toggle('open'));