// 水平模式时高度强制设置为100% .@{elNamespace}-menu--horizontal.@{elNamespace}-menu.cip-main-nav{ height: 100%; } .cip-main-nav.@{elNamespace}-menu, .cip-menu-popper{ border:none; .cip-menu__title{ flex-grow: 2; } // 展开后父菜单徽标消失 .@{elNamespace}-sub-menu.is-opened{ > .@{elNamespace}-sub-menu__title { .cip-menu__badge { visibility: hidden; } } } .@{elNamespace}-menu-item{ // 与el-sub-menu的表现不同在收缩时会套一个el-popper导致无法正常居中 display: flex; align-items: center; justify-content: flex-start; line-height: normal; .cip-menu__badge{ margin-left:8px; } [class~=iconfont], [class^=el-icon-], .cip-svg-icon, > svg, .@{elNamespace}-menu-tooltip__trigger > svg{ width: 15px; height: 15px; margin-right: 5px; text-align: center; font-size: var(--el-menu-item-font-size); vertical-align: middle; overflow: visible; & ~ .cip-menu__title { margin-left: 10px; } } } .@{elNamespace}-sub-menu__title{ display: flex; align-items: center; justify-content: flex-start; line-height: normal; .cip-menu__badge{ margin: 0 16px 0 8px; } [class~=iconfont], [class^=el-icon-], .cip-svg-icon, > svg{ width: 15px; height: 15px; margin-right: 5px; text-align: center; font-size: var(--el-menu-item-font-size); vertical-align: middle; overflow: visible; & ~ .cip-menu__title { margin-left: 10px; } } } .@{elNamespace}-sub-menu{ [class~=iconfont], [class^=el-icon-], .cip-svg-icon{ text-align: center; font-size: var(--el-menu-item-font-size); //vertical-align: middle; } } } .cip-menu-popper{ .@{elNamespace}-menu-item,.@{elNamespace}-sub-menu__title{ .cip-menu__badge{ flex-shrink: 0; margin: 0 8px 0 8px; } } } .cip-main-nav.@{elNamespace}-menu--collapse{ .@{elNamespace}-menu-item{ line-height: var(--el-menu-item-height); } }