fix: 工作空间面板改为 flex 子元素,修复与主内容区错位

- workspace-panel 从 position:fixed 改为 flex 子元素,与日志面板布局模式一致
- 移除 margin-right:480px hack,工作空间自然占据宽度
- 移除 updateNavHeight() 和 --nav-height CSS 变量(不再需要)
- 移除 border-top(flex 布局下顶部自动对齐)
This commit is contained in:
thzxx
2026-04-15 10:17:04 +08:00
parent 8ab3fc5f68
commit d6373ffafe
3 changed files with 8 additions and 27 deletions
+1 -1
View File
@@ -167,7 +167,7 @@
</div> </div>
</div><!-- /.main-wrap --> </div><!-- /.main-wrap -->
<!-- ═══════════════ 工作空间面板(右侧,常驻显示)═══════════════ --> <!-- ═══════════════ 工作空间面板(右侧,常驻显示flex 子元素)═══════════════ -->
<aside class="workspace-panel" id="workspacePanel"> <aside class="workspace-panel" id="workspacePanel">
<div class="ws-header"> <div class="ws-header">
<span class="ws-title">🖥️ 工作空间</span> <span class="ws-title">🖥️ 工作空间</span>
+1 -16
View File
@@ -212,8 +212,6 @@ async function init(): Promise<void> {
setupDesktopIntegration(); setupDesktopIntegration();
bindGlobalEvents(); bindGlobalEvents();
updateNavHeight();
window.addEventListener('resize', updateNavHeight);
await checkConnection(); await checkConnection();
await loadModels(); await loadModels();
@@ -285,24 +283,11 @@ async function init(): Promise<void> {
initSettingsModal(); initSettingsModal();
initHistoryModal(); initHistoryModal();
setupDesktopIntegration(); setupDesktopIntegration();
updateNavHeight();
window.addEventListener('resize', updateNavHeight);
checkConnection().then(loadModels); checkConnection().then(loadModels);
} }
} }
/**
* 动态计算顶部导航高度(header + model-bar),
* 设为 CSS 变量 --nav-height,供 workspace-panel 引用
*/
function updateNavHeight(): void {
const header = document.querySelector<HTMLElement>('.app-header');
const modelBar = document.querySelector<HTMLElement>('.model-bar');
const headerH = header?.getBoundingClientRect().height ?? 0;
const modelBarH = modelBar?.getBoundingClientRect().height ?? 0;
const total = Math.ceil(headerH + modelBarH);
document.documentElement.style.setProperty('--nav-height', `${total}px`);
}
function bindGlobalEvents(): void { function bindGlobalEvents(): void {
document.querySelector('#btnNewChat')?.addEventListener('click', startNewSession); document.querySelector('#btnNewChat')?.addEventListener('click', startNewSession);
+6 -10
View File
@@ -2673,17 +2673,14 @@ html, body {
/* ═══════════════ 工作空间面板 ═══════════════ */ /* ═══════════════ 工作空间面板 ═══════════════ */
.workspace-panel { .workspace-panel {
position: fixed;
top: var(--nav-height, 92px); /* JS 动态计算 header + model-bar 实际高度 */
right: 0;
bottom: 0;
width: 480px; width: 480px;
background: var(--bg-solid, #202020); min-width: 480px;
border-left: 1px solid var(--border-default, rgba(255,255,255,0.08));
border-top: 1px solid var(--border-default, rgba(255,255,255,0.08));
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background: var(--bg-solid, #202020);
border-left: 1px solid var(--border-default, rgba(255,255,255,0.08));
z-index: 10; z-index: 10;
flex-shrink: 0;
font-family: 'Cascadia Code', 'Consolas', 'Courier New', monospace; font-family: 'Cascadia Code', 'Consolas', 'Courier New', monospace;
} }
@@ -3083,6 +3080,5 @@ html, body {
/* ── 主内容区自适应 ── */ /* ── 主内容区自适应 ── */
.main-wrap.with-workspace { /* main-wrap.with-workspace 不再需要 margin-right
margin-right: 480px; 工作空间面板已改为 flex 子元素,自然占据宽度 */
}