.app-sort-bar{
    padding: 6px 8px;
    .ivu-row-flex.page-sort-bar{
      width: 100%;
      height: 30px;
      position: relative;
      .ivu-col{
          border-radius: 2px;
        user-select: none;
        text-align: center;
        margin: 0px 16px;
        display: flex;
        align-items: flex-end;
        padding-bottom: 4px;
        background-color: #FFF;
        border: 1px solid #CCC;
        margin-left: -1px;
        .sort-field-text{
          margin-left: 7px;
        }
        .caret-wrapper{
          width: 15px;
          display: inline-block;
          position: relative;
          top: 4px;
          padding-bottom: 2px;
          .ivu-icon{
            display: block;
            line-height: 0.5;
            color: #c5c8ce;
          }
        }
      }
      // 悬浮样式
      .ivu-col:hover{
          border:1px solid #82bff7;
          position:relative;
          z-index:2;
          .sort-field-text{
            color: #82bff7;
          }
      }
      // 选中样式
      .sort-ascending, .sort-descending{
          border:1px solid #82bff7;
          position:relative;
          z-index:2;
        .sort-field-text{
            color:#82bff7;
            font-weight: 800;
        }
      }
      .sort-ascending .caret-wrapper .ivu-icon.ivu-icon-md-arrow-dropup,
      .sort-descending .caret-wrapper .ivu-icon.ivu-icon-md-arrow-dropdown{
          color: #82bff7;
      }
        
      .issort {
        position: absolute;
        cursor: pointer;
        top: 4px;
        right: 10px;
      }
    }
  }
  @mixin slide-in($x-begin,$x-end,$c-begin,$c-end){
    @keyframes fadein{
      from {
        transform: translateX($x-begin);
        background-color: $c-begin;
      }
      to {
        transform: translateX($x-end);
        background-color: $c-end;
      }
    }
  }
  @include slide-in(1670px,0px,#fff,#EEF2F5);
  @mixin animation($animation-name,$animation-duration,$animation-timing-function,$animation-delay,$play-state){
    animation:$animation-name $animation-duration $animation-timing-function $animation-delay $play-state;
  };
  .open-bar {
    @include animation(fadein,0.7s,linear,0s,forwards);
  };