loading.scss 717 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. .cl-loading {
  2. display: inline-block;
  3. line-height: 1;
  4. @keyframes loading-rotate {
  5. 0% {
  6. transform: rotate(0);
  7. }
  8. 100% {
  9. transform: rotate(360deg);
  10. }
  11. }
  12. &__inner {
  13. height: 100%;
  14. width: 100%;
  15. border-radius: 100%;
  16. border-style: solid;
  17. box-sizing: border-box;
  18. animation: loading-rotate 1s linear infinite;
  19. color: $cl-color-primary;
  20. }
  21. &--spin {
  22. position: relative;
  23. animation: loading-rotate 2s linear infinite;
  24. }
  25. &__spin {
  26. position: absolute;
  27. left: 0;
  28. top: 0;
  29. height: 100%;
  30. width: 100%;
  31. &-item {
  32. background-color: currentColor;
  33. position: absolute;
  34. border-radius: 5px;
  35. color: $cl-color-primary;
  36. }
  37. &:nth-child(2) {
  38. transform: rotate(45deg);
  39. }
  40. }
  41. }