globalStyles.tsx 725 B

123456789101112131415161718192021222324252627282930313233343536
  1. import type {Theme} from '@emotion/react';
  2. import {css, Global} from '@emotion/react';
  3. const styles = (theme: Theme) => css`
  4. body {
  5. color: ${theme.textColor};
  6. background: ${theme.backgroundSecondary};
  7. }
  8. a {
  9. color: ${theme.linkColor};
  10. &:hover {
  11. color: ${theme.linkHoverColor};
  12. }
  13. }
  14. .loading .loading-indicator {
  15. border-color: ${theme.backgroundSecondary};
  16. border-left-color: ${theme.purple300};
  17. }
  18. acronym,
  19. abbr {
  20. border-bottom: 1px dotted #ccc;
  21. text-decoration: none;
  22. }
  23. `;
  24. /**
  25. * Renders an emotion global styles injection component
  26. */
  27. function GlobalStyles({theme}: {theme: Theme}) {
  28. return <Global styles={styles(theme)} />;
  29. }
  30. export default GlobalStyles;