fix: subagent dropdown hidden by overflow:hidden parent

The dropdown was being clipped by .session-tabs overflow-y:auto.
Changed from position:absolute to position:fixed and calculate
position dynamically in JS using getBoundingClientRect().

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
arkon
2026-01-26 02:38:55 +01:00
co-authored by Claude Opus 4.5
parent f9ffe17c3e
commit 464c4c479d
2 changed files with 10 additions and 8 deletions
+7 -1
View File
@@ -1857,11 +1857,17 @@ class ClaudemanApp {
document.querySelectorAll('.subagent-dropdown.open').forEach(d => d.classList.remove('open')); document.querySelectorAll('.subagent-dropdown.open').forEach(d => d.classList.remove('open'));
if (!isOpen) { if (!isOpen) {
// Position the dropdown using fixed positioning
const rect = badgeEl.getBoundingClientRect();
dropdown.style.top = `${rect.bottom + 4}px`;
dropdown.style.left = `${rect.left + rect.width / 2}px`;
dropdown.style.transform = 'translateX(-50%)';
dropdown.classList.add('open'); dropdown.classList.add('open');
// Close dropdown when clicking outside // Close dropdown when clicking outside
const closeHandler = (e) => { const closeHandler = (e) => {
if (!badgeEl.contains(e.target)) { if (!badgeEl.contains(e.target) && !dropdown.contains(e.target)) {
dropdown.classList.remove('open'); dropdown.classList.remove('open');
document.removeEventListener('click', closeHandler); document.removeEventListener('click', closeHandler);
} }
+3 -7
View File
@@ -2961,24 +2961,20 @@ kbd {
color: var(--accent-hover); color: var(--accent-hover);
} }
/* Subagent Dropdown */ /* Subagent Dropdown - uses fixed positioning to escape overflow:hidden parents */
.subagent-dropdown { .subagent-dropdown {
display: none; display: none;
position: absolute; position: fixed;
top: calc(100% + 4px);
left: 50%;
transform: translateX(-50%);
min-width: 220px; min-width: 220px;
max-width: 320px; max-width: 320px;
background: var(--bg-card); background: var(--bg-card);
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 8px; border-radius: 8px;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
z-index: 1000; z-index: 10000;
overflow: hidden; overflow: hidden;
} }
.tab-subagent-badge:hover .subagent-dropdown,
.subagent-dropdown.open { .subagent-dropdown.open {
display: block; display: block;
} }