Sponsor chat: composer grows with the message (up to 45% of the screen) and can be dragged taller

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-13 13:41:18 -05:00
parent 34098e5565
commit b9a70dba1a
3 changed files with 11 additions and 4 deletions
+8 -1
View File
@@ -2149,7 +2149,13 @@
function setChatBadge(n) { const b = $('chatNavBadge'); if (b) { b.hidden = !n; b.textContent = n > 9 ? '9+' : n; } }
function stopPoll() { if (CHAT_POLL) { clearInterval(CHAT_POLL); CHAT_POLL = null; } }
function startPoll() { stopPoll(); CHAT_POLL = setInterval(() => pullThread(false), 4000); }
function autoGrow(el) { el.style.height = 'auto'; el.style.height = Math.min(120, el.scrollHeight) + 'px'; }
// the composer grows with the message up to ~45% of the screen, and keeps any height the member dragged it to (Bradley, 2026-09-13)
function autoGrow(el) {
const cap = Math.max(160, Math.floor(window.innerHeight * 0.45));
const dragged = Number(el.dataset.dragged || 0);
el.style.height = 'auto';
el.style.height = Math.min(cap, Math.max(dragged, el.scrollHeight)) + 'px';
}
function closeDrawer() { stopPoll(); if ($('chatDrawer')) $('chatDrawer').hidden = true; CHAT_OTHER = null; loadDashboard(); }
async function openThreads() {
@@ -2259,6 +2265,7 @@
const inp = $('chatInput');
if (inp) {
inp.addEventListener('input', () => autoGrow(inp));
inp.addEventListener('mouseup', () => { const h = inp.getBoundingClientRect().height; inp.dataset.dragged = h > 60 ? String(Math.round(h)) : ''; });
inp.addEventListener('keydown', e => { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); chatSend(); } });
}
on('qaMsgSponsor', 'click', () => { const q = $('qaMsgSponsor'); if (q.dataset.email) openConvo(q.dataset.email, q.dataset.name || 'your sponsor'); });
+1 -1
View File
@@ -606,7 +606,7 @@ img{max-width:100%}
.chat-day{align-self:center;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin:6px 0}
.chat-banner{padding:8px 14px;border-top:1px solid var(--line);color:var(--muted);font-size:12.5px;background:var(--ground2)}
.chat-compose{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);align-items:flex-end}
.chat-compose textarea{flex:1;resize:none;max-height:120px;background:var(--ground2);border:1px solid var(--line);
.chat-compose textarea{flex:1;resize:vertical;min-height:44px;max-height:45vh;line-height:1.45;background:var(--ground2);border:1px solid var(--line);
border-radius:12px;color:var(--ink);padding:9px 11px;font:400 14px var(--disp)}
.chat-compose .btn{padding:9px 16px}
.chat-msg-btn{margin-left:auto;font-size:12px;padding:3px 10px}