.sidebar-container {
    z-index: 3;
    width: 180px !important;
    transition: width 0.18s;
    .scrollbar-wrapper {
        height: calc(100vh - 50px);
        .el-scrollbar__wrap{
            overflow-x: hidden;
        }
    }
    .sidebar-menu {
        width: 180px;
        height: calc(100vh - 50px);
        border: 0;
    }
    .sidebar-menu::-webkit-scrollbar {
        display: none;
    }
    .el-submenu__title > i,
    .el-menu-item > i{
        margin-right: 6px;
    }
    .el-submenu.is-opened .el-submenu__title{
        color: #fff !important;
        & > i {
            color: #fff !important;
        }
    }
    .el-menu-item.is-active i {
        color: #fff !important;
    }
    .el-submenu .el-menu-item{
        min-width: 180px !important;
        background: #15171d !important;
        &.is-active{
            background: #1890ff !important;
        }
    }
    .menu-wrapper .el-menu-item{
        &.is-active{
            background: #1890ff !important;
        }
    }
    .el-menu--collapse {
        width: 64px;
        overflow: inherit;
    }
    .logo {
        height: 50px;
        position: relative;
        line-height: 50px;
        transition: all 0.3s;
        background: #21242e;
        overflow: hidden;
        text-align: center;
        img {
            display: inline-block;
            vertical-align: middle;
            height: 32px;
        }
        .short-logo{
            display: none;
        }
        h1 {
            color: #fff;
            display: inline-block;
            vertical-align: middle;
            font-size: 18px;
            margin: 0 0 0 8px;
            font-family: "Myriad Pro", "Helvetica Neue", Arial, Helvetica,
            sans-serif;
            font-weight: 600;
        }
    }
}
.hideSidebar {
    .sidebar-container {
        width: 64px !important;
        .el-menu--collapse {
            .el-submenu {
                overflow: hidden;
                &>.el-submenu__title {
                    &>span {
                        height: 0;
                        width: 0;
                        overflow: hidden;
                        visibility: hidden;
                        display: inline-block;
                    }
                    .el-submenu__icon-arrow{
                        display: none;
                    }
                }
            }
        }
        .logo{
            img{
                display: none;
            }
            .short-logo{
                display: inline-block;
            }
        }
    }
}
.top-menu{
    float: left;
}
// 顶部布局
.el-menu--horizontal {
    border: none !important;
    &>.menu-wrapper{
        float: left;
    }
    .el-menu-item>i, .el-submenu__title>i {
        margin-right: 6px;
    }
    .el-menu-item {
        float: left;
        height: 60px;
        line-height: 60px;
        margin: 0;
        //border-bottom: 2px solid transparent;
        color: #909399;
        &.is-active {
            //border-bottom: 2px solid #409eff;
            color: #303133;
        }
    }
}