@import (reference) '../extend.less';
.ant-list-bordered {
  border-color: @border-color-split;
  background-color: @white;
}
.yo-list {
  @title-color: lighten(@black, 70%);
  @value-color: lighten(@black, 30%);
  &-content--h {
    display: flex;
    align-items: center;
    &--item {
      margin-left: @padding-xl;
      >span {
        line-height: 20px;

        color: @title-color;
      }
      >p {
        line-height: 22px;

        margin-top: @padding-xxs;
        margin-bottom: 0;

        color: @value-color;
      }
    }
  }
  .ant-pagination {
    margin: @padding-md 0;
  }
  .ant-descriptions {
    .ant-descriptions-item-label {
      color: @title-color;
    }
    .ant-descriptions-item-content {
      color: @value-color;
    }
    .ant-descriptions-row {
      &:last-child {
        >td {
          padding-bottom: 0;
        }
      }
    }
  }
  &--scroll {
    position: relative;

    overflow-x: auto;
  }
  .ant-list-items {
    min-width: 1000px;
  }
  .ant-list-item {
    transition: @animation-duration-slow;
    transition-property: background, border-bottom-color;
    &:hover {
      border-bottom-color: lighten(@primary-color, 30%);
      background: linear-gradient(90deg, transparent 10%, @background-color-light 70%, transparent);
    }
  }
  &-container {
    position: relative;
    &::before,
    &::after {
      position: absolute;
      top: 0;
      bottom: 0;
      z-index: 3;

      width: 30px;

      content: '';
      transition: box-shadow @animation-duration-slow;
      pointer-events: none;
    }
    &::before {
      left: 0;
    }
    &::after {
      right: 0;
    }
    &.yo-list--ping-left {
      &::before {
        box-shadow: inset 10px 0 8px -8px fade(@black, 15%);
      }
    }
    &.yo-list--ping-right {
      &::after {
        box-shadow: inset -10px 0 8px -8px fade(@black, 15%);
      }
    }
  }
}
