bugfix: Terminal width fitting (#329)

* bugfix: Terminal width fitting

* bugfix: Terminal width fitting

* fmt: css codestyle issue presumably from pkg upgrade
This commit is contained in:
James Read 2024-06-02 12:44:23 +01:00 committed by GitHub
parent 238abc95ad
commit ffc17dd73b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 1853 additions and 5441 deletions

View File

@ -71,6 +71,7 @@ export class ExecutionDialog {
this.domOutputDetails.open = false
window.terminal.reset()
window.terminal.fit.fit()
this.domExecutionOutput.hidden = true
}
@ -199,7 +200,9 @@ export class ExecutionDialog {
this.domDatetimeStarted.innerText = res.logEntry.datetimeStarted
window.terminal.reset()
window.terminal.write(res.logEntry.output)
window.terminal.write(res.logEntry.output, () => {
window.terminal.fit.fit()
})
}
renderError (err) {

View File

@ -1,6 +1,7 @@
import './ActionButton.js' // To define action-button
import { ExecutionDialog } from './ExecutionDialog.js'
import { Terminal } from '@xterm/xterm'
import { FitAddon } from '@xterm/addon-fit'
/**
* This is a weird function that just sets some globals.
@ -13,6 +14,10 @@ export function initMarshaller () {
convertEol: true
})
const fitAddon = new FitAddon()
window.terminal.loadAddon(fitAddon)
window.terminal.fit = fitAddon
window.executionDialog = new ExecutionDialog()
window.logEntries = {}

File diff suppressed because it is too large Load Diff

View File

@ -29,6 +29,7 @@
],
"license": "AGPL-3.0-only",
"dependencies": {
"@xterm/xterm": "^5.5.0"
"@xterm/xterm": "^5.5.0",
"@xterm/addon-fit": "^0.10.0"
}
}

View File

@ -453,13 +453,12 @@ div.toolbar * {
}
div.display {
align-content: center;
border: 1px solid #666;
box-shadow: 0 0 6px 0 #aaa;
border-radius: .7em;
display: flex;
align-items: center;
justify-content: center;
place-content: center center;
flex-direction: column;
font-size: small;
}
@ -474,10 +473,6 @@ div.display {
.xterm {
padding: 1em;
margin-bottom: 1em;
margin-left: 1em;
margin-right: 1em;
width: fit-content;
}
@media screen and (width <= 600px) {
@ -513,6 +508,7 @@ div.display {
.xterm {
margin-left: 0;
margin-right: 0;
width: fit-content;
}
}