From d458175671466bc6c4d31eef625d6e47dfdb2835 Mon Sep 17 00:00:00 2001
From: Hazem Krimi <krimihazem1@gmail.com>
Date: Tue, 5 Jan 2021 22:50:47 +0100
Subject: [PATCH] Add global styles component

---
 components/GlobalStyles.tsx | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 components/GlobalStyles.tsx

diff --git a/components/GlobalStyles.tsx b/components/GlobalStyles.tsx
new file mode 100644
index 0000000..afe3a64
--- /dev/null
+++ b/components/GlobalStyles.tsx
@@ -0,0 +1,30 @@
+import { FC, useContext } from 'react';
+import { createGlobalStyle } from 'styled-components';
+import { DarkModeContext } from '../components/DarkMode';
+
+export interface Props {
+	dark: boolean;
+}
+
+const Global = createGlobalStyle<Props>`
+  * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+		font-family: 'Source Code Pro', monospace;
+		font-size: 17px;
+  }
+
+	body {
+		background: ${({ dark }) => (dark ? '#262626' : '#F9F9F9')};
+    color: ${({ dark }) => (dark ? 'white' : 'black')};
+	}
+`;
+
+const GlobalStyles: FC = () => {
+	const { dark } = useContext(DarkModeContext);
+
+	return <Global dark={dark} />;
+};
+
+export default GlobalStyles;