From 5ca81269e2c00c1c9ea614ccc8f8e295850d592f Mon Sep 17 00:00:00 2001
From: Vincent Bitter <v.bitter@maxiblue.nl>
Date: Mon, 9 Dec 2019 17:26:48 +0100
Subject: [PATCH] Use Material UI CssBaseline

---
 website/src/index.css | 13 -------------
 website/src/index.tsx | 12 ++++++++++--
 2 files changed, 10 insertions(+), 15 deletions(-)
 delete mode 100644 website/src/index.css

diff --git a/website/src/index.css b/website/src/index.css
deleted file mode 100644
index ec2585e8..00000000
--- a/website/src/index.css
+++ /dev/null
@@ -1,13 +0,0 @@
-body {
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-}
diff --git a/website/src/index.tsx b/website/src/index.tsx
index e5b0687b..4d4c52d7 100644
--- a/website/src/index.tsx
+++ b/website/src/index.tsx
@@ -1,12 +1,20 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+import CssBaseline from '@material-ui/core/CssBaseline';
+import Box from '@material-ui/core/Box';
 import Devices from './components/Devices';
 import { view } from 'react-easy-state';
 import 'typeface-roboto';
-import './index.css';
 
 const App = view(() => {
-  return <Devices />;
+  return (
+    <React.Fragment>
+      <CssBaseline />
+      <Box component="div" m={3}>
+        <Devices />
+      </Box>
+    </React.Fragment>
+  );
 });
 
 ReactDOM.render(<App />, document.getElementById('root'));