fix(theme): 清爽侧栏减宽 190px 与三级菜单名完整显示

2026-11-03 10:58:22 +08:00 · 2026-10-02 03:55:31 +00:00
parent 9e67cd71e9
commit da1ba7440b
3 changed files with 83 additions and 2 deletions
--- a/public/static/common/css/theme/_fresh.scss
+++ b/public/static/common/css/theme/_fresh.scss
@@ -196,6 +196,60 @@ $shadow-pop: 0 6px 16px rgba(31, 35, 41, .08);
    background-color: rgba(127, 127, 127, 0.15) !important;
 }

+// 侧栏展开宽度 200→190（用户定案）与五联动（W=190）：.layui-side width / .layui-body left /
+// .layuimini-logo width / .layuimini-tool left(=W+35) 四条框架源规则均无 !important，
+// .elem-style-fresh 包裹 +1 类即稳赢；.layui-layout-left left(=W+95) 框架源带 !important
+// （layuimini.css (0,1,0)!），须同姿态反杀（包裹后 (0,2,0)!）。收起态 60px 为独立体系：
+// 框架收起态规则全带 !important 且特异性更高（layout-left 收起态 (0,4,0)! > 本组 (0,2,0)!），
+// 整体压制本组声明，收起态零影响，无需 :not 排除。
+.layui-side {
+    width: 190px;
+}
+
+.layui-body {
+    left: 190px;
+}
+
+.layuimini-logo {
+    width: 190px;
+}
+
+.layuimini-tool {
+    left: 225px;
+}
+
+.layui-layout-left {
+    left: 285px !important;
+}
+
+// 侧栏菜单字号 14→13px（用户定案，一/二/三级统一；头部/页签字体不动）。菜单名文字由
+// span 承载，线上 CDN 分发的 layui-ul.css 以 .layui-nav * { font-size:14px }（本地
+// layui.css 无此条，CSSOM 跨域拒读，常规命中分析不可见）把 span 钉死 14px，故 a 与
+// span 须分别显式声明。zoom 悬浮面板同步 13px：面板 170px 下子级项内容需求
+// icon14.86+间隙3.63+7字13px=91 → 合计 164.5px，余 5.5px（span 若保持 14px 需 98px
+// 合计 171.5px 仍截断 1.5px）。
+.layuimini-menu-left .layui-nav .layui-nav-item a,
+.layuimini-menu-left-zoom.layui-nav .layui-nav-item a,
+.layuimini-menu-left .layui-nav .layui-nav-item a .layui-left-nav,
+.layuimini-menu-left-zoom.layui-nav .layui-nav-item a .layui-left-nav {
+    font-size: 13px;
+}
+
+// 视觉三级（数据 L4）缩进 45→35px（用户定案）：layuimini.css 45px 档 (0,5,0) 无 !important，
+// 包裹 +1 类即稳赢；35px 档（V2）与 55/65 深档按定案不动。选择器不得照抄框架源的
+// .layui-layout-body 前缀——该类与 .elem-style-fresh 同挂 body（同元素非祖先），包裹后
+// 永不匹配，须用真实中间档 .layui-layout-admin 堆特异性（fix-menu-height 同型前科）。
+// zoom 面板无 .layuimini-menu-left 祖先不命中本规则，面板 35px 缩进来自其自有档位，保持不变。
+.layui-layout-admin .layuimini-menu-left .layui-nav .layui-nav-child .layui-nav-child a {
+    padding-left: 35px;
+}
+
+// zoom 悬浮面板 150→170px（用户定案；layuimini.css (0,2,0) 无 !important，包裹即稳赢；
+// 面板是 layer.tips 动态插 body 下的 DOM，.elem-style-fresh 挂 body 命中其子孙）
+.popup-tips .layui-nav-tree {
+    width: 170px;
+}
+
 .layui-side.layui-bg-black>.layuimini-menu-left>ul>.layui-nav-item:first-child {
    border-top-color: $border-light;
 }
--- a/public/static/common/css/theme/index.css
+++ b/public/static/common/css/theme/index.css
@@ -2290,6 +2290,33 @@
 .elem-style-fresh .layuimini-menu-left .layui-nav .layui-nav-item a:hover {
  background-color: rgba(127, 127, 127, 0.15) !important;
 }
