html/ui.js,ui.css : Initial CSS implementation.

html/uiTest/css/ui.css

@@ -1,4 +1,7 @@
 
+body {
+    background-color: LightCyan;
+}
 
 .title_disconnected {
     color: red;
@@ -7,3 +10,58 @@
 .title_connected {
     color: green;
 }
+
+input, label, button, select {
+    font-family: sans-serif;
+    font-size: 10px;
+    height: 20px;
+}
+
+
+div {
+    /*border: 1px solid black;    */
+    background-color: LightSteelBlue;
+}
+
+div p {
+    font-family: sans-serif;
+    font-size: 12px;
+    margin-top: 2px;
+    margin-bottom: 2px;
+    background-color: LightSteelBlue;
+}
+
+label {
+    /*border: 1px solid red;*/
+    width: 50px;
+    padding-left: 10px;
+    margin-top: 3px;
+}
+
+
+.uiCtlDiv {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    background-color: LightBlue;
+}
+
+.uiCtlDiv input {
+    background-color: PowderBlue;
+}
+
+.uiNumberDiv input {
+    width: 50px;
+}
+
+.panel {
+    background-color: LightBlue;
+}
+.row  {
+    
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    background-color: LightBlue;
+}
+

html/uiTest/js/ui.js

@@ -301,7 +301,7 @@ function ui_create_ctl( parent_ele, ele_type, label, d, dfltEleClassName )
     // create an enclosing div
     var div_ele = dom_create_ele("div");
 
-    div_ele.className = dfltEleClassName + "Div"
+    div_ele.className = "uiCtlDiv " + dfltEleClassName + "Div"
 
     parent_ele.appendChild( div_ele );
     
@@ -317,7 +317,7 @@ function ui_create_ctl( parent_ele, ele_type, label, d, dfltEleClassName )
 	div_ele.appendChild(label_ele)    
     }
 
-    return ui_create_ele( label_ele, ele_type, d, dfltEleClassName );
+    return ui_create_ele( div_ele, ele_type, d, dfltEleClassName );
 }
 
 function ui_set_class_name( ele, d, dfltClassName )
@@ -336,12 +336,15 @@ function ui_create_div( parent_ele, d )
 
     if( div_ele != null )
     {
-	var p_ele = dom_create_ele("p")
 	
 	if( d.title != null && d.title.length > 0 )
+	{
+	    var p_ele = dom_create_ele("p")
+	    
 	    p_ele.innerHTML = d.title
 	
-	div_ele.appendChild( p_ele )
+	    div_ele.appendChild( p_ele )
+	}
     }
     
     return div_ele;

html/uiTest/ui.cfg

@@ -6,14 +6,14 @@
   div: {
 
     name: "panelDivId",
-    className: "myPanelClass",
+    className: "panel",
     title: "My resource based panel",
-    
-    children: {
 
-        button:{ name: myBtn1Id,   title:"Push Me"  },
+    div: {
-    	check:{  name: myCheck1Id, title:"Check Me" },
+    	 className: "row",
+         button:{ name: myBtn1Id,   title:"Push Me"  },
+    	 check:{  name: myCheck1Id, title:"Check Me" },
+	}
     
-    }
   }
 }