Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2025-01-22 21:42:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

fade in the ...

Browse Source
This commit is contained in:
sawka 2023-02-23 23:36:35 -08:00
parent b415af4772
commit 132c0dacde
2 changed files with 24 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/main.tsx
View File

@ -2653,7 +2653,7 @@ class ScreenWindowView extends React.Component<{sw : ScreenWindow}, {}> {
return {position: "absolute", width: "100%", height: "100%", overflowX: "hidden"};
}
renderError(message : string) {
renderError(message : string, fade : boolean) {
let {sw} = this.props;
return (
<div className="window-view" style={this.getWindowViewStyle()} ref={this.windowViewRef} data-windowid={sw.windowId}>
@ -2661,7 +2661,7 @@ class ScreenWindowView extends React.Component<{sw : ScreenWindow}, {}> {
<span>{sw.name.get()}</span>
</div>
<div key="lines" className="lines"></div>
<div key="window-empty" className="window-empty">
<div key="window-empty" className={cn("window-empty", {"should-fade": fade})}>
<div>{message}</div>
</div>
</div>
@ -2672,13 +2672,13 @@ class ScreenWindowView extends React.Component<{sw : ScreenWindow}, {}> {
let {sw} = this.props;
let win = this.getWindow();
if (win == null || !win.loaded.get()) {
return this.renderError("(loading)");
return this.renderError("...", true);
}
if (win.loadError.get() != null) {
return this.renderError(sprintf("(%s)", win.loadError.get()));
return this.renderError(sprintf("(%s)", win.loadError.get()), false);
}
if (this.width.get() == 0) {
return this.renderError("");
return this.renderError("", false);
}
let idx = 0;
let line : LineType = null;

19
src/sh2.less
View File

@ -120,6 +120,11 @@ body::-webkit-scrollbar {
background-color: black;
color: #4e9a06;
}
&.should-fade {
opacity: 0;
animation: fade-in 2.5s;
}
}
}
}
@ -1987,3 +1992,17 @@ input[type=checkbox] {
transform: rotate(360deg);
}
}
@keyframes fade-in {
0% {
opacity: 0;
}
80% {
opacity: 0;
}
100% {
opacity: 1;
}
}