From b9790b161994e2aa62215eb33ecd673abd845457 Mon Sep 17 00:00:00 2001
From: mic <m@micz.it>
Date: Mon, 13 May 2024 23:55:41 +0200
Subject: [PATCH] working on new prompt form. see #12

---
 customprompts/mzta-custom-prompts.css  | 26 +++++++--
 customprompts/mzta-custom-prompts.html | 80 ++++++++++++++++----------
 2 files changed, 69 insertions(+), 37 deletions(-)

diff --git a/customprompts/mzta-custom-prompts.css b/customprompts/mzta-custom-prompts.css
index b38ad9a6..55bf97f5 100644
--- a/customprompts/mzta-custom-prompts.css
+++ b/customprompts/mzta-custom-prompts.css
@@ -7,11 +7,11 @@
         background-color: #ffffff; 
     }
 
-    table tr:nth-child(even) {
+    table.prompts_list tr:nth-child(even) {
         background-color: #e9e9e9;
     }
 
-    table tr:nth-child(odd) {
+    table.prompts_list tr:nth-child(odd) {
         background-color: #f3f3f3;
     }
 }
@@ -33,7 +33,7 @@
         border: 1px solid #ccc;
     }
 
-    table th {
+    table.prompts_list th {
         background-color: #4c4e58;
         border: 1px solid rgb(251, 251, 254);
         color: rgb(194, 194, 194);
@@ -43,7 +43,7 @@
         background-color: inherit; 
     }
 
-    table tr:nth-child(even) {
+    table.prompts_list tr:nth-child(even) {
         background-color: #2E2F36;
     }
 }
@@ -83,7 +83,7 @@ table tr {
     border-bottom: 1px solid #ccc;
 }
 
-table th {
+table.prompts_list th {
     padding: 8px;
     text-align: left;
     cursor: pointer;
@@ -94,7 +94,7 @@ table td {
     padding: 8px;
 }
 
-table td.properties{
+table.prompts_list td.properties{
     white-space: nowrap;
 }
 
@@ -104,9 +104,23 @@ table td.properties{
 
 #formNew{
     display: none;
+    width: 100%;
 }
 
 .text_output{
     width: 100%;
     height: 9em;
+}
+
+.go_right{
+    float: right;
+}
+
+.width_all{
+    width: 100%;
+}
+
+.small_label{
+    font-size: small;
+    font-style: italic;
 }
\ No newline at end of file
diff --git a/customprompts/mzta-custom-prompts.html b/customprompts/mzta-custom-prompts.html
index cfff87cc..4f82f659 100644
--- a/customprompts/mzta-custom-prompts.html
+++ b/customprompts/mzta-custom-prompts.html
@@ -16,41 +16,59 @@
       <button id="btnNew">__MSG_customPrompts_btnNew__</button>
     </div>
     <div id="formNew">
-        <label for="txtIdNew">*__MSG_customPrompts_form_label_ID__:</label>
-        <input type="text" id="txtIdNew" name="id" class="input_new"> [__MSG_customPrompts_form_label_ID_rules__]
-        <br>
-        <label for="txtNameNew">*__MSG_customPrompts_form_label_Name__:</label>
-        <input type="text" id="txtNameNew" name="name" class="input_new">
-        <br>
-        <label for="txtTextNew">*__MSG_customPrompts_form_label_Text__:</label>
-        <textarea id="txtTextNew" name="text" class="input_new"></textarea>
-        <br>
-        <label for="selectTypeNew">__MSG_customPrompts_add_to_menu__:</label>
-        <select id="selectTypeNew" name="type">
-          <option value="0">__MSG_customPrompts_add_to_menu_always__</option>
-          <option value="1">__MSG_customPrompts_add_to_menu_reading__</option>
-          <option value="2">__MSG_customPrompts_add_to_menu_composing__</option>
-        </select>
-        <br>
-        <label for="selectActionNew">__MSG_customPrompts_form_label_Action__:</label>
-        <select id="selectActionNew" name="action">
-          <option value="0">__MSG_customPrompts_close_button__</option>
-          <option value="1">__MSG_customPrompts_do_reply__</option>
-          <option value="2">__MSG_customPrompts_substitute_text__</option>
-        </select>
-        <br>
-        <input type="checkbox" id="checkboxNeedSelectedNew" name="need_selected" value="1"> <label for="checkboxNeedSelectedNew">__MSG_customPrompts_form_label_need_selected__</label>
-        <br>
-        <input type="checkbox" id="checkboxNeedSignatureNew" name="need_signature" value="1"> <label for="checkboxNeedSignatureNew">__MSG_customPrompts_form_label_need_signature__</label>
-        <br>
-        <input type="checkbox" id="checkboxNeedCustomTextNew" name="need_custom_text" value="1"> <label for="checkboxNeedCustomTextNew">__MSG_customPrompts_form_label_need_custom_text__</label>
-        <br>
-        * __MSG_customPrompts_form_required_fields__.
+      <table class="width_all">
+        <tr>
+            <td>
+                <label for="txtIdNew">*__MSG_customPrompts_form_label_ID__:</label>
+                <br>
+                <input type="text" id="txtIdNew" name="id" class="input_new">
+                <br><span class="small_label">[__MSG_customPrompts_form_label_ID_rules__]</span>                
+            </td>
+            <td rowspan="2">
+                <label for="txtTextNew">*__MSG_customPrompts_form_label_Text__:</label>
+                <br>
+                <textarea id="txtTextNew" name="text" class="input_new text_output"></textarea>
+            </td>
+            <td>
+                <label for="selectTypeNew">__MSG_customPrompts_add_to_menu__:</label>
+                <br>
+                <select id="selectTypeNew" name="type">
+                    <option value="0">__MSG_customPrompts_add_to_menu_always__</option>
+                    <option value="1">__MSG_customPrompts_add_to_menu_reading__</option>
+                    <option value="2">__MSG_customPrompts_add_to_menu_composing__</option>
+                </select>
+            </td>
+            <td rowspan="2">
+                <input type="checkbox" id="checkboxNeedSelectedNew" name="need_selected" value="1"> <label for="checkboxNeedSelectedNew">__MSG_customPrompts_form_label_need_selected__</label>
+                <br>
+                <input type="checkbox" id="checkboxNeedSignatureNew" name="need_signature" value="1"> <label for="checkboxNeedSignatureNew">__MSG_customPrompts_form_label_need_signature__</label>
+                <br>
+                <input type="checkbox" id="checkboxNeedCustomTextNew" name="need_custom_text" value="1"> <label for="checkboxNeedCustomTextNew">__MSG_customPrompts_form_label_need_custom_text__</label>
+            </td>
+        </tr>
+        <tr>
+            <td>
+              <label for="txtNameNew">*__MSG_customPrompts_form_label_Name__:</label>
+              <br>
+              <input type="text" id="txtNameNew" name="name" class="input_new">
+            </td>
+            <td>
+              <label for="selectActionNew">__MSG_customPrompts_form_label_Action__:</label>
+              <br>
+              <select id="selectActionNew" name="action">
+                  <option value="0">__MSG_customPrompts_close_button__</option>
+                  <option value="1">__MSG_customPrompts_do_reply__</option>
+                  <option value="2">__MSG_customPrompts_substitute_text__</option>
+              </select>
+            </td>
+        </tr>
+    </table>
+        <div class="go_right">* __MSG_customPrompts_form_required_fields__.</div>
         <br>
         <button id="btnAddNew" disabled>__MSG_customPrompts_btnAddNewCommit__</button>
     </div>
     <div id="all_prompts">
-        <table>
+        <table class="prompts_list">
             <thead>
               <tr>
                 <th class="sort" data-sort="id">__MSG_customPrompts_form_label_ID__</th>