修复一些progressbar bug

This commit is contained in:
CakeCN
2025-12-12 16:34:42 +08:00
parent 221f3faace
commit 5789974d2e

View File

@@ -107,13 +107,7 @@
.btn-group-toggle .btn { .btn-group-toggle .btn {
padding: 5px 10px; padding: 5px 10px;
} }
#leftSidebar, .vscode-web, #rightSidebar { /* 主容器,使用 grid 布局 */
height: 100%;
overflow: auto;
}
/* 主容器,使用 grid 布局 */
#maxcontainer { #maxcontainer {
display: grid; display: grid;
grid-template-columns: 2fr 5px 3fr 5px 2fr; /* 默认宽度比例 */ grid-template-columns: 2fr 5px 3fr 5px 2fr; /* 默认宽度比例 */
@@ -122,7 +116,20 @@
/* 各区域基础样式 */ /* 各区域基础样式 */
.sidebar { .sidebar {
overflow: auto; /* 确保内容可以滚动 */ display: flex;
flex-direction: column;
overflow: hidden; /* 隐藏溢出内容,让内部元素单独滚动 */
}
/* 左侧边栏样式 */
#leftSidebar {
height: 100%;
}
/* 中间和右侧边栏样式 */
.vscode-web, #rightSidebar {
height: 100%;
overflow: auto;
} }
.vscode-web { .vscode-web {
@@ -162,14 +169,30 @@
/* Markdown内容区域样式 */
#markdown-content {
flex: 1; /* 占满剩余空间 */
overflow-y: auto; /* 只有内容区域可以垂直滚动 */
overflow-x: hidden; /* 隐藏水平滚动条 */
}
/* 设置进度条容器样式 */
#markdown-content-process {
display: flex;
align-items: flex-end; /* 让进度条靠底部对齐 */
padding: 0 10px 10px 10px; /* 添加底部内边距,调整与底部的距离 */
box-sizing: border-box;
flex-shrink: 0; /* 防止进度条被压缩 */
}
/* 设置每个子框的基本样式 */ /* 设置每个子框的基本样式 */
.progress-box { .progress-box {
height: 100%; /* 度为 100%,撑满容器 */ width: 100%; /* 度为 100%,撑满容器 */
display: flex; display: flex;
flex-direction: row; /* 使子框横向排列 */ flex-direction: row; /* 使子框横向排列 */
justify-content: flex-start; justify-content: flex-start;
align-items: center;
gap: 2px; /* 进度条之间的间距 */ gap: 2px; /* 进度条之间的间距 */
margin-bottom: 0; /* 移除底部边距 */
} }
.progress-title { .progress-title {