better presentation

js_native/lxplan_lib_builder.html

@@ -14,6 +14,10 @@
             color: #ddd;
         }
 
+h3 {
+    border-top: 1px solid grey;
+}
+
         .container {
             border: 1px solid #777;
             border-radius: 5px;
@@ -27,7 +31,8 @@
             margin: 10px 0;
         }
 
-        button {
+        button,
+        input[type="file"] {
             padding: 8px 16px;
             background-color: #007BFF;
             color: white;
@@ -64,12 +69,23 @@
         }
 
         input[type="text"],
+        input[type="number"],
         select {
             flex: 1;
             padding: 8px;
             border: 1px solid #ccc;
             border-radius: 4px;
             background-color: #bbbaba;
+            color: black;
+            font-weight: bold;
+        }
+
+        input[type="number"] {
+            background-color: #111;
+            color: #aaa;
+            border: none;
+            text-align: center;
+            font-size: 1em;
         }
 
         #optionalFields details {
@@ -84,6 +100,16 @@
             font-weight: bold;
         }
 
+        .custom-number-input::after {
+            content: "⌄";
+            position: absolute;
+            right: 8px;
+            top: 50%;
+            transform: translateY(-50%);
+            pointer-events: none;
+            color: #999;
+        }
+
         #saveButton {
             background-color: #4CAF50;
             color: white;