mirror of
https://github.com/Syngnat/GoNavi.git
synced 2026-08-09 16:23:27 +08:00
🐛 fix(tabs/theme): 修复标签顶条与标题栏主题不一致 (#715)
## 背景 V2 工作区的活动 Tab 顶部仍显示一条绿色强调线,与当前圆角标签样式不协调。同时,自定义标题栏使用独立的固定背景,切换内置或自定义主题后无法与侧栏表面颜色保持一致。 ## 变更点 - 移除 V2 主工作区活动 Tab 顶部的 inset 强调条 - 保留活动 Tab 的选中背景、8px 圆角及原有交互状态 - V2 自定义标题栏改为复用侧栏的 `--gn-bg-panel-2` 主题表面 - 补充活动 Tab 和标题栏主题来源的回归断言 ## 影响范围 - 仅影响 V2 主工作区 Tab 和应用自定义标题栏的视觉表现 - legacy 标题栏继续使用原有 `bgMain`,透明度与模糊逻辑不变 - Modal、Drawer 等其他 Ant Tabs 的强调条不受影响 - 不修改标签尺寸、拖拽、关闭、窗口控制或主题配置逻辑 - 无后端、数据库、依赖或配置变更 ## 验证 - `npm test -- --run src/components/TabManager.adaptive-width.test.ts src/App.sidebar-collapse.test.ts`:12/12 通过 - `npx tsc --noEmit --pretty false`:通过 - Playwright 运行时验证:标题栏与侧栏背景一致,主题 token 更新后同步变化 - Playwright 活动 Tab 样式验证:`box-shadow: none`、顶部伪元素隐藏、圆角保持 8px - `git diff --check origin/dev...HEAD`:通过
This commit is contained in:
@@ -7,6 +7,16 @@ const sidebarSource = readFileSync(new URL('./components/Sidebar.tsx', import.me
|
||||
const connectionRailSource = readFileSync(new URL('./components/sidebar/SidebarConnectionRail.tsx', import.meta.url), 'utf8');
|
||||
|
||||
describe('app sidebar tree panel collapse', () => {
|
||||
it('uses the v2 themed sidebar surface for the custom titlebar', () => {
|
||||
const titlebarStart = appSource.indexOf('{/* Custom Title Bar */}');
|
||||
const titlebarEnd = appSource.indexOf('{showLinuxCJKFontBanner && (', titlebarStart);
|
||||
const titlebarSource = appSource.slice(titlebarStart, titlebarEnd);
|
||||
|
||||
expect(titlebarStart).toBeGreaterThan(-1);
|
||||
expect(titlebarEnd).toBeGreaterThan(titlebarStart);
|
||||
expect(titlebarSource).toContain("background: isV2Ui ? 'var(--gn-bg-panel-2)' : bgMain,");
|
||||
});
|
||||
|
||||
it('collapses v2 to the scaled fixed rail while preserving the saved expanded width', () => {
|
||||
expect(appSource).toContain('const [isSidebarCollapsed, setIsSidebarCollapsed] = useState(false);');
|
||||
expect(appSource).toContain('const sidebarCollapsedWidth = isV2Ui ? 38 * effectiveUiScale * effectiveSidebarRailScale : 0;');
|
||||
|
||||
@@ -7523,7 +7523,7 @@ function App() {
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'space-between',
|
||||
background: bgMain,
|
||||
background: isV2Ui ? 'var(--gn-bg-panel-2)' : bgMain,
|
||||
borderBottom: 'none',
|
||||
userSelect: 'none',
|
||||
WebkitAppRegion: isWebRuntime ? 'no-drag' : 'drag',
|
||||
|
||||
@@ -52,12 +52,12 @@ describe('v2 workbench adaptive tab width', () => {
|
||||
);
|
||||
});
|
||||
|
||||
it('rounds all four corners of every v2 workbench tab', () => {
|
||||
it('rounds all four corners without drawing an accent bar above the active tab', () => {
|
||||
expect(themeSource).toMatch(
|
||||
/\.gn-v2-main-tabs \.ant-tabs-tab \{[^}]*border-radius: 8px !important;/s,
|
||||
);
|
||||
expect(themeSource).toMatch(
|
||||
/\.gn-v2-main-tabs \.ant-tabs-tab\.ant-tabs-tab-active \{[^}]*box-shadow: inset 0 2px 0 var\(--gn-accent\) !important;/s,
|
||||
expect(themeSource).not.toMatch(
|
||||
/\.gn-v2-main-tabs \.ant-tabs-tab\.ant-tabs-tab-active \{[^}]*box-shadow:/s,
|
||||
);
|
||||
expect(themeSource).toMatch(
|
||||
/\.gn-v2-main-tabs \.ant-tabs-tab\.ant-tabs-tab-active::after \{[^}]*display: none;/s,
|
||||
|
||||
@@ -3713,10 +3713,6 @@ body[data-ui-version="v2"] .gn-v2-main-tabs .ant-tabs-tab {
|
||||
border-radius: 8px !important;
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-main-tabs .ant-tabs-tab.ant-tabs-tab-active {
|
||||
box-shadow: inset 0 2px 0 var(--gn-accent) !important;
|
||||
}
|
||||
|
||||
body[data-ui-version="v2"] .gn-v2-main-tabs .ant-tabs-tab.ant-tabs-tab-active::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user