$namespace: re-skeleton;

.#{$namespace} {
  overflow: hidden;

  &-item {
    background: #f2f2f2;
    overflow: hidden;
  }

  &-active {
    .#{$namespace}-item {
      background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);
      background-size: 400% 100%;
      animation: re-skeleton-loading 1.4s ease infinite;
    }
  }

  @keyframes re-skeleton-loading {
    0% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0 50%;
    }
  }
}