+.elem-style-fresh .layui-side {
+  width: 190px;
+}
+.elem-style-fresh .layui-body {
+  left: 190px;
+}
+.elem-style-fresh .layuimini-logo {
+  width: 190px;
+}
+.elem-style-fresh .layuimini-tool {
+  left: 225px;
+}
+.elem-style-fresh .layui-layout-left {
+  left: 285px !important;
+}
+.elem-style-fresh .layuimini-menu-left .layui-nav .layui-nav-item a,
+.elem-style-fresh .layuimini-menu-left-zoom.layui-nav .layui-nav-item a,
+.elem-style-fresh .layuimini-menu-left .layui-nav .layui-nav-item a .layui-left-nav,
+.elem-style-fresh .layuimini-menu-left-zoom.layui-nav .layui-nav-item a .layui-left-nav {
+  font-size: 13px;
+}
+.elem-style-fresh .layui-layout-admin .layuimini-menu-left .layui-nav .layui-nav-child .layui-nav-child a {
+  padding-left: 35px;
+}
+.elem-style-fresh .popup-tips .layui-nav-tree {
+  width: 170px;
+}
 .elem-style-fresh .layui-side.layui-bg-black > .layuimini-menu-left > ul > .layui-nav-item:first-child {
  border-top-color: #f0f2f5;
 }
--- a/public/static/plugs/lay-module/layuimini/miniMenu.js
+++ b/public/static/plugs/lay-module/layuimini/miniMenu.js
@@ -45,9 +45,9 @@
         * 渲染一级菜单
         */
        compileMenu: function (menu, isSub) {
-            var menuHtml = '<li {{#if( d.menu){ }}  data-menu="{{-d.menu}}" {{#}}} class="layui-nav-item menu-li {{-d.childOpenClass}} {{-d.className}}"  {{#if( d.id){ }}  id="{{-d.id}}" {{#}}}> <a {{#if( d.href){ }} layuimini-href="{{-d.href}}" {{#}}} {{#if( d.target){ }}  target="{{-d.target}}" {{#}}} href="javascript:;">{{#if( d.icon){ }}  <i class="{{-d.icon}}"></i> {{#}}} <span class="layui-left-nav">{{-d.title}}</span></a>  {{# if(d.children){}} {{-d.children}} {{#}}} </li>';
+            var menuHtml = '<li {{#if( d.menu){ }}  data-menu="{{-d.menu}}" {{#}}} class="layui-nav-item menu-li {{-d.childOpenClass}} {{-d.className}}"  {{#if( d.id){ }}  id="{{-d.id}}" {{#}}}> <a title="{{-d.title}}" {{#if( d.href){ }} layuimini-href="{{-d.href}}" {{#}}} {{#if( d.target){ }}  target="{{-d.target}}" {{#}}} href="javascript:;">{{#if( d.icon){ }}  <i class="{{-d.icon}}"></i> {{#}}} <span class="layui-left-nav">{{-d.title}}</span></a>  {{# if(d.children){}} {{-d.children}} {{#}}} </li>';
            if (isSub) {
-                menuHtml = '<dd class="menu-dd {{-d.childOpenClass}} {{- d.className }}"> <a href="javascript:;"  {{#if( d.menu){ }}  data-menu="{{-d.menu}}" {{#}}} {{#if( d.id){ }}  id="{{-d.id}}" {{#}}} {{#if(( !d.child || !d.child.length ) && d.href){ }} layuimini-href="{{-d.href}}" {{#}}} {{#if( d.target){ }}  target="{{-d.target}}" {{#}}}> {{#if( d.icon){ }}  <i class="{{-d.icon}}"></i> {{#}}} <span class="layui-left-nav"> {{-d.title}}</span></a> {{# if(d.children){}} {{-d.children}} {{#}}}</dd>';
+                menuHtml = '<dd class="menu-dd {{-d.childOpenClass}} {{- d.className }}"> <a href="javascript:;" title="{{-d.title}}"  {{#if( d.menu){ }}  data-menu="{{-d.menu}}" {{#}}} {{#if( d.id){ }}  id="{{-d.id}}" {{#}}} {{#if(( !d.child || !d.child.length ) && d.href){ }} layuimini-href="{{-d.href}}" {{#}}} {{#if( d.target){ }}  target="{{-d.target}}" {{#}}}> {{#if( d.icon){ }}  <i class="{{-d.icon}}"></i> {{#}}} <span class="layui-left-nav"> {{-d.title}}</span></a> {{# if(d.children){}} {{-d.children}} {{#}}}</dd>';
            }
            return laytpl(menuHtml).render(menu);
        },