JOJO/agent-Specialization
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(style): 修复弹窗和审批面板文字颜色在深色模式下的异常显示

Browse Source 
- confirm-title 添加 color: var(--text-primary)
- confirm-button--primary 使用 var(--on-accent) 替代 var(--text-primary)，
  修复浅色模式下黑底黑字不可读
- 审批面板 auto-approval-block 标题/内容/决策/原因 补充显式颜色
- 审批面板 approval-lines/approval-diff/approval-kv strong/approval-value
  补充显式颜色，避免深色模式下继承为浅金色
This commit is contained in:
JOJO 2026-06-09 11:45:51 +08:00
parent 033bea236c
commit d5bf110b88
3 changed files with 13 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
static/src/components/panels/ToolApprovalPanel.vue
View File

@ -257,6 +257,7 @@ const parseFinalMessage = (text: string) => {
font-size: 13px; font-size: 13px;
font-weight: 600; font-weight: 600;
margin-bottom: 8px; margin-bottom: 8px;
color: var(--text-primary);
} }
.auto-approval-block__content { .auto-approval-block__content {
@ -265,6 +266,7 @@ const parseFinalMessage = (text: string) => {
line-height: 1.5; line-height: 1.5;
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-word; word-break: break-word;
color: var(--text-secondary);
} }
.auto-approval-block__final { .auto-approval-block__final {
@ -276,6 +278,7 @@ const parseFinalMessage = (text: string) => {
.auto-approval-block__decision { .auto-approval-block__decision {
font-weight: 700; font-weight: 700;
margin-bottom: 4px; margin-bottom: 4px;
color: var(--text-primary);
} }
.auto-approval-block__decision--approved { .auto-approval-block__decision--approved {
@ -289,6 +292,7 @@ const parseFinalMessage = (text: string) => {
.auto-approval-block__reason { .auto-approval-block__reason {
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-word; word-break: break-word;
color: var(--text-secondary);
} }
.tool-approval-panel.is-goal-approval-mode .auto-approval-block { .tool-approval-panel.is-goal-approval-mode .auto-approval-block {

3
static/src/styles/components/overlays/_overlays.scss
View File

@ -1994,6 +1994,7 @@
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
margin-bottom: 12px; margin-bottom: 12px;
color: var(--text-primary);
} }
.confirm-message { .confirm-message {
@ -2037,7 +2038,7 @@
.confirm-button--primary { .confirm-button--primary {
background: var(--claude-accent); background: var(--claude-accent);
border-color: var(--claude-accent-strong); border-color: var(--claude-accent-strong);
color: var(--text-primary); color: var(--on-accent);
} }
.confirm-button--danger { .confirm-button--danger {

7
static/src/styles/components/panels/_right-panel.scss
View File

@ -605,6 +605,7 @@ body[data-theme='dark'] .git-change-file__open-icon {
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-word; word-break: break-word;
background: var(--theme-surface-muted); background: var(--theme-surface-muted);
color: var(--text-primary);
scrollbar-width: none; scrollbar-width: none;
-ms-overflow-style: none; -ms-overflow-style: none;
} }
@ -616,6 +617,7 @@ body[data-theme='dark'] .git-change-file__open-icon {
.approval-diff { .approval-diff {
margin-top: 12px; margin-top: 12px;
color: var(--text-primary);
font-family: 'Monaco', 'Menlo', 'Consolas', monospace; font-family: 'Monaco', 'Menlo', 'Consolas', monospace;
font-size: 12px; font-size: 12px;
line-height: 1.5; line-height: 1.5;
@ -648,12 +650,14 @@ body[data-theme='dark'] .git-change-file__open-icon {
.approval-kv strong { .approval-kv strong {
white-space: nowrap; white-space: nowrap;
color: var(--text-primary);
} }
.approval-value { .approval-value {
white-space: normal; white-space: normal;
overflow-wrap: anywhere; overflow-wrap: anywhere;
word-break: break-word; word-break: break-word;
color: var(--text-primary);
} }
.approval-note { .approval-note {
@ -665,16 +669,19 @@ body[data-theme='dark'] .git-change-file__open-icon {
.approval-lines--old { .approval-lines--old {
background: color-mix(in srgb, var(--claude-warning) 18%, transparent); background: color-mix(in srgb, var(--claude-warning) 18%, transparent);
border: 1px solid color-mix(in srgb, var(--claude-warning) 50%, transparent); border: 1px solid color-mix(in srgb, var(--claude-warning) 50%, transparent);
color: var(--text-primary);
} }
.approval-lines--new { .approval-lines--new {
background: color-mix(in srgb, var(--claude-success) 18%, transparent); background: color-mix(in srgb, var(--claude-success) 18%, transparent);
border: 1px solid color-mix(in srgb, var(--claude-success) 50%, transparent); border: 1px solid color-mix(in srgb, var(--claude-success) 50%, transparent);
color: var(--text-primary);
} }
.approval-lines--cmd, .approval-lines--cmd,
.approval-lines--generic { .approval-lines--generic {
background: var(--theme-surface-muted); background: var(--theme-surface-muted);
color: var(--text-primary);
} }
.tool-approval-panel .diff-line { .tool-approval-panel .diff-line {