ADD: added Bootstrag

webapp/src/components/control/controls.css

@@ -13,7 +13,8 @@ display: grid;
     width: 30%;
 }
 .NameInput{
-    margin: 0 auto;
+    /* margin: 0 auto; */
+    display: flex;
 }
 .EntityinputField{
     /* border: none; */
@@ -27,7 +28,19 @@ display: grid;
 
 .ControlHeader{
 float: left;
-width: 30%;
+width: 50%;
+}
+.ControlLineHeader
+{
+    float: left;
+    width: 100%;
+}
+.LineHeader{
+    display: flex;
+    float: left;
+}
+.sizedSelect{
+    width: 50% !important;
 }
 
 .ControlValues{
@@ -35,7 +48,7 @@ float: left;
 display: contents;
 }
 
-.parent {
+/* .parent {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     grid-template-rows: repeat(3 2em);
@@ -47,5 +60,24 @@ display: contents;
     .div2 { grid-area: 2 / 1 / 3 / 2; }
     .div3 { grid-area: 2 / 2 / 3 / 3; }
     .div4 { grid-area: 3 / 2 / 4 / 3; }
-    .div5 { grid-area: 3 / 1 / 4 / 2; }
+    .div5 { grid-area: 3 / 1 / 4 / 2; } */
+
+
+    .parent {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        grid-template-rows: repeat(6, 2em);
+        grid-column-gap: 0px;
+        grid-row-gap: 0px;
+        }
+        
+    .div1 { grid-area: 1 / 1 / 2 / 4; }
+    .div2 { grid-area: 2 / 1 / 3 / 4; }
+    .div3 { grid-area: 3 / 1 / 4 / 4; }
+    .div4 { grid-area: 4 / 1 / 5 / 4; }
+    .div5 { grid-area: 5 / 1 / 6 / 2; }
+    .div6 { grid-area: 5 / 2 / 6 / 3; }
+    .div7 { grid-area: 6 / 1 / 7 / 2; }
+    .div8 { grid-area: 6 / 2 / 7 / 3; }
+    .div9 { grid-area: 6 / 3 / 7 / 4; }