/*
 * https://github.com/morethanwords/tweb
 * Copyright (C) 2019-2021 Eduard Kuzmenko
 * https://github.com/morethanwords/tweb/blob/master/LICENSE
 */

@keyframes wave {
  0% {
    transform: translateX(-100%);
  }

  50% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(100%);
  }
}

.shimmer {
  --opacity: .2;

  @include animation-level(0) {
    &:before {
      content: unset;
    }
  }

  &:before {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, transparent 0%, rgba(255, 255, 255, var(--opacity)) 50%, transparent 100%);
    animation: wave 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    pointer-events: none;
  }

  &-once {
    &:before {
      animation-iteration-count: 1;
      animation-fill-mode: forwards;
    }
  }

  &-bright {
    --opacity: .4;
  }

  // &-canvas {
  //   position: absolute;
  //   width: 100%;
  //   height: 100%;
  // }
}
