Add CSS overrides to preserve original SR110 Vela results colors and prevent grey text interference

app.py

@@ -106,7 +106,7 @@ def run_vela(model_file):
         ]
         if any(pat in vela_stdout for pat in unsupported_patterns):
             summary_html = (
-                "<div style='background:#fff3f3;border-radius:14px;padding:24px 18px 18px 18px;"
+                "<div class='sr110-results' style='background:#fff3f3;border-radius:14px;padding:24px 18px 18px 18px;"
                 "max-width:430px;min-width:320px;width:100%;margin:auto;color:#d32f2f;font-family:sans-serif;"
                 "font-size:1.1em;text-align:left;font-weight:600;'>"
                 "This model has unsupported layers and needs investigation based on layers.<br>"
@@ -139,32 +139,32 @@ def run_vela(model_file):
             return val.lstrip("= ").strip() if isinstance(val, str) else val
 
         summary_html = (
-            "<div style='background:#1e1e2f;border-radius:18px;padding:18px 18px 12px 18px;"
+            "<div class='sr110-results' style='background:#1e1e2f;border-radius:18px;padding:18px 18px 12px 18px;"
             "max-width:430px;min-width:320px;width:100%;margin:auto;color:#eee;font-family:sans-serif;'>"
-            "<h3 style='margin-top:0;margin-bottom:12px;font-size:1.35em;color:#00b0ff;text-align:left;'>Estimated Results on SR110</h3>"
+            "<h3 class='sr110-title' style='margin-top:0;margin-bottom:12px;font-size:1.35em;color:#00b0ff;text-align:left;'>Estimated Results on SR110</h3>"
             "<div style='display:flex;flex-wrap:wrap;gap:10px;justify-content:center;'>"
             # Card 1: Accelerator
-            "<div style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
-            "<div style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>🚀 Accelerator</div>"
-            f"<div style='margin-bottom:2px;'><span style='color:#ccc;'>Configuration:</span> <span style='color:#fff;font-weight:500'>{summary_dict.get('Accelerator configuration','-')}</span></div>"
-            f"<div><span style='color:#ccc;'>Accelerator clock:</span> <span style='color:#fff;font-weight:500'>{summary_dict.get('Accelerator clock','-')}</span></div>"
+            "<div class='sr110-card' style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
+            "<div class='sr110-title' style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>🚀 Accelerator</div>"
+            f"<div style='margin-bottom:2px;'><span class='sr110-label' style='color:#ccc;'>Configuration:</span> <span class='sr110-value' style='color:#fff;font-weight:500'>{summary_dict.get('Accelerator configuration','-')}</span></div>"
+            f"<div><span class='sr110-label' style='color:#ccc;'>Accelerator clock:</span> <span class='sr110-value' style='color:#fff;font-weight:500'>{summary_dict.get('Accelerator clock','-')}</span></div>"
             "</div>"
             # Card 2: Memory Usage
-            "<div style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
-            "<div style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>💾 Memory Usage</div>"
-            f"<div style='margin-bottom:2px;'><span style='color:#ccc;'>Total SRAM:</span> <span style='color:#fff;font-weight:500'>{summary_dict.get('Total SRAM used','-')}</span></div>"
-            f"<div><span style='color:#ccc;'>Total On-chip Flash:</span> <span style='color:#fff;font-weight:500'>{summary_dict.get('Total On-chip Flash used','-')}</span></div>"
+            "<div class='sr110-card' style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
+            "<div class='sr110-title' style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>💾 Memory Usage</div>"
+            f"<div style='margin-bottom:2px;'><span class='sr110-label' style='color:#ccc;'>Total SRAM:</span> <span class='sr110-value' style='color:#fff;font-weight:500'>{summary_dict.get('Total SRAM used','-')}</span></div>"
+            f"<div><span class='sr110-label' style='color:#ccc;'>Total On-chip Flash:</span> <span class='sr110-value' style='color:#fff;font-weight:500'>{summary_dict.get('Total On-chip Flash used','-')}</span></div>"
             "</div>"
             # Card 3: Operator Distribution
-            "<div style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
-            "<div style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>📈 Operator Distribution</div>"
-            f"<div style='margin-bottom:2px;'><span style='color:#ccc;'>CPU Operators:</span> <span style='color:#fff;font-weight:500'>{clean_ops(summary_dict.get('CPU operators','-'))}</span></div>"
-            f"<div><span style='color:#ccc;'>NPU Operators:</span> <span style='color:#fff;font-weight:500'>{clean_ops(summary_dict.get('NPU operators','-'))}</span></div>"
+            "<div class='sr110-card' style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
+            "<div class='sr110-title' style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>📈 Operator Distribution</div>"
+            f"<div style='margin-bottom:2px;'><span class='sr110-label' style='color:#ccc;'>CPU Operators:</span> <span class='sr110-value' style='color:#fff;font-weight:500'>{clean_ops(summary_dict.get('CPU operators','-'))}</span></div>"
+            f"<div><span class='sr110-label' style='color:#ccc;'>NPU Operators:</span> <span class='sr110-value' style='color:#fff;font-weight:500'>{clean_ops(summary_dict.get('NPU operators','-'))}</span></div>"
             "</div>"
             # Card 4: Performance
-            "<div style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
-            "<div style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>⚡ Performance</div>"
-            f"<div><span style='color:#ccc;'>Inference time:</span> <span style='color:#fff;font-weight:500'>{summary_dict.get('Inference time','-')}</span></div>"
+            "<div class='sr110-card' style='flex:1 1 170px;min-width:170px;max-width:180px;background:#23233a;border-radius:12px;padding:10px 10px 8px 10px;'>"
+            "<div class='sr110-title' style='font-size:1em;font-weight:520;margin-bottom:6px;color:#00b0ff;'>⚡ Performance</div>"
+            f"<div><span class='sr110-label' style='color:#ccc;'>Inference time:</span> <span class='sr110-value' style='color:#fff;font-weight:500'>{summary_dict.get('Inference time','-')}</span></div>"
             "</div>"
             "</div></div>"
         ) if summary_items else "<div style='color:red'>Summary info not found in log.</div>"
@@ -304,7 +304,7 @@ def compile_uploaded_model(model_file):
     """Compile uploaded model with Vela and return results"""
     if model_file is None:
         error_html = (
-            "<div style='background:#fff3f3;border-radius:14px;padding:24px 18px 18px 18px;"
+            "<div class='sr110-results' style='background:#fff3f3;border-radius:14px;padding:24px 18px 18px 18px;"
             "max-width:430px;min-width:320px;width:100%;margin:auto;color:#d32f2f;font-family:sans-serif;"
             "font-size:1.1em;text-align:center;font-weight:600;'>"
             "No model file uploaded."
@@ -327,7 +327,7 @@ def compile_uploaded_model(model_file):
         )
     except Exception as e:
         error_html = (
-            "<div style='background:#fff3f3;border-radius:14px;padding:24px 18px 18px 18px;"
+            "<div class='sr110-results' style='background:#fff3f3;border-radius:14px;padding:24px 18px 18px 18px;"
             "max-width:430px;min-width:320px;width:100%;margin:auto;color:#d32f2f;font-family:sans-serif;"
             "font-size:1.1em;text-align:center;font-weight:600;'>"
             f"Vela compilation failed: {str(e)}"
@@ -469,6 +469,27 @@ with gr.Blocks(
     .card-header * {
         color: white !important;
     }
+    /* Override grey colors for SR110 Vela results section */
+    .sr110-results,
+    .sr110-results *,
+    .sr110-results h3,
+    .sr110-results div,
+    .sr110-results span {
+        color: inherit !important;
+    }
+    /* Preserve original colors for dark theme cards */
+    .sr110-results .sr110-card {
+        background: #23233a !important;
+    }
+    .sr110-results .sr110-title {
+        color: #00b0ff !important;
+    }
+    .sr110-results .sr110-label {
+        color: #ccc !important;
+    }
+    .sr110-results .sr110-value {
+        color: #fff !important;
+    }
     .example-grid {
         display: grid !important;
         grid-template-columns: 1fr !important;