improve customer selection layout

Author: burdoto

src/main/resources/static/style.css

@@ -164,26 +164,30 @@ body {
     background-color: var(--button-hover-background-color);
 }
 
+.ui-select-big {
+    width: 30%;
+}
+
 .minor {
     font-size: 90%;
 }
 
 .ui-panel-1 {
-    border: 5px groove #1c1c1c;
-    padding: 0 15px 15px;
-    margin-bottom: 10px;
+    border: 5px groove #aaa;
+    padding: 15px;
+    margin: 7px 0;
 }
 
 .ui-panel-2 {
-    border: 3px groove grey;
-    padding: 0 10px 10px;
-    margin-bottom: 7px;
+    border: 3px groove #bbb;
+    padding: 10px;
+    margin: 5px 0;
 }
 
 .ui-panel-3 {
-    border: 1.5px groove lightgrey;
-    padding: 0 5px 5px;
-    margin-bottom: 5px;
+    border: 1.5px groove #ccc;
+    padding: 5px;
+    margin: 3px 0;
 }
 
 /* utility components */

src/main/resources/templates/timetable/create_entry.html

@@ -6,10 +6,14 @@
 <div class="ui-menubar" th:insert="~{/layout/menubar}"></div>
 <form class="ui-panel-1">
     <div class="ui-panel-2">
-        <label for="input-customerName">Kunde</label>
-        <select id="input-customerName" name="customerName" onchange="populateDepartmentNames()" required size="8"></select>
-        <label for="input-departmentName">Abteilung</label>
-        <select id="input-departmentName" name="departmentName" required size="8"></select>
+        <label for="input-customerName">Kunde</label> & <label for="input-departmentName">Abteilung</label>
+        <br/>
+        <select class="ui-select-big" id="input-customerName" name="customerName" onchange="populateDepartmentNames()" required size="8">
+            <option>- wird geladen -</option>
+        </select>
+        <select class="ui-select-big" id="input-departmentName" name="departmentName" required size="8">
+            <option>- bitte Kunde wählen -</option>
+        </select>
     </div>
     <div class="ui-panel-2">
         <label for="input-startTime">Anfang</label>
@@ -21,7 +25,8 @@
     </div>
     <div class="ui-panel-2">
         <label for="input-notes">Beschreibung</label>
-        <input id="input-notes" name="notes" type="text">
+        <br/>
+        <textarea cols="80" id="input-notes" name="notes" rows="5"></textarea>
     </div>
     <input onclick="submitCreateEntry()" type="submit">
 </form>