- added form fields calculation and new table calculationl tested in preview;

src/assets/scss/components/appForm.scss

@@ -59,11 +59,8 @@
 
   &.table, &.criteria_table {
     div.addNewTableRow {
-      width: 100%;
       text-align: center;
-      padding: 5px 0;
-      background: var(--table-border-color);
-      color: var(--primary-text);
+      justify-content: center;
 
       &:hover {
         cursor: pointer;
@@ -99,14 +96,12 @@
       min-width: 120px;
       input {
         width: 100%;
-        padding: 3px 5px;
       }
     }
 
-    tfoot td,
-    tfoot th {
+    tfoot td {
+      border-top: 1px solid var(--table-border-color);
       border-top: 1px solid var(--table-border-color);
-      border-bottom: 0
     }
 
     table.striped tbody tr:nth-child(odd) td,

src/assets/scss/components/formBuilder.scss

@@ -181,7 +181,7 @@
   gap: 0.5rem;
 }
 
-.formElementSettings__fieldDescription {
+.formElementSettings__fieldDescription, .formElementSettings__fieldVarsList {
   padding: 15px;
   background-color: #ffe0c5;
   border: 1px solid #e6a973;
@@ -191,14 +191,31 @@
     color: #c68e5e;
     font-size: 15px;
     line-height: 1.5;
+  }
 
-    code {
-      font-size: 14px;
-      padding: 3px 6px;
-      border: 1px solid #e1b48b;
-      background-color: #fbeadb;
-      border-radius: 3px;
-    }
+  code {
+    font-size: 14px;
+    padding: 3px 6px;
+    border: 1px solid #e1b48b;
+    background-color: #fbeadb;
+    border-radius: 3px;
+    user-select: all;
+  }
+}
+
+.formElementSettings__fieldVarsList {
+  background-color: #e7fddd;
+  border: 1px solid #9de673;
+
+  p {
+    color: #5eae30;
+  }
+
+  code {
+    border: 1px solid #9de673;
+    background-color: #effaea;
+    margin-right: 4px;
+    user-select: all;
   }
 }