style(theme): 明亮/经典主题视觉层次修正
- light 主题:摘要行降为三级文字色与正文拉开层级(含 running 动画变体) - light 主题:代码块头部浅灰、代码区与对话底同色;表格白体+浅灰表头+可见边框 - light 主题:输入栏壳体改浅灰浮起,发送按钮柔化为 78% 黑、hover 加深 - classic 主题:git 状态栏及子菜单背景与输入栏壳体对齐为纯白 - 顺带修正:思考模式 slash 菜单描述去掉已下线的 deep
This commit is contained in:
parent
9d3784bd90
commit
c6c8bf2d0c
@ -1257,6 +1257,29 @@ onBeforeUnmount(() => {
|
||||
}
|
||||
}
|
||||
|
||||
/* ===== 明亮主题:摘要行降为三级文字色,与正文(text-primary)拉开层级 ===== */
|
||||
/* hover 反馈不做特化:与经典/深色保持一致(基础 hover 底色在三主题下均等于底色,均无可见反馈) */
|
||||
|
||||
body[data-theme='light'] .summary-content-wrapper,
|
||||
body[data-theme='light'] .summary-tool-reel-item {
|
||||
color: var(--text-tertiary);
|
||||
}
|
||||
|
||||
body[data-theme='light'] .summary-line-text.running .summary-char {
|
||||
color: var(--text-tertiary);
|
||||
animation-name: summaryPassLight;
|
||||
}
|
||||
|
||||
@keyframes summaryPassLight {
|
||||
0%,
|
||||
100% {
|
||||
color: var(--text-tertiary);
|
||||
}
|
||||
50% {
|
||||
color: var(--accent);
|
||||
}
|
||||
}
|
||||
|
||||
/* 步骤容器 */
|
||||
.steps-container {
|
||||
display: grid;
|
||||
|
||||
@ -1597,7 +1597,7 @@ const rootSlashMenuItems = computed<SlashMenuItem[]>(() => {
|
||||
{
|
||||
id: 'run-mode',
|
||||
label: '思考模式',
|
||||
description: '切换 fast / thinking / deep',
|
||||
description: '切换 fast / thinking',
|
||||
disabled: !props.isConnected || props.streamingMessage,
|
||||
mode: 'run-mode'
|
||||
},
|
||||
@ -3841,6 +3841,15 @@ onBeforeUnmount(() => {
|
||||
box-shadow: 0 1px 2px var(--shadow-color);
|
||||
}
|
||||
|
||||
/* 经典主题:git 状态栏及子菜单与输入栏壳体对齐为纯白 --surface-raised
|
||||
(基础 --theme-surface-soft 在经典为米色 #f5f0e8,与白色输入栏不一致) */
|
||||
:global(html[data-theme='classic'] .floating-project-status),
|
||||
:global(body[data-theme='classic'] .floating-project-status),
|
||||
:global(html[data-theme='classic'] .floating-project-status__submenu),
|
||||
:global(body[data-theme='classic'] .floating-project-status__submenu) {
|
||||
background: var(--surface-raised);
|
||||
}
|
||||
|
||||
.floating-status-motion-enter-active,
|
||||
.floating-status-motion-leave-active {
|
||||
transition:
|
||||
|
||||
@ -2523,3 +2523,41 @@ body[data-theme='dark'] {
|
||||
background: var(--surface-muted) !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* ========== 明亮主题变体(对话区组件) ========== */
|
||||
/* 背景:浅色主题表面 token 阶梯近乎纯平(base/card/raised 全为 #ffffff),
|
||||
基础样式中代码块白底落白底、表格 #f9f9f9 落白底均不可见;
|
||||
参照上方深色覆盖块的做法,按用户确认的方向做组件级补偿:
|
||||
代码块仅头部着色、代码区与对话底保持同色;表格白体+浅灰表头+可见边框。 */
|
||||
body[data-theme='light'] {
|
||||
/* 代码块 - 头部浅灰、代码区与对话底同为白色,外框加强到可见 */
|
||||
.code-block-wrapper {
|
||||
border-color: var(--border-strong);
|
||||
}
|
||||
|
||||
.code-block-header {
|
||||
background: var(--surface-muted);
|
||||
border-bottom-color: var(--border-strong);
|
||||
}
|
||||
|
||||
/* 表格 - 白体 + 浅灰表头 + 可见边框 */
|
||||
.text-output .text-content table {
|
||||
background: var(--surface-raised);
|
||||
}
|
||||
|
||||
.text-output .text-content thead {
|
||||
background: var(--surface-muted);
|
||||
}
|
||||
|
||||
.text-output .text-content th,
|
||||
.text-output .text-content td {
|
||||
border-color: var(--border-strong);
|
||||
}
|
||||
|
||||
.text-output .text-content .md-table-scroll,
|
||||
.text-output .text-content [data-md-table-scroll='1'] {
|
||||
border-color: var(--border-strong);
|
||||
background: var(--surface-raised);
|
||||
}
|
||||
}
|
||||
|
||||
@ -396,9 +396,16 @@ body[data-theme='light'] {
|
||||
color: var(--state-info);
|
||||
}
|
||||
|
||||
/* 发送按钮 - 黑底白三角,浅阴影做层次 */
|
||||
/* 输入栏壳体 - 与 git 状态栏同色的浅灰(基础 --surface-raised 在本主题为纯白,与对话底同色无层次;无法比白更浅,反向用略浅灰让壳体浮起) */
|
||||
.stadium-shell,
|
||||
.stadium-shell.is-focused,
|
||||
.stadium-shell.has-text {
|
||||
background: var(--surface-soft);
|
||||
}
|
||||
|
||||
/* 发送按钮 - 柔化黑底白三角(78% 黑),hover 加深为实黑,浅阴影做层次 */
|
||||
.stadium-btn.send-btn {
|
||||
background: var(--text-primary);
|
||||
background: color-mix(in srgb, var(--text-primary) 78%, transparent);
|
||||
color: var(--surface-raised);
|
||||
box-shadow: 0 1px 3px var(--shadow-color);
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user