From df68db271f23561671a59b1678c39b8ee54cd8e4 Mon Sep 17 00:00:00 2001
From: Ted Humphrey <Thomas.Humphrey@att.com>
Date: Thu, 16 Apr 2020 17:36:17 +0000
Subject: Minor UI fixes for dialogues and Tosca upload feature

Issue-ID: CLAMP-587
Change-Id: I683b62fbd0b15ab5db18c7e1e941ff8cb58cb0f3
Signed-off-by: Ted Humphrey <Thomas.Humphrey@att.com>
---
 ui-react/src/components/loop_viewer/svg/LoopSvg.js         | 14 ++++++++++----
 .../loop_viewer/svg/__snapshots__/LoopSvg.test.js.snap     |  6 +++---
 2 files changed, 13 insertions(+), 7 deletions(-)

(limited to 'ui-react/src/components/loop_viewer')

diff --git a/ui-react/src/components/loop_viewer/svg/LoopSvg.js b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
index 4bbf608d..048f6304 100644
--- a/ui-react/src/components/loop_viewer/svg/LoopSvg.js
+++ b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
@@ -27,14 +27,20 @@ import { withRouter } from "react-router-dom";
 import LoopService from '../../../api/LoopService';
 import LoopComponentConverter from './LoopComponentConverter';
 
-const LoopViewSvgDivStyled = styled.div`
-	overflow: hidden;
+const LoopViewSvgDivStyled = styled.svg`
+	display: flex;
+	flex-direction: row;
+	overflow-x: scroll;
 	background-color: ${props => (props.theme.loopViewerBackgroundColor)};
 	border: 1px solid;
 	border-color: ${props => (props.theme.loopViewerHeaderColor)};
+	margin-top: 1em;
 	margin-left: auto;
 	margin-right:auto;
-	text-align: center;
+	margin-bottom: -3em;
+	align-items: center;
+	height: 100%;
+	width: 100%;
 
 `
 
@@ -101,4 +107,4 @@ class LoopViewSvg extends React.Component {
 	}
 }
 
-export default withRouter(LoopViewSvg);
\ No newline at end of file
+export default withRouter(LoopViewSvg);
diff --git a/ui-react/src/components/loop_viewer/svg/__snapshots__/LoopSvg.test.js.snap b/ui-react/src/components/loop_viewer/svg/__snapshots__/LoopSvg.test.js.snap
index cecfb425..e05f1c79 100644
--- a/ui-react/src/components/loop_viewer/svg/__snapshots__/LoopSvg.test.js.snap
+++ b/ui-react/src/components/loop_viewer/svg/__snapshots__/LoopSvg.test.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Verify LoopSvg Test the render method 1`] = `
-<styled.div
+<styled.svg
   dangerouslySetInnerHTML={
     Object {
       "__html": "<svg><text x=\\"20\\" y=\\"40\\">No LOOP (SVG)</text></svg>",
@@ -12,7 +12,7 @@ exports[`Verify LoopSvg Test the render method 1`] = `
 `;
 
 exports[`Verify LoopSvg Test the render method no loopName 1`] = `
-<styled.div
+<styled.svg
   dangerouslySetInnerHTML={
     Object {
       "__html": "<svg><text x=\\"20\\" y=\\"40\\">No LOOP (SVG)</text></svg>",
@@ -23,7 +23,7 @@ exports[`Verify LoopSvg Test the render method no loopName 1`] = `
 `;
 
 exports[`Verify LoopSvg Test the render method svg not empty 1`] = `
-<styled.div
+<styled.svg
   dangerouslySetInnerHTML={
     Object {
       "__html": "<svg><text test</text></svg>",
-- 
cgit 1.2.3-korg