From bbfb02fcddaa1bb5df8eebcb83d31f5d155750b7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=9B=B7=E7=94=B5=E8=8A=BD=E8=A1=A3?=
 <zhangyanghaha0407@outlook.com>
Date: Fri, 17 Apr 2026 20:13:07 -0400
Subject: [PATCH] refactor(console): boost log contrast + dedupe empty state
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The Console panel (the bottom drawer opened with `显示控制台` / `Show
console`) had two issues the audit flagged as "not readable by a
normal user":

1. Log output was rendered in `text-muted-foreground` — roughly 45%
   contrast on dark backgrounds. Terminal output needs high contrast
   because users scan for error keywords at a glance. Boosted to
   `text-foreground/90`, which tracks the theme's foreground color so
   logs read clearly in both dark and light themes. Run meta values
   (Started / Finished / Cost) also promoted from muted to foreground;
   the field labels stay muted so the value is the emphasized element.

2. Empty state "No run selected" rendered TWICE — once in the left
   meta pane, once in the log pane. Restructured: when no run is
   selected, hide both panes and show a single centered message in
   the full-width drawer area. Faster to parse, less visual noise.

Covers J-Co2 / S-Co1. Other Console items (live log filtering, clear
button, cost emphasis near budget cap) are deferred — they are
feature additions, not bug fixes, and belong in a separate commit
with UX sign-off.
---
 src/renderer/views/ConsoleView.tsx | 30 ++++++++++++++++--------------
 1 file changed, 16 insertions(+), 14 deletions(-)

diff --git a/src/renderer/views/ConsoleView.tsx b/src/renderer/views/ConsoleView.tsx
index ac8b107e..6809f468 100644
--- a/src/renderer/views/ConsoleView.tsx
+++ b/src/renderer/views/ConsoleView.tsx
@@ -83,9 +83,9 @@ export function ConsoleView({
               </button>
             </div>
           </div>
-          <div className="grid border-t border-border xl:grid-cols-[240px_minmax(0,1fr)]">
-            <div className="border-b border-border px-5 py-3 xl:border-b-0 xl:border-r">
-              {selectedRun ? (
+          {selectedRun ? (
+            <div className="grid border-t border-border xl:grid-cols-[240px_minmax(0,1fr)]">
+              <div className="border-b border-border px-5 py-3 xl:border-b-0 xl:border-r">
                 <div className="space-y-2.5 text-[12px] text-muted-foreground">
                   <div className="flex items-center justify-between">
                     <span>{t("common.status")}</span>
@@ -93,15 +93,15 @@ export function ConsoleView({
                   </div>
                   <div className="flex items-center justify-between">
                     <span>{t("common.started")}</span>
-                    <span className="font-mono text-[11px]">{formatTime(selectedRun.startedAt)}</span>
+                    <span className="font-mono text-[11px] text-foreground">{formatTime(selectedRun.startedAt)}</span>
                   </div>
                   <div className="flex items-center justify-between">
                     <span>{t("common.finished")}</span>
-                    <span className="font-mono text-[11px]">{formatTime(selectedRun.finishedAt)}</span>
+                    <span className="font-mono text-[11px] text-foreground">{formatTime(selectedRun.finishedAt)}</span>
                   </div>
                   <div className="flex items-center justify-between">
                     <span>{t("common.cost")}</span>
-                    <span className="font-mono text-[11px]">{formatMoney(selectedRun.costUsd)}</span>
+                    <span className="font-mono text-[11px] text-foreground">{formatMoney(selectedRun.costUsd)}</span>
                   </div>
                   {selectedRun.logPath ? (
                     <div className="pt-1">
@@ -109,16 +109,18 @@ export function ConsoleView({
                     </div>
                   ) : null}
                 </div>
-              ) : (
-                <div className="py-4 text-center text-[12px] text-muted-foreground">{t("common.noRunSelected")}</div>
-              )}
+              </div>
+              <div className="h-[200px] overflow-auto px-5 py-3">
+                <pre className="font-mono whitespace-pre-wrap break-all text-[12px] leading-relaxed text-foreground/90">
+                  {logBuffer || t("common.waitingForLog")}
+                </pre>
+              </div>
             </div>
-            <div className="h-[200px] overflow-auto px-5 py-3">
-              <pre className="font-mono whitespace-pre-wrap break-all text-[12px] leading-relaxed text-muted-foreground">
-                {selectedRun ? (logBuffer || t("common.waitingForLog")) : t("common.noRunSelected")}
-              </pre>
+          ) : (
+            <div className="flex h-[200px] items-center justify-center border-t border-border">
+              <div className="text-center text-[12px] text-muted-foreground">{t("common.noRunSelected")}</div>
             </div>
-          </div>
+          )}
         </motion.section>
       ) : null}
     </AnimatePresence>