Merge pull request #949 from PintoGideon/Pacs-Preview-Fix

Add a scroll to the text display and preserve carriage returns
FNNDSC · Aug 24, 2023 · 6e81b7d · 6e81b7d
2 parents 1905020 + 76feee9
commit 6e81b7d
Showing 1 changed file with 16 additions and 6 deletions.
diff --git a/src/components/feed/Preview/displays/TextDisplay.tsx b/src/components/feed/Preview/displays/TextDisplay.tsx
@@ -16,7 +16,7 @@ const TextDisplay: React.FunctionComponent<AllProps> = (props: AllProps) => {
         "load",
         () => {
           //@ts-ignore
-          textDisplay.innerHTML = reader.result;
+          textDisplay.innerText = reader.result;
         },
         false
       );
@@ -31,12 +31,22 @@ const TextDisplay: React.FunctionComponent<AllProps> = (props: AllProps) => {
     <Fragment>
       <div
         style={{
-          fontFamily: "monospace",
-          fontSize: "1rem",
-          color: "white",
+          display: "block",
+          padding: "15px",
+          width: "100%",
+          height: "350px",
+          overflowY: "scroll",
         }}
-        id="text-display"
-      ></div>
+      >
+        <span
+          id="text-display"
+          style={{
+            fontFamily: "monospace",
+            fontSize: "1rem",
+            color: "white",
+          }}
+        ></span>
+      </div>
     </Fragment>
   );
 };