diff --git a/static/src/components/chat/MinimalBlocks.vue b/static/src/components/chat/MinimalBlocks.vue index 1b211a8..a316075 100644 --- a/static/src/components/chat/MinimalBlocks.vue +++ b/static/src/components/chat/MinimalBlocks.vue @@ -726,6 +726,28 @@ watch( display: block; /* 让第一行文字中心和 SVG 中心对齐:向上移动半个行高减去半个字高 */ margin-top: calc((1em - 1.7em) / 2); + /* 滚动条样式(参考 git 状态侧边栏文件列表,滚动槽透明贴合灰色底色) */ + scrollbar-width: thin; /* Firefox */ + scrollbar-color: color-mix(in srgb, var(--claude-text-secondary, #6b7280) 55%, transparent) + transparent; +} + +.thinking-content::-webkit-scrollbar { + width: 10px; + height: 10px; +} + +.thinking-content::-webkit-scrollbar-track { + background: transparent; + border-radius: 999px; + margin: 8px; +} + +.thinking-content::-webkit-scrollbar-thumb { + background: color-mix(in srgb, var(--claude-text-secondary, #6b7280) 55%, transparent); + border-radius: 999px; + border: 2px solid transparent; + background-clip: padding-box; } /* 工具内容 */ diff --git a/static/src/components/chat/actions/ToolAction.vue b/static/src/components/chat/actions/ToolAction.vue index 2a12b3b..b05ad6b 100644 --- a/static/src/components/chat/actions/ToolAction.vue +++ b/static/src/components/chat/actions/ToolAction.vue @@ -1112,6 +1112,43 @@ function renderEasterEgg(result: any, args: any): string { background: rgba(0, 0, 0, 0.01); } +/* 结构化显示滚动条样式(参考 git 状态侧边栏文件列表,滚动槽透明贴合灰色底色) */ +.tool-result-content.scrollable, +.tool-result-diff.scrollable, +.code-block pre, +.output-block pre { + scrollbar-width: thin; /* Firefox */ + scrollbar-color: color-mix(in srgb, var(--claude-text-secondary, #6b7280) 55%, transparent) + transparent; +} + +.tool-result-content.scrollable::-webkit-scrollbar, +.tool-result-diff.scrollable::-webkit-scrollbar, +.code-block pre::-webkit-scrollbar, +.output-block pre::-webkit-scrollbar { + width: 10px; + height: 10px; +} + +.tool-result-content.scrollable::-webkit-scrollbar-track, +.tool-result-diff.scrollable::-webkit-scrollbar-track, +.code-block pre::-webkit-scrollbar-track, +.output-block pre::-webkit-scrollbar-track { + background: transparent; + border-radius: 999px; + margin: 8px; +} + +.tool-result-content.scrollable::-webkit-scrollbar-thumb, +.tool-result-diff.scrollable::-webkit-scrollbar-thumb, +.code-block pre::-webkit-scrollbar-thumb, +.output-block pre::-webkit-scrollbar-thumb { + background: color-mix(in srgb, var(--claude-text-secondary, #6b7280) 55%, transparent); + border-radius: 999px; + border: 2px solid transparent; + background-clip: padding-box; +} + .tool-result-content pre { margin: 0; white-space: pre-wrap;