/// Used to create the shimmer effect of skeleton components
$skeleton-shimmer-duration: duration(slower) * 2;

@mixin skeleton-shimmer {
  // This is a global animation, defined in /src/styles/global/animations.scss
    // stylelint-disable-next-line no-unknown-animations
    animation: polaris-SkeletonShimmerAnimation $skeleton-shimmer-duration
      linear infinite alternate;
  will-change: opacity;
}

@mixin skeleton-content {
  position: relative;

  &::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    background-color: color('sky');
    border-radius: border-radius();
  }
}