@import '@/style/basics.scss';
.el-aside {
  -webkit-transition: width .2s;
  transition: width .2s;
  width: $width-aside;
  background-color: $bg-aside;
  height: 100%;
  position: fixed;
  font-size: 0;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1001;
  overflow: hidden;
  color: $aside-color;
  .el-menu {
    border-right: none;
}

  .tilte {
    min-height: $height-aside-tilte;
    line-height: $height-aside-tilte;
    background: $bg-aside;
    text-align: center;

    .logoimg {
      width: $width-aside-img;
      height: $height-aside-img;
      vertical-align: middle;
      background: #fff;
      border-radius: 50%;
      padding: 3px;
  }

    .tit-text {
      display: inline-block;
      color: $aside-color;
      font-weight: 600;
      font-size: 20px;
      vertical-align: middle;
      padding-left: 10px;
  }
}

}

  .hideside {
    .aside {
      width: $width-hideside-aside;
  }
}

  .mobile.hideside {
    .el-aside {
      -webkit-transition-duration: .2s;
      transition-duration: .2s;
      -webkit-transform: translate3d(-210px, 0, 0);
      transform: translate3d(-220px, 0, 0);
  }
}

  .mobile {
    .el-aside {
      -webkit-transition: -webkit-transform .28s;
      transition: -webkit-transform .28s;
      transition: transform .28s;
      transition: transform .28s, -webkit-transform .28s;
      margin-left: -54px;
  }
}