agents-orchestrator/agent-orchestrator
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(electrobun): terminal collapse — tab bar as divider, messages fill freed space

Browse source
This commit is contained in:
Hibryda 2026-03-20 02:36:11 +01:00
parent 3d1cd0028f
commit 9edece0dc7
5 changed files with 75 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

26
ui-electrobun/build/dev-linux-x64/AgentOrchestrator-dev/Resources/app/views/mainview/assets/index-CTw1Ditw.js → ui-electrobun/build/dev-linux-x64/AgentOrchestrator-dev/Resources/app/views/mainview/assets/index-B4yMIAeH.js
View file

File diff suppressed because one or more lines are too long

32
ui-electrobun/build/dev-linux-x64/AgentOrchestrator-dev/Resources/app/views/mainview/assets/index-D6jrqWO6.css Normal file
View file

File diff suppressed because one or more lines are too long

32
ui-electrobun/build/dev-linux-x64/AgentOrchestrator-dev/Resources/app/views/mainview/assets/index-ZExxpdQV.css
View file

File diff suppressed because one or more lines are too long

4
ui-electrobun/build/dev-linux-x64/AgentOrchestrator-dev/Resources/app/views/mainview/index.html
View file

@ -4,8 +4,8 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Svelte App</title>
<script type="module" crossorigin src="/assets/index-CTw1Ditw.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-ZExxpdQV.css">
<script type="module" crossorigin src="/assets/index-B4yMIAeH.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-D6jrqWO6.css">
</head>
<body>
<div id="app"></div>

55
ui-electrobun/src/mainview/TerminalTabs.svelte
View file

@ -60,24 +60,8 @@
}
</script>
<div class="terminal-section" style="--accent: {accent}">
<!-- Terminal panes ABOVE the tab bar — collapse shrinks upward, tab bar stays at bottom -->
<div class="term-panes" class:collapsed>
{#each tabs as tab (tab.id)}
{#if mounted.has(tab.id)}
<div
class="term-pane"
style:display={activeTabId === tab.id ? 'flex' : 'none'}
role="tabpanel"
aria-label={tab.title}
>
<Terminal />
</div>
{/if}
{/each}
</div>
<!-- Tab bar at BOTTOM — slides down as panes collapse -->
<div class="terminal-section" class:collapsed style="--accent: {accent}">
<!-- Tab bar always visible — between agent pane and terminal content -->
<div class="term-section-header">
<button
class="collapse-btn"
@ -97,7 +81,7 @@
stroke-linejoin="round"
aria-hidden="true"
>
<polyline points="6 15 12 9 18 15"/>
<polyline points="6 9 12 15 18 9"/>
</svg>
</button>
@ -133,6 +117,24 @@
>+</button>
</div>
</div>
<!-- Terminal panes — hidden when collapsed, agent pane fills freed space -->
{#if !collapsed}
<div class="term-panes">
{#each tabs as tab (tab.id)}
{#if mounted.has(tab.id)}
<div
class="term-pane"
style:display={activeTabId === tab.id ? 'flex' : 'none'}
role="tabpanel"
aria-label={tab.title}
>
<Terminal />
</div>
{/if}
{/each}
</div>
{/if}
</div>
<style>
@ -144,13 +146,18 @@
background: var(--ctp-crust);
}
/* When collapsed: no terminal height, just the tab bar */
.terminal-section.collapsed {
flex-shrink: 1;
}
/* Section header: collapse + tabs in one row */
.term-section-header {
display: flex;
align-items: stretch;
height: 1.875rem;
background: var(--ctp-mantle);
border-top: 1px solid var(--ctp-surface0);
border-bottom: 1px solid var(--ctp-surface0);
flex-shrink: 0;
position: relative;
z-index: 10;
@ -266,14 +273,8 @@
/* Terminal pane container */
.term-panes {
height: 12rem;
min-height: 0;
min-height: 8rem;
position: relative;
overflow: hidden;
transition: height 0.15s ease;
}
.term-panes.collapsed {
height: 0;
}
.term-pane {