From da69d50c6046712a7c3996cc5a15fb9ecf6cb282 Mon Sep 17 00:00:00 2001 From: ae Date: Mon, 18 Aug 2025 09:02:25 -0700 Subject: [PATCH] fix: stop using ANSI blue (#2421) - One less color. - Replaced with cyan which looks better next to other cyan components. --- .../tui/src/bottom_pane/selection_popup_common.rs | 2 +- codex-rs/tui/src/history_cell.rs | 6 +++--- codex-rs/tui/src/onboarding/auth.rs | 14 ++++++++------ codex-rs/tui/src/onboarding/trust_directory.rs | 4 +++- codex-rs/tui/src/user_approval_widget.rs | 2 +- codex-rs/tui/styles.md | 7 +++---- 6 files changed, 19 insertions(+), 16 deletions(-) diff --git a/codex-rs/tui/src/bottom_pane/selection_popup_common.rs b/codex-rs/tui/src/bottom_pane/selection_popup_common.rs index 1a032313..6098a957 100644 --- a/codex-rs/tui/src/bottom_pane/selection_popup_common.rs +++ b/codex-rs/tui/src/bottom_pane/selection_popup_common.rs @@ -101,7 +101,7 @@ pub(crate) fn render_rows( if Some(i) == state.selected_idx { cell = cell.style( Style::default() - .fg(Color::Blue) + .fg(Color::Cyan) .add_modifier(Modifier::BOLD), ); } else if *is_current { diff --git a/codex-rs/tui/src/history_cell.rs b/codex-rs/tui/src/history_cell.rs index f6c69306..555226dd 100644 --- a/codex-rs/tui/src/history_cell.rs +++ b/codex-rs/tui/src/history_cell.rs @@ -711,7 +711,7 @@ pub(crate) fn new_plan_update(update: UpdatePlanArgs) -> PlainHistoryCell { Span::styled( step, Style::default() - .fg(Color::Blue) + .fg(Color::Cyan) .add_modifier(Modifier::BOLD), ), ), @@ -913,9 +913,9 @@ fn format_mcp_invocation<'a>(invocation: McpInvocation) -> Line<'a> { .unwrap_or_default(); let invocation_spans = vec![ - Span::styled(invocation.server.clone(), Style::default().fg(Color::Blue)), + Span::styled(invocation.server.clone(), Style::default().fg(Color::Cyan)), Span::raw("."), - Span::styled(invocation.tool.clone(), Style::default().fg(Color::Blue)), + Span::styled(invocation.tool.clone(), Style::default().fg(Color::Cyan)), Span::raw("("), Span::styled(args_str, Style::default().add_modifier(Modifier::DIM)), Span::raw(")"), diff --git a/codex-rs/tui/src/onboarding/auth.rs b/codex-rs/tui/src/onboarding/auth.rs index 0c223645..8407e84e 100644 --- a/codex-rs/tui/src/onboarding/auth.rs +++ b/codex-rs/tui/src/onboarding/auth.rs @@ -130,8 +130,8 @@ impl AuthModeWidget { let line1 = if is_selected { Line::from(vec![ - format!("{} {}. ", caret, idx + 1).blue().dim(), - text.to_string().blue(), + format!("{} {}. ", caret, idx + 1).cyan().dim(), + text.to_string().cyan(), ]) } else { Line::from(format!(" {}. {text}", idx + 1)) @@ -139,7 +139,7 @@ impl AuthModeWidget { let line2 = if is_selected { Line::from(format!(" {description}")) - .fg(Color::Blue) + .fg(Color::Cyan) .add_modifier(Modifier::DIM) } else { Line::from(format!(" {description}")) @@ -163,6 +163,8 @@ impl AuthModeWidget { )); lines.push(Line::from("")); lines.push( + // AE: Following styles.md, this should probably be Cyan because it's a user input tip. + // But leaving this for a future cleanup. Line::from(" Press Enter to continue") .style(Style::default().add_modifier(Modifier::DIM)), ); @@ -194,7 +196,7 @@ impl AuthModeWidget { lines.push(Line::from(" If the link doesn't open automatically, open the following link to authenticate:")); lines.push(Line::from(vec![ Span::raw(" "), - state.auth_url.as_str().blue().underlined(), + state.auth_url.as_str().cyan().underlined(), ])); lines.push(Line::from("")); } @@ -238,7 +240,7 @@ impl AuthModeWidget { ]) .style(Style::default().add_modifier(Modifier::DIM)), Line::from(""), - Line::from(" Press Enter to continue").fg(Color::Blue), + Line::from(" Press Enter to continue").fg(Color::Cyan), ]; Paragraph::new(lines) @@ -267,7 +269,7 @@ impl AuthModeWidget { Line::from( " To use Codex with the OpenAI API, set OPENAI_API_KEY in your environment", ) - .style(Style::default().fg(Color::Blue)), + .style(Style::default().fg(Color::Cyan)), Line::from(""), Line::from(" Press Enter to return") .style(Style::default().add_modifier(Modifier::DIM)), diff --git a/codex-rs/tui/src/onboarding/trust_directory.rs b/codex-rs/tui/src/onboarding/trust_directory.rs index f5ad123b..84f7aef8 100644 --- a/codex-rs/tui/src/onboarding/trust_directory.rs +++ b/codex-rs/tui/src/onboarding/trust_directory.rs @@ -75,7 +75,7 @@ impl WidgetRef for &TrustDirectoryWidget { |idx: usize, option: TrustDirectorySelection, text: &str| -> Line<'static> { let is_selected = self.highlighted == option; if is_selected { - Line::from(format!("> {}. {text}", idx + 1)).blue() + Line::from(format!("> {}. {text}", idx + 1)).cyan() } else { Line::from(format!(" {}. {}", idx + 1, text)) } @@ -109,6 +109,8 @@ impl WidgetRef for &TrustDirectoryWidget { lines.push(Line::from(format!(" {error}")).fg(Color::Red)); lines.push(Line::from("")); } + // AE: Following styles.md, this should probably be Cyan because it's a user input tip. + // But leaving this for a future cleanup. lines.push(Line::from(" Press Enter to continue").add_modifier(Modifier::DIM)); Paragraph::new(lines) diff --git a/codex-rs/tui/src/user_approval_widget.rs b/codex-rs/tui/src/user_approval_widget.rs index 7a4e3d90..34cac5b4 100644 --- a/codex-rs/tui/src/user_approval_widget.rs +++ b/codex-rs/tui/src/user_approval_widget.rs @@ -145,7 +145,7 @@ impl UserApprovalWidget<'_> { } => { let cmd = strip_bash_lc_and_escape(command); let mut contents: Vec = to_command_display( - vec!["? ".fg(Color::Blue), "Codex wants to run ".bold()], + vec!["? ".fg(Color::Cyan), "Codex wants to run ".bold()], cmd, vec![], ); diff --git a/codex-rs/tui/styles.md b/codex-rs/tui/styles.md index c0c68041..378970ad 100644 --- a/codex-rs/tui/styles.md +++ b/codex-rs/tui/styles.md @@ -7,16 +7,15 @@ # Foreground colors - **Default:** Most of the time, just use the default foreground color. `reset` can help get it back. -- **Selection:** Use ANSI `blue`. (Ed & AE want to make this cyan too, but we'll do that in a followup since it's riskier in different themes.) -- **User input tips and status indicators:** Use ANSI `cyan`. +- **User input tips, selection, and status indicators:** Use ANSI `cyan`. - **Success and additions:** Use ANSI `green`. - **Errors, failures and deletions:** Use ANSI `red`. - **Codex:** Use ANSI `magenta`. # Avoid -- Avoid custom colors because there's no guarantee that they'll contrast well or look good in various terminal color themes. +- Avoid custom colors because there's no guarantee that they'll contrast well or look good in various terminal color themes. (`shimmer.rs` is an exception that works well because we take the default colors and just adjust their levels.) - Avoid ANSI `black` & `white` as foreground colors because the default terminal theme color will do a better job. (Use `reset` if you need to in order to get those.) The exception is if you need contrast rendering over a manually colored background. -- Avoid ANSI `yellow` because for now the style guide doesn't use it. Prefer a foreground color mentioned above. +- Avoid ANSI `blue` and `yellow` because for now the style guide doesn't use them. Prefer a foreground color mentioned above. (There are some rules to try to catch this in `clippy.toml`.)