style(dashboard): 为主工作区整体添加大容器背景框与边框圆角阴影

This commit is contained in:
xuans 2026-10-18 13:31:59 +08:00
parent 0aa10682dc
commit 522e2bb8a1
3 changed files with 14 additions and 9 deletions

View File

@ -3655,9 +3655,9 @@ P0-05 从 `[!]` 调整为 `[~]`,并未标记完成;P0-04 剩余门禁和全
## 2026年10月18日 主工作区大容器背景框视觉优化
- [~] 需求确认:为整个主工作区(.dashboard-workspace,包含左侧主内容区与右侧200px侧边栏)添加统一的大容器背景框(白底、圆角、边框与柔和外阴影),使整体页面层次分明、视觉规整。
- [ ] 调整样式:在 frontend/src/views/Dashboard/DashboardLayout.css 中为 .dashboard-workspace 增加背景框样式,并协调 .dashboard-navigation 与 .dashboard-content 边距和圆角。
- [ ] 执行前端单元测试(357 项),确保测试全绿通过。
- [ ] 构建并部署至第一台 Linux 生产服务器(8.137.23.95)。
- [ ] 刷新页面并验证视觉效果。
- [ ] 规范双重推送 Git 远程仓库。
- [x] 需求确认:为整个主工作区(.dashboard-workspace,包含左侧主内容区与右侧200px侧边栏)添加统一的大容器背景框(白底、圆角、边框与柔和外阴影),使整体页面层次分明、视觉规整。
- [x] 调整样式:在 frontend/src/views/Dashboard/DashboardLayout.css 中为 .dashboard-workspace 增加背景框样式(gap: 0; border: 1px solid #e2e8f2; border-radius: 20px; background: #ffffff; box-shadow: 0 10px 30px rgba(31, 50, 87, 0.04); overflow: hidden;),并将右侧导航栏背景与左侧边框无缝融合。
- [x] 执行前端单元测试(357 项全部通过,357 pass, 0 fail)。
- [x] 构建最新 Vite 产物并成功部署至第一台 Linux 生产服务器(8.137.23.95:/scert/web/)。
- [x] 刷新浏览器页面实机复核,主工作区整体大背景卡片呈现清晰规整效果。
- [x] 规范双重推送 Git 远程仓库。

View File

@ -51,7 +51,12 @@
display: grid;
grid-template-columns: minmax(0, 1fr) 200px;
grid-template-areas: "main submenu";
gap: 18px;
gap: 0;
border: 1px solid #e2e8f2;
border-radius: 20px;
background: #ffffff;
box-shadow: 0 10px 30px rgba(31, 50, 87, 0.04);
overflow: hidden;
min-height: 0;
}
@ -143,7 +148,7 @@
@media (max-width: 1100px) {
.dashboard-workspace {
grid-template-columns: minmax(0, 1fr) 200px;
gap: 14px;
gap: 0;
}
.operation-columns {

View File

@ -10,7 +10,7 @@
padding: 2px 5px;
border-left: 1px solid #e2e8f2;
box-sizing: border-box;
background: transparent;
background: #fbfcfe;
}
.navigation-heading {