#app { // 主体区域 .main-container { min-height: 100%; transition: margin-left 0.28s; // margin-left: 150px; position: relative; } // 侧边栏 .sidebar-container { // transition: width 0.28s; // width: 150px !important; // height: 100%; // position: fixed; // font-size: 0px; // // top: 60px; // bottom: 0; // left: 0; // z-index: 1001; // overflow: hidden; //reset element-ui css .horizontal-collapse-transition { transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out; } .scrollbar-wrapper { overflow-x: hidden !important; width: 140px; border-right:1px solid #e5e5e5; .el-scrollbar__view { height: 96%; .hamburger-container { padding: 20px 10px 10px 10px; color: #fff; text-align: center; cursor: pointer; } } } .is-horizontal { display: none; } a { display: inline-block; width: 100%; // overflow: hidden; } .svg-icon { margin-right: 6px; } .el-menu { border: none; // min-height: 130%; width: 100% !important; } } // .hideSidebar { // .sidebar-container { // width: 36px !important; // } // // .main-container { // // margin-left: 36px; // // } // .submenu-title-noDropdown { // padding-left: 10px !important; // position: relative; // .el-tooltip { // padding: 0 10px !important; // } // } // .el-submenu { // overflow: hidden; // & > .el-submenu__title { // padding-left: 10px !important; // .el-submenu__icon-arrow { // display: none; // } // } // } // .el-menu--collapse { // .el-submenu { // & > .el-submenu__title { // & > span { // height: 0; // width: 0; // overflow: hidden; // visibility: hidden; // display: inline-block; // } // } // } // } // } .sidebar-container .nest-menu .el-submenu > .el-submenu__title, .sidebar-container .el-submenu .el-menu-item { // min-width: 180px !important; // background-color: $subMenuBg !important; &:hover { // background-color: $menuHover !important; background-color: #eaebeb !important; } } .el-menu--collapse .el-menu .el-submenu { // min-width: 180px !important; } .el-menu-item.is-active{ background-color: #eaebeb !important; } //适配移动端 .mobile { .main-container { margin-left: 0px; } .sidebar-container { transition: transform 0.28s; width: 180px !important; } &.hideSidebar { .sidebar-container { transition-duration: 0.3s; transform: translate3d(-180px, 0, 0); } } } .withoutAnimation { .main-container, .sidebar-container { transition: none; } } }