From 1d051e97b86dfb02ebbee9447405896584229949 Mon Sep 17 00:00:00 2001
From: MWicenec <wicenecmw@gmail.com>
Date: Wed, 18 Dec 2024 12:02:44 +0800
Subject: [PATCH] changed styling to make it more obvious which value is the
 active one

---
 static/tables.css                   | 9 +++++----
 templates/node_parameter_table.html | 8 ++++----
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/static/tables.css b/static/tables.css
index 5a8280d1..b7eca849 100644
--- a/static/tables.css
+++ b/static/tables.css
@@ -343,8 +343,8 @@ td:first-child input {
 }
 
 .eagleTableDisplay .eagleTableWrapper .doubleInputDisplay{
-    width: 45%;
-    border: 2px dotted #002e5f;
+    width: 42%;
+    border: 1px dotted #002e5f;
     left: unset;
     top: 3px;
     bottom: 3px;
@@ -354,7 +354,7 @@ td:first-child input {
 .eagleTableDisplay .eagleTableWrapper .doubleInputDisplay.configValueInput{
     right: unset;
     left: 3px;
-    border: 1px solid #002e5f;
+    border: 2px solid #002e5f;
 }
 
 .eagleTableDisplay  input[type="checkbox"]{
@@ -509,7 +509,8 @@ td:first-child input {
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
-    font-weight: 800;   
+    font-weight: 500;
+    font-size: 57px;   
 }
 
 @media only screen and (max-width: 2010px) {
diff --git a/templates/node_parameter_table.html b/templates/node_parameter_table.html
index 15cfafd7..3472f6f4 100644
--- a/templates/node_parameter_table.html
+++ b/templates/node_parameter_table.html
@@ -171,7 +171,7 @@ <h5 class="bottomWindowHeader">Fields Table: </h5>
                                                         <td class='columnCell column_Value'>
                                                             <!-- ko if: $data.getGraphConfigField() -->
                                                                 <input class="tableParameter configValueInput" min="0" step="1" onfocus="this.previousValue = this.value" onkeydown="this.previousValue = this.value" oninput="validity.valid || (value = this.previousValue)" data-bind="css: {doubleInputDisplay: $data.getGraphConfigField(), selectedTableParameter: ParameterTable.isSelected('configValue', $data) }, eagleTooltip: 'Configured Value',disabled: $root.getCurrentParamValueReadonly($data), valueUpdate: ['afterkeydown', 'input'], value: $data.getGraphConfigField().value, attr:{type: $data.getHtmlInputType()},  event: {change: ParameterTable.fieldValueChanged, keyup: function(event, data){ParameterTable.select($data.getGraphConfigField().value(), 'configValue', $data, $index())}, click: function(event, data){ParameterTable.select($data.getGraphConfigField().value(), 'configValue', $data, $index())}}">    
-                                                                <i class="material-icons md-18 parameterTableOverWriteIcon" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'">arrow_forward</i>
+                                                                <i class="parameterTableOverWriteIcon icon-overwrite" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'"></i>
                                                             <!-- /ko -->
                                                             <input class="tableParameter" min="0" step="1" onfocus="this.previousValue = this.value" onkeydown="this.previousValue = this.value" oninput="validity.valid || (value = this.previousValue)" data-bind="css: {doubleInputDisplay: $data.getGraphConfigField(), selectedTableParameter: ParameterTable.isSelected('value', $data) }, eagleTooltip: 'Graph Value',disabled: $root.getCurrentParamValueReadonly($data), valueUpdate: ['afterkeydown', 'input'], value: value, attr:{type: $data.getHtmlInputType()},  event: {change: ParameterTable.fieldValueChanged, keyup: function(event, data){ParameterTable.select($data.value(), 'value', $data, $index())}, click: function(event, data){ParameterTable.select($data.value(), 'value', $data, $index())}}">
                                                         </td>
@@ -180,7 +180,7 @@ <h5 class="bottomWindowHeader">Fields Table: </h5>
                                                         <td class='columnCell column_Value'>
                                                             <!-- ko if: $data.getGraphConfigField() -->
                                                                 <input class="tableParameter inputNoArrows configValueInput tableFieldStringValueInput" data-bind="css: {doubleInputDisplay: $data.getGraphConfigField(), selectedTableParameter: ParameterTable.isSelected('configValue', $data) }, eagleTooltip: 'Configured Value', disabled: $root.getCurrentParamValueReadonly($data), valueUpdate: ['afterkeydown', 'input'], value: $data.getGraphConfigField().value, attr:{type: $data.getHtmlInputType()}, event: {change: ParameterTable.fieldValueChanged, keyup: function(event, data){ParameterTable.select($data.getGraphConfigField().value(), 'configValue', $data, $index())}, click: function(event, data){ParameterTable.select($data.getGraphConfigField().value(), 'configValue', $data, $index())}}">
-                                                                <i class="material-icons md-18 parameterTableOverWriteIcon" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'">arrow_forward</i>
+                                                                <i class="parameterTableOverWriteIcon icon-overwrite" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'"></i>
                                                             <!-- /ko -->
                                                             <input class="tableParameter inputNoArrows tableFieldStringValueInput" data-bind="css: {doubleInputDisplay: $data.getGraphConfigField(), selectedTableParameter: ParameterTable.isSelected('value', $data) }, eagleTooltip: 'Graph Value', disabled: $root.getCurrentParamValueReadonly($data), valueUpdate: ['afterkeydown', 'input'], value: value, attr:{type: $data.getHtmlInputType()},  event: {change: ParameterTable.fieldValueChanged, keyup: function(event, data){ParameterTable.select($data.value(), 'value', $data, $index())}, click: function(event, data){ParameterTable.select($data.value(), 'value', $data, $index())}}">
                                                         </td>
@@ -194,7 +194,7 @@ <h5 class="bottomWindowHeader">Fields Table: </h5>
                                                                     <input class="tableParameter" tabindex='-1' data-bind="css: {selectedTableParameter: ParameterTable.isSelected('configValue', $data) }, checked: valIsTrue($data.getGraphConfigField().value()), disabled: $root.getCurrentParamValueReadonly($data), valueUpdate: ['afterkeydown', 'input'], value: value, event: {change: function(){$data.getGraphConfigField().toggle(); ParameterTable.fieldValueChanged();}}" type="checkbox">
                                                                 </div>
                                                             </div>
-                                                            <i class="material-icons md-18 parameterTableOverWriteIcon" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'">arrow_forward</i>
+                                                            <i class="parameterTableOverWriteIcon icon-overwrite" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'"></i>
                                                         <!-- /ko -->
                                                         <div class="checkboxWrapper" data-bind="css: {doubleInputDisplay: $data.getGraphConfigField()}, eagleTooltip: 'Graph Value'">
                                                             <div>
@@ -213,7 +213,7 @@ <h5 class="bottomWindowHeader">Fields Table: </h5>
                                                                     </select>
                                                                 </div>
                                                             </div>
-                                                            <i class="material-icons md-18 parameterTableOverWriteIcon" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'">arrow_forward</i>
+                                                            <i class="parameterTableOverWriteIcon icon-overwrite" data-bind="eagleTooltip: 'The Configured Value (left) is overwriting the graph value (right)'"></i>
                                                         <!-- /ko -->
                                                         <div class="checkboxWrapper" data-bind="css: {doubleInputDisplay: $data.getGraphConfigField()}, eagleTooltip: 'Graph Value'">
                                                             <div>