X-Git-Url: https://osm.etsi.org/gitweb/?a=blobdiff_plain;ds=sidebyside;f=static%2FTopologyComposer%2Fcss%2Fcomposer.css;h=119d2ea712633aa378f3eb1b10896ec204d42f5e;hb=HEAD;hp=ac1977020ace5ae4e52353403ea46181b1e77235;hpb=e6eb7437628e932ef823800b5a8380790a6b22d7;p=osm%2FLW-UI.git

diff --git a/static/TopologyComposer/css/composer.css b/static/TopologyComposer/css/composer.css
index ac19770..119d2ea 100644
--- a/static/TopologyComposer/css/composer.css
+++ b/static/TopologyComposer/css/composer.css
@@ -1,3 +1,8 @@
+line {
+  stroke: rgb(212, 212, 212);
+  stroke-width: 1px;
+  shape-rendering: crispEdges;
+}
 
 .node_path {
     opacity: 1;
@@ -91,7 +96,8 @@
 #graph_editor_container {
     position: relative;
     min-height: 100vh;
-    border-right: 1px solid #AFAFAF;
+
+
     flex: 1 1 auto;
     display: flex;
     align-items: center;
@@ -125,7 +131,54 @@
     margin-right: 10px;
 }
 
+#leftside {
+    border-right: 1px solid #AFAFAF;
+    flex: 0 0 auto;
+    max-width: 300px;
+    min-width: 150px;
+    padding: 20px 30px;
+    display: flex;
+    flex-direction: column;
+}
+
+#palette > .node {
+    margin-top: 10px;
+    font-size: 13px;
+    display: flex;
+    align-items: center;
+    cursor: move;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    background-color: whitesmoke;
+}
+
+#palette > .node:first-child {
+    margin-top: 0;
+}
+
+#palette > .node > .icon {
+    width: 20px;
+    height: 20px;
+    border-radius: 1px;
+    margin-right: 10px;
+}
+
+[draggable=true] {
+    -khtml-user-drag: element;
+    -webkit-user-drag: element;
+    -khtml-user-select: none;
+    -webkit-user-select: none;
+}
+#graph_svg {
+    max-width: 100%;
+    width: 100%;
+}
 #side {
+    border-left: 1px solid #AFAFAF;
     flex: 0 0 auto;
     max-width: 500px;
     min-width: 300px;
@@ -174,4 +227,8 @@
     padding-left: 0;
     font-weight: 500;
     text-align: right
+}
+
+.left-tool-bar-monitoring > .btn-default {
+    background-color: transparent!important;
 }
\ No newline at end of file