icon.scss 734 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. @use 'sass:map';
  2. @use 'mixins/mixins' as *;
  3. @use 'common/var' as *;
  4. .#{$namespace}-icon-loading {
  5. animation: rotating 2s linear infinite;
  6. }
  7. .#{$namespace}-icon--right {
  8. margin-left: 5px;
  9. }
  10. .#{$namespace}-icon--left {
  11. margin-right: 5px;
  12. }
  13. @keyframes rotating {
  14. 0% {
  15. transform: rotateZ(0deg);
  16. }
  17. 100% {
  18. transform: rotateZ(360deg);
  19. }
  20. }
  21. @include b(icon) {
  22. --color: inherit;
  23. height: 1em;
  24. width: 1em;
  25. line-height: 1em;
  26. display: inline-flex;
  27. justify-content: center;
  28. align-items: center;
  29. position: relative;
  30. fill: currentColor;
  31. color: var(--color);
  32. font-size: inherit;
  33. @include when(loading) {
  34. animation: rotating 2s linear infinite;
  35. }
  36. svg {
  37. height: 1em;
  38. width: 1em;
  39. }
  40. }