mirror of
https://github.com/wavetermdev/waveterm.git
synced 2025-01-21 21:32:13 +01:00
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:
parent
0c9084364c
commit
9d347ae08c
@ -607,6 +607,11 @@ class LineCmd extends React.Component<
|
|||||||
}
|
}
|
||||||
let rendererType = lineutil.getRendererType(line);
|
let rendererType = lineutil.getRendererType(line);
|
||||||
let hidePrompt = rendererPlugin != null && rendererPlugin.hidePrompt;
|
let hidePrompt = rendererPlugin != null && rendererPlugin.hidePrompt;
|
||||||
|
let termFontSize = GlobalModel.termFontSize.get();
|
||||||
|
let rtnStateDiffSize = termFontSize - 2;
|
||||||
|
if (rtnStateDiffSize < 10) {
|
||||||
|
rtnStateDiffSize = Math.max(termFontSize, 10);
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={mainDivCn}
|
className={mainDivCn}
|
||||||
@ -701,8 +706,8 @@ class LineCmd extends React.Component<
|
|||||||
<div className="cmd-rtnstate-label">state unchanged</div>
|
<div className="cmd-rtnstate-label">state unchanged</div>
|
||||||
</If>
|
</If>
|
||||||
<If condition={rsdiff != null && rsdiff != ""}>
|
<If condition={rsdiff != null && rsdiff != ""}>
|
||||||
<div className="cmd-rtnstate-label">new state</div>
|
<div className="cmd-rtnstate-label" style={{fontSize: rtnStateDiffSize-1}}>new state</div>
|
||||||
<div className="cmd-rtnstate-diff">{this.rtnStateDiff.get()}</div>
|
<div className="cmd-rtnstate-diff" style={{fontSize: rtnStateDiffSize}}>{this.rtnStateDiff.get()}</div>
|
||||||
</If>
|
</If>
|
||||||
</div>
|
</div>
|
||||||
</If>
|
</If>
|
||||||
|
@ -82,6 +82,7 @@
|
|||||||
.meta.meta-line1 {
|
.meta.meta-line1 {
|
||||||
margin-left: 2px;
|
margin-left: 2px;
|
||||||
color: rgba(@base-color, 0.6) !important;
|
color: rgba(@base-color, 0.6) !important;
|
||||||
|
font-size: 11px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.has-rtnstate .terminal-wrapper {
|
&.has-rtnstate .terminal-wrapper {
|
||||||
@ -129,19 +130,23 @@
|
|||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
.cmd-rtnstate-label {
|
.cmd-rtnstate-label {
|
||||||
|
font-family: @terminal-font;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
margin: 6px 0 -2px 10px;
|
margin: 6px 0 -2px 10px;
|
||||||
padding: 2px 5px 2px 5px;
|
padding: 2px 5px 2px 0px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cmd-rtnstate-diff {
|
.cmd-rtnstate-diff {
|
||||||
|
font-family: @terminal-font;
|
||||||
color: @term-white;
|
color: @term-white;
|
||||||
white-space: pre;
|
white-space: pre;
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
|
font-size: 11px;
|
||||||
|
line-height: 1.2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -174,6 +179,9 @@
|
|||||||
|
|
||||||
&.line-simple {
|
&.line-simple {
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
|
font-size: 11px;
|
||||||
|
line-height: 1.2;
|
||||||
|
color: rgba(@base-color, 0.6);
|
||||||
|
|
||||||
.ts {
|
.ts {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -294,7 +302,7 @@
|
|||||||
|
|
||||||
&.status-error {
|
&.status-error {
|
||||||
.status-icon {
|
.status-icon {
|
||||||
color: #cc0000;
|
color: @error-red;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -328,6 +336,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
|
line-height: 1.2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.meta {
|
.meta {
|
||||||
|
@ -150,7 +150,8 @@ class TerminalRenderer extends React.Component<
|
|||||||
.get();
|
.get();
|
||||||
let cmd = screen.getCmd(line); // will not be null
|
let cmd = screen.getCmd(line); // will not be null
|
||||||
let usedRows = screen.getUsedRows(lineutil.getRendererContext(line), line, cmd, width);
|
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();
|
let termLoaded = this.termLoaded.get();
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
|
Loading…
Reference in New Issue
Block a user