feat: 扩展工作空间侧边栏宽度约束并统一拖动手柄样式

- 侧边栏最大宽度从 800px 扩展至 1200px(含动态计算)
- 文件树最小宽度从 180px 提升至 300px
- 文件树最大宽度扩展为侧边栏宽度
- 预览关闭时文件树自动占满侧边栏,分隔线隐藏
- 外部拖动手柄改为与内部分隔线一致的样式(1px、hover 变色)
This commit is contained in:
2026-04-19 15:19:26 +08:00
parent ff4217c72a
commit 9dd2d4a1fc
2 changed files with 35 additions and 44 deletions

View File

@@ -6,7 +6,7 @@
.workspace-sidebar {
width: 500px;
min-width: 400px;
max-width: 800px;
max-width: 1200px;
background: var(--color-bg-2);
border-left: 1px solid var(--color-border-2);
display: flex;
@@ -131,8 +131,8 @@
// ========== FileTree ==========
&__file-tree {
min-width: 180px;
max-width: 300px;
min-width: 300px;
max-width: 100%;
flex-shrink: 0;
overflow-y: auto;
padding: 8px;
@@ -177,39 +177,28 @@
&__resize-handle {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 12px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
top: 0;
bottom: 0;
width: 1px;
background: var(--color-border-2);
cursor: ew-resize;
opacity: 0.5;
transition: opacity 0.2s;
transition: background 0.2s;
z-index: 10;
&::before {
content: '';
position: absolute;
top: 0;
left: -4px;
right: -4px;
bottom: 0;
cursor: ew-resize;
}
&:hover {
opacity: 1;
background: var(--color-primary);
}
}
&__resize-lines {
display: flex;
flex-direction: column;
gap: 2px;
div {
width: 4px;
height: 2px;
background: var(--color-text-3);
border-radius: 1px;
}
}
&__resize-handle:hover &__resize-lines div {
background: var(--color-text-1);
}
}
// 工作空间展开按钮