Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2024-12-31 18:18:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

style: improve plot style with colors and position

Browse Source 
This improves the styles surrounding the plot and the input box.
This commit is contained in:
Sylvia Crowe 2024-05-15 14:50:42 -07:00
parent c826d8e840
commit c82bc48aab
2 changed files with 28 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/app/view/plotview.less
View File

@ -0,0 +1,19 @@
.plot-view {
width: 100%;
.plot-window {
display: flex;
justify-content: center;
}
.plot-config {
width: 100%;
margin: 0;
padding: 0;
resize: none;
max-height: 40%;
height: auto;
background-color: var(--panel-bg-color);
color: var(--main-text-color);
}
}

12
frontend/app/view/plotview.tsx
View File

@ -2,6 +2,8 @@ import * as React from "react";
import * as Plot from "@observablehq/plot";
import * as d3 from "d3";
import "./plotview.less";
function PlotWindow() {
return <div className="plot-window"></div>;
}
@ -91,10 +93,14 @@ function PlotView() {
}, [plotDef]);
return (
<div className="plot-block">
ß
<div className="plot-view">
<div className="plot-window" ref={containerRef} />
<textarea className="plot-config" onChange={(e) => setPlotDef(e.target.value)} />
<textarea
className="plot-config"
rows={5}
onChange={(e) => setPlotDef(e.target.value)}
spellCheck={false}
/>
</div>
);
}