Make input and output panes vertically scrollable

This commit is contained in:
Nilay Majorwar 2022-02-18 21:11:03 +05:30
parent f0408b4024
commit 79775ad56c
2 changed files with 21 additions and 10 deletions

View File

@ -27,15 +27,24 @@ const InputEditorComponent = (
);
return (
<TextArea
fill
large
growVertically
inputRef={textareaRef}
readOnly={props.readOnly}
placeholder="Enter program input here..."
style={{ height: "100%", resize: "none", boxShadow: "none" }}
/>
<div style={{ height: "100%" }}>
<TextArea
fill
large
growVertically
inputRef={textareaRef}
readOnly={props.readOnly}
placeholder="Enter program input here..."
style={{
resize: "none",
boxShadow: "none",
// BlueprintJS edits the element's height directly as px which leads
// to overflow and underflow issues, so we 1-up it with our own weapons.
maxHeight: "100%",
minHeight: "100%",
}}
/>
</div>
);
};

View File

@ -66,7 +66,9 @@ const OutputViewerComponent = (_: {}, ref: React.Ref<OutputViewerRef>) => {
}));
return (
<div style={{ padding: 10, fontSize: 16 }}>
<div
style={{ height: "100%", padding: 10, fontSize: 16, overflowY: "auto" }}
>
<pre
style={{ margin: 0, whiteSpace: "pre-wrap", wordWrap: "break-word" }}
>