From 7679269f305d941cc2f8b1a12230549be6dc0f24 Mon Sep 17 00:00:00 2001 From: From-wh Date: Wed, 30 Sep 2026 11:52:00 +0800 Subject: [PATCH] =?UTF-8?q?style(=E7=AE=A1=E7=90=86=E7=AB=AF):=20=E4=BF=AE?= =?UTF-8?q?=E5=A4=8D=E4=BE=A7=E6=A0=8F=E8=8F=9C=E5=8D=95=E6=94=B6=E8=B5=B7?= =?UTF-8?q?=E6=80=81=E5=9B=BE=E6=A0=87=E6=9C=AA=E6=B0=B4=E5=B9=B3=E5=B1=85?= =?UTF-8?q?=E4=B8=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/admin/src/theme/element.scss | 34 +++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) diff --git a/frontend/admin/src/theme/element.scss b/frontend/admin/src/theme/element.scss index 7d30c649b..6fd37cafa 100644 --- a/frontend/admin/src/theme/element.scss +++ b/frontend/admin/src/theme/element.scss @@ -373,6 +373,40 @@ padding-left: 66px !important; } +// 菜单收起（默认/经典布局 64px 窄条）：一级图标水平居中。 +// EP 原生收起态居中只命中 class 以 el-icon 开头的图标（.el-menu--collapse>… [class^=el-icon]， +// 给 24px 图标位 + margin 清零），项目 iconfont 图标（.crmeb-icon.menu-icon）与旧版 .ivu-icon +// 前缀类匹配不上，沿用展开态 width:1em + margin-right:5px，图标偏左约 4px；此处补齐同样式。 +// 同上限定在 .layout-aside 内，不影响收起悬停弹层（EP 原生展开态对齐）。 +.layout-aside .el-menu--collapse > .el-menu-item .menu-icon, +.layout-aside .el-menu--collapse > .el-menu-item .ivu-icon, +.layout-aside .el-menu--collapse > .el-sub-menu > .el-sub-menu__title .menu-icon, +.layout-aside .el-menu--collapse > .el-sub-menu > .el-sub-menu__title .ivu-icon { + width: var(--el-menu-icon-width, 24px); + margin: 0; + text-align: center; +} + +// 收起 + 分栏圆角/卡片风格（columns-round/columns-card 给菜单项左右各 5px 外边距，项宽 64→54px）： +// 图标位仍按 64px 项的 padding-left 20px 排布，24px 图标整体右偏 5px（实测 iconCenterX=+5）。 +// 收起态文字已隐藏（EP visibility:hidden + width:0）、箭头 display:none；两侧内边距一并清零后 +// 内容居中即可自适应项宽。叶子项图标外还有一层 tooltip trigger 包装 div（块级、占满内容盒）， +// 需让其内部也居中，否则图标贴在 padding 起点。 +.layout-aside .el-menu--collapse.columns-round > .el-menu-item, +.layout-aside .el-menu--collapse.columns-round > .el-sub-menu > .el-sub-menu__title, +.layout-aside .el-menu--collapse.columns-card > .el-menu-item, +.layout-aside .el-menu--collapse.columns-card > .el-sub-menu > .el-sub-menu__title { + justify-content: center; + padding-left: 0 !important; + padding-right: 0 !important; +} + +.layout-aside .el-menu--collapse.columns-round > .el-menu-item > div, +.layout-aside .el-menu--collapse.columns-card > .el-menu-item > div { + display: flex; + justify-content: center; +} + // 小屏侧栏抽屉（layout/aside.vue）：清零全局抽屉 body 的 20px 35px 内边距—— // 该内边距面向详情/编辑抽屉内容；侧栏菜单需占满抽屉宽度， // 否则 180px 抽屉被左右各吃 35px 后仅剩 110px，二级菜单（缩进 40 + 图标 + 文字）被截断