design.estate/dees-catalog
3
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(appdash): use banner height CSS variable for terminal layout and expose terminal resize handling

Browse Source
This commit is contained in:
Jürgen Kunz
2026-04-02 19:13:31 +00:00
parent c0ac8f593a
commit c13f319474
4 changed files with 13 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
ts_web/elements/00group-simple/dees-simple-appdash/dees-simple-appdash.ts
View File

@@ -644,11 +644,6 @@ export class DeesSimpleAppDash extends DeesElement {
const maincontainer = this.shadowRoot?.querySelector('.maincontainer') as HTMLElement;
const height = bannerArea ? bannerArea.offsetHeight : 0;
maincontainer?.style.setProperty('--banner-area-height', `${height}px`);
// Keep terminal in sync with banner height
if (this.currentTerminal) {
this.currentTerminal.style.top = `${height}px`;
}
});
}
@@ -710,11 +705,9 @@ export class DeesSimpleAppDash extends DeesElement {
terminal.setupCommand = this.terminalSetupCommand;
this.currentTerminal = terminal;
maincontainer.appendChild(terminal);
const bannerArea = this.shadowRoot?.querySelector('.messageBannerArea') as HTMLElement;
const bannerHeight = bannerArea ? bannerArea.offsetHeight : 0;
terminal.style.position = 'absolute';
terminal.style.zIndex = '10';
terminal.style.top = `${bannerHeight}px`;
terminal.style.top = 'var(--banner-area-height, 0px)';
terminal.style.left = '240px';
terminal.style.right = '0px';
terminal.style.bottom = '24px';
@@ -722,8 +715,6 @@ export class DeesSimpleAppDash extends DeesElement {
terminal.style.transform = 'translateY(8px) scale(0.99)';
terminal.style.transition = 'all 0.25s cubic-bezier(0.4, 0, 0.2, 1)';
terminal.style.boxShadow = '0 25px 50px -12px rgb(0 0 0 / 0.5), 0 0 0 1px rgb(255 255 255 / 0.05)';
terminal.style.maxWidth = `calc(${maincontainer.clientWidth}px - 240px)`;
terminal.style.maxHeight = `calc(${maincontainer.clientHeight}px - 24px - ${bannerHeight}px)`;
// Add close button to terminal
terminal.addEventListener('close', () => this.closeTerminal());

8
ts_web/elements/00group-workspace/dees-workspace-terminal/dees-workspace-terminal.ts
View File

@@ -106,11 +106,11 @@ export class DeesWorkspaceTerminal extends DeesElement {
css`
:host {
background: ${cssManager.bdTheme('#ffffff', '#000000')};
position: absolute;
height: 100%;
width: 100%;
display: flex;
flex-direction: row;
box-sizing: border-box;
height: 100%;
width: 100%;
}
* {
@@ -596,7 +596,7 @@ export class DeesWorkspaceTerminal extends DeesElement {
tab.terminal.focus();
}
private handleResize(): void {
public handleResize(): void {
if (this.activeTabId) {
const tab = this.tabManager.getTab(this.activeTabId);
if (tab) {