fix some cmd typography. rtnstate, rtnstate diff, descenders on last line of terminal, lineheight, smaller info line, simple-rendering, etc.

This commit is contained in:
sawka 2023-10-12 12:10:50 -07:00
parent 0c9084364c
commit 9d347ae08c
3 changed files with 20 additions and 5 deletions

View File

@ -607,6 +607,11 @@ class LineCmd extends React.Component<
}
let rendererType = lineutil.getRendererType(line);
let hidePrompt = rendererPlugin != null && rendererPlugin.hidePrompt;
let termFontSize = GlobalModel.termFontSize.get();
let rtnStateDiffSize = termFontSize - 2;
if (rtnStateDiffSize < 10) {
rtnStateDiffSize = Math.max(termFontSize, 10);
}
return (
<div
className={mainDivCn}
@ -701,8 +706,8 @@ class LineCmd extends React.Component<
<div className="cmd-rtnstate-label">state unchanged</div>
</If>
<If condition={rsdiff != null && rsdiff != ""}>
<div className="cmd-rtnstate-label">new state</div>
<div className="cmd-rtnstate-diff">{this.rtnStateDiff.get()}</div>
<div className="cmd-rtnstate-label" style={{fontSize: rtnStateDiffSize-1}}>new state</div>
<div className="cmd-rtnstate-diff" style={{fontSize: rtnStateDiffSize}}>{this.rtnStateDiff.get()}</div>
</If>
</div>
</If>

View File

@ -82,6 +82,7 @@
.meta.meta-line1 {
margin-left: 2px;
color: rgba(@base-color, 0.6) !important;
font-size: 11px;
}
&.has-rtnstate .terminal-wrapper {
@ -129,19 +130,23 @@
position: relative;
.cmd-rtnstate-label {
font-family: @terminal-font;
position: relative;
z-index: 2;
margin: 6px 0 -2px 10px;
padding: 2px 5px 2px 5px;
padding: 2px 5px 2px 0px;
display: inline-block;
font-size: 0.8em;
opacity: 0.5;
}
.cmd-rtnstate-diff {
font-family: @terminal-font;
color: @term-white;
white-space: pre;
margin-left: 15px;
font-size: 11px;
line-height: 1.2;
}
}
}
@ -174,6 +179,9 @@
&.line-simple {
flex-direction: row;
font-size: 11px;
line-height: 1.2;
color: rgba(@base-color, 0.6);
.ts {
display: flex;
@ -294,7 +302,7 @@
&.status-error {
.status-icon {
color: #cc0000;
color: @error-red;
}
}
@ -328,6 +336,7 @@
display: flex;
flex-direction: column;
justify-content: flex-start;
line-height: 1.2;
}
.meta {

View File

@ -150,7 +150,8 @@ class TerminalRenderer extends React.Component<
.get();
let cmd = screen.getCmd(line); // will not be null
let usedRows = screen.getUsedRows(lineutil.getRendererContext(line), line, cmd, width);
let termHeight = termHeightFromRows(usedRows, GlobalModel.termFontSize.get());
// TODO: replace the +2 with some calculation based on termFontSize. the +2 is for descenders, which get cut off without this.
let termHeight = termHeightFromRows(usedRows, GlobalModel.termFontSize.get()) + 2;
let termLoaded = this.termLoaded.get();
return (
<div