22 lines
1.3 KiB
Markdown
22 lines
1.3 KiB
Markdown
|
|
# 左侧菜单宽度调整为 240px 前端实施记录
|
||
|
|
|
||
|
|
## 本次改动
|
||
|
|
|
||
|
|
- 调整 [variables.scss](/Users/wkc/Desktop/ccdi/ccdi/ruoyi-ui/src/assets/styles/variables.scss) 中全局侧栏宽度变量 `$base-sidebar-width`,将左侧菜单宽度从 `200px` 调整为 `240px`。
|
||
|
|
- 保持现有侧栏展开、折叠、移动端抽屉和固定头部联动逻辑不变,由现有布局样式继续复用同一宽度变量。
|
||
|
|
|
||
|
|
## 实现方式
|
||
|
|
|
||
|
|
- 直接修改全局样式变量 `$base-sidebar-width`,让 [sidebar.scss](/Users/wkc/Desktop/ccdi/ccdi/ruoyi-ui/src/assets/styles/sidebar.scss) 和 [layout/index.vue](/Users/wkc/Desktop/ccdi/ccdi/ruoyi-ui/src/layout/index.vue) 中依赖该变量的侧栏宽度、主内容区偏移量、固定头部宽度同步生效。
|
||
|
|
- 不额外新增局部覆盖样式,避免出现展开态、折叠态和移动端宽度不一致的问题。
|
||
|
|
|
||
|
|
## 验证情况
|
||
|
|
|
||
|
|
- 执行 `cd ruoyi-ui && npm run build:prod`,生产构建通过。
|
||
|
|
- 构建过程中仅出现仓库原有的静态资源体积告警,没有新增编译错误或构建失败。
|
||
|
|
|
||
|
|
## 边界说明
|
||
|
|
|
||
|
|
- 本次仅调整左侧菜单展示宽度,不改动菜单数据、路由、权限、交互行为和页面内容布局逻辑。
|
||
|
|
- 本轮未启动前端开发服务进行手工联调,因此不存在新增前端进程需要关闭的情况。
|