From 787585f040b2145ebd604a9415b0a1f027d4abf3 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 23 Oct 2025 06:30:26 +0000 Subject: [PATCH] Use platform-specific selector for Windows scrollbar styling Instead of modifying scrollbar width globally, use body[os='windows'] selector to apply wider scrollbar (10px) and spacing (2px transparent border) only on Windows platform. This addresses the window resize handle overlap issue specifically on Windows while maintaining the original scrollbar width (5-6px) on other platforms. Co-authored-by: DeJeune <67425183+DeJeune@users.noreply.github.com> --- src/renderer/src/assets/styles/responsive.css | 5 +++++ src/renderer/src/assets/styles/scrollbar.css | 18 ++++++++++++++---- 2 files changed, 19 insertions(+), 4 deletions(-) diff --git a/src/renderer/src/assets/styles/responsive.css b/src/renderer/src/assets/styles/responsive.css index e4ceadb432..f9b1a046d5 100644 --- a/src/renderer/src/assets/styles/responsive.css +++ b/src/renderer/src/assets/styles/responsive.css @@ -9,6 +9,11 @@ --topic-list-width: 275px; --settings-width: 250px; + --scrollbar-width: 5px; +} + +/* Windows系统专用滚动条配置 */ +body[os='windows'] { --scrollbar-width: 10px; } diff --git a/src/renderer/src/assets/styles/scrollbar.css b/src/renderer/src/assets/styles/scrollbar.css index 80370983ad..b8403c148a 100644 --- a/src/renderer/src/assets/styles/scrollbar.css +++ b/src/renderer/src/assets/styles/scrollbar.css @@ -7,10 +7,9 @@ --color-scrollbar-thumb: var(--color-scrollbar-thumb-dark); --color-scrollbar-thumb-hover: var(--color-scrollbar-thumb-dark-hover); - --scrollbar-width: 10px; + --scrollbar-width: 6px; --scrollbar-height: 6px; --scrollbar-thumb-radius: 10px; - --scrollbar-thumb-width: 6px; } body[theme-mode='light'] { @@ -18,6 +17,11 @@ body[theme-mode='light'] { --color-scrollbar-thumb-hover: var(--color-scrollbar-thumb-light-hover); } +/* Windows系统专用滚动条配置 - 增加宽度以避免与窗口调整大小区域重叠 */ +body[os='windows'] { + --scrollbar-width: 10px; +} + /* 全局初始化滚动条样式 */ ::-webkit-scrollbar { width: var(--scrollbar-width); @@ -32,7 +36,10 @@ body[theme-mode='light'] { ::-webkit-scrollbar-thumb { border-radius: var(--scrollbar-thumb-radius); background: var(--color-scrollbar-thumb); - /* Add transparent border to create space from window edge */ +} + +/* Windows系统滚动条添加右侧间距,避免与窗口调整大小区域重叠 */ +body[os='windows'] ::-webkit-scrollbar-thumb { border-right: 2px solid transparent; background-clip: padding-box; } @@ -77,7 +84,10 @@ pre:not(.shiki)::-webkit-scrollbar-thumb:hover { .rc-virtual-list-scrollbar-thumb { border-radius: var(--scrollbar-thumb-radius) !important; background: var(--color-scrollbar-thumb) !important; - /* Add transparent border to create space from window edge */ +} + +/* Windows系统虚拟列表滚动条添加右侧间距 */ +body[os='windows'] .rc-virtual-list-scrollbar-thumb { border-right: 2px solid transparent !important; background-clip: padding-box !important; }