.wx-sidebar {
  position: fixed;
  height: 100%;
  left: 0;
  z-index: 1031;
  top: 50px;
}

.wx-sidebar-content {
  height: 100%;
  background-color: #fff;
  z-index: 100;
  position: relative;
  ul {
    list-style: none;
    display: block;
    margin: 0;
    padding: 0;
    width: 50px;
    transition: width .5s ease;
    box-sizing: border-box;
    overflow: hidden;
    &:hover{
      width: 221px;
    }
    .deviding-line {
      border-top: 1px dashed #ddd;
    }
    li {
      display: block;
      width: 221px;
      cursor: pointer;
      transition: width .5s ease-out;
      a {
        height: 50px;
        color: #6b6868;
        display: block;
        .text {
          display: inline-block;
          text-align: left;
          width: 165px;
          text-indent: 10px;
          font-size: 14px;
        }
        span {
          width: 50px;
          height: 50px;
          line-height: 50px;
          font-size: 20px;
          text-align: center;
          display: inline-block;
        }
        &:hover {
          // width: 300px;
          background-color: #ffd9ae;
        }
        &.router-link-active {
          background-color: #f37327;
          span, .text{
            color: #fff;
          }
        }
      }
    }
  }
}