Misc alignment fixes

Author: elmisback

src/herbie/ErrorPlot.tsx

@@ -477,7 +477,7 @@ function ErrorPlot() {
                   </xhtml:div>
                 </foreignObject>
                 <foreignObject x=${xAdjusted + 40 + ""} y=${-28 + ""} height="20px" width="16px">
-                  <xhtml:a class="deselect" style="font-size: 16px;">╳</xhtml:a>
+                  <xhtml:a class="deselect" style="font-size: 16px;">×</xhtml:a>
                 </foreignObject>`;
 
               // Add copy functionality on click of '⧉' icon to get point values of all point variables

src/herbie/ExpressionTable.css

@@ -59,7 +59,6 @@
   width: 80px; /* Fixed width to prevent resizing */
   display: flex;
   align-items: center; /* Center content vertically */
-  justify-content: flex-end; /* Align text to the right */
 }
 
 .speedup {
@@ -129,6 +128,13 @@
   padding-left: 25px;
   padding-right: 10px;
   align-items: center;
+  button {
+    font-size: 10px;
+  }
+}
+
+.expression-table .fas {
+  vertical-align: middle;
 }
 
 .expand-header {

src/herbie/ExpressionTable.tsx

@@ -498,7 +498,7 @@ function ExpressionTable() {
                       setSelectedExprId(activeExp[0]);
                     }
                     }}>
-                  ╳
+                  ×
                   </button>
                 </div>
               </div>

src/herbie/LocalError/newLocalError.css

@@ -49,6 +49,10 @@
   display: none;
 }
 
+.local-error thead {
+  font-size: 12px;
+}
+
 /* slightly darken the hovered row */
 .local-error tbody tr:hover {
   background-color: #f3f4f6; /* Light gray background on hover */

src/herbie/LocalError/newLocalError.tsx

@@ -147,7 +147,7 @@ function TreeRow({
                   </svg>
                 )}
               </span>
-            ) : (<span style={{ width: '3px' , display: 'inline-block'}}></span>)}
+            ) : (<span style={{ width: '7px' , display: 'inline-block'}}></span>)}
             <div style={{
               display: "inline-block",
             }}>
@@ -230,6 +230,7 @@ function treeMapWithPath<T, U>(
 }
 
 function NewLocalError({ expressionId }: { expressionId: number }) {
+  const [selectedPoint] = HerbieContext.useGlobal(HerbieContext.SelectedPointContext);
   const [selectedPointsLocalError] = HerbieContext.useGlobal(HerbieContext.SelectedPointsLocalErrorContext);
   const [localError, setLocalError] = useState<LocalErrorTree | null>(null);
   const [errorPaths, setErrorPaths] = useState<number[][]>([]);
@@ -251,11 +252,19 @@ function NewLocalError({ expressionId }: { expressionId: number }) {
     }
   }, [selectedPointsLocalError, expressionId]);
 
+  if (!selectedPoint) {
+    return (
+      <div className="not-computed">
+        <div><strong>Select a single point</strong> on the Local Error Plot to the left to compute subexpression error.</div>
+      </div>
+    );
+  }
+
   if (!localError || !pointErrorExp
   ) {
     return (
-      <div className="not-computed">
-        <div>No local error computed for this expression. Select a point to compute.</div>
+      <div className="loading">
+        <div>Loading...</div>
       </div>
     );
   }