spinner.tsx 571 B

12345678910111213141516171819202122232425
  1. import {keyframes} from '@emotion/react';
  2. import styled from '@emotion/styled';
  3. const spin = keyframes`
  4. 0% {
  5. transform: rotate(0deg);
  6. }
  7. 100% {
  8. transform: rotate(360deg);
  9. }
  10. `;
  11. const Spinner = styled('div')`
  12. animation: ${spin} 0.4s linear infinite;
  13. width: 18px;
  14. height: 18px;
  15. border-radius: 18px;
  16. border-top: 2px solid ${p => p.theme.border};
  17. border-right: 2px solid ${p => p.theme.border};
  18. border-bottom: 2px solid ${p => p.theme.border};
  19. border-left: 2px solid ${p => p.theme.purple300};
  20. margin-left: auto;
  21. `;
  22. export default Spinner;