gokcan/react-shimmer

View on GitHub
src/loaders/shimmer/styles.css

Summary

Maintainability
Test Coverage
:root {
  --default-bg-color: #f6f7f8;
  --default-bg-moving-gradient: linear-gradient(to right, rgb(238, 238, 238) 8%, rgb(222, 222, 222) 18%,  rgb(238, 238, 238) 33%);
}

.shimmer {
  background: var(--default-bg-color);
    background-image: var(--default-bg-moving-gradient);
  background-repeat: no-repeat;
  animation: shimmering forwards infinite ease-in-out, fadein 0.02s forwards;
}

@keyframes fadein {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes shimmering {
    from {
        background-position: top right;
    }

    to {
        background-position: top left;
    }
}