Minor UI fixes for dialogues and Tosca upload feature

[clamp.git] / ui-react / src / components / loop_viewer / svg / LoopSvg.js

diff --git a/ui-react/src/components/loop_viewer/svg/LoopSvg.js b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
index bb4b6d0..048f630 100644 (file)
--- a/ui-react/src/components/loop_viewer/svg/LoopSvg.js
+++ b/ui-react/src/components/loop_viewer/svg/LoopSvg.js
@@ -23,18 +23,24 @@
 import React from 'react';
 import styled from 'styled-components';
 import LoopCache from '../../../api/LoopCache';
-import { withRouter } from "react-router";
+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%;
 
 `
 
@@ -55,17 +61,14 @@ class LoopViewSvg extends React.Component {
                this.state.loopCache = props.loopCache;
                this.state.componentModalMapping = LoopComponentConverter.buildMapOfComponents(props.loopCache);
                this.getSvg(props.loopCache.getLoopName());
-               console.log("!!!!!!!!!!!!!!!!!!!!!!!!:"+this.state.componentModalMapping);
        }
 
        shouldComponentUpdate(nextProps, nextState) {
                return this.state.svgContent !== nextState.svgContent;
        }
 
-       componentWillReceiveProps(newProps) {   
-       console.log("!!!!!!!!!!!!!!!!!!!!!!!!");
+       componentWillReceiveProps(newProps) {
                if (this.state.loopCache !== newProps.loopCache) {
-               console.log("!!!!!!!!!!!!!!!!!!!!!!!!changed");
                        this.setState({
                                loopCache: newProps.loopCache,
                                componentModalMapping: LoopComponentConverter.buildMapOfComponents(newProps.loopCache)
@@ -104,4 +107,4 @@ class LoopViewSvg extends React.Component {
        }
 }
 
-export default withRouter(LoopViewSvg);
\ No newline at end of file
+export default withRouter(LoopViewSvg);