Move global styles to their own file

1 files changed, 40 insertions, 0 deletions

diff --git a/src/globalStyles.ts b/src/globalStyles.ts
new file mode 100644
index 0000000..431ee36
--- /dev/null
+++ b/src/globalStyles.ts
@@ -0,0 +1,40 @@
+import { css } from "@emotion/core";
+
+import colors from "./colors";
+
+export default css`
+@import url('https://fonts.googleapis.com/css2?family=Hind:wght@700&display=swap');
+
+@font-face {
+    font-family: 'Uni Sans';
+    src: url(/fonts/unisans.otf) format('opentype');
+}
+
+body {
+    background-color: ${colors.notQuiteBlack};
+    color: white;
+    font-family: "Hind", "Helvetica", "Arial", sans-serif;
+    margin: 0;
+}
+
+.fade-enter,
+.fade-exit {
+    position: absolute;
+    top: 0;
+    left: 0;
+    transition: 300ms ease-in-out opacity, 300ms ease-in-out transform;
+    width: 100%;
+}
+
+.fade-enter,
+.fade-exit-active {
+    opacity: 0;
+    transform: scale(0.98);
+}
+
+.fade-enter-active {
+    opacity: 1;
+    z-index: 1;
+    transform: scale(1);
+}
+`;