monitorIcon.tsx 507 B

12345678910111213141516171819202122
  1. import styled from '@emotion/styled';
  2. import {Status} from './types';
  3. export default styled('div')<{size: number; status: Status}>`
  4. display: inline-block;
  5. position: relative;
  6. border-radius: 50%;
  7. height: ${p => p.size}px;
  8. width: ${p => p.size}px;
  9. ${p =>
  10. p.color
  11. ? `background: ${p.color};`
  12. : `background: ${
  13. p.status === 'error'
  14. ? p.theme.error
  15. : p.status === 'ok'
  16. ? p.theme.success
  17. : p.theme.disabled
  18. };`};
  19. `;