Simplify theme and use better colors

3 files changed, 19 insertions, 40 deletions

diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
index 021f2b4..9c286f7 100644
--- a/src/components/Header/Header.js
+++ b/src/components/Header/Header.js
@@ -8,11 +8,8 @@ import {
 import { makeStyles } from '@material-ui/core/styles';
 
 const useStyles = makeStyles(theme => ({
-  header: {
-    backgroundColor: theme.palette.primary.dark,
-  },
   logo: {
-    color: theme.palette.orange.main,
+    color: theme.palette.secondary.main,
     margin: theme.spacing(2, 3, 2, 2)
   },
 }));
diff --git a/src/components/Scoreboard/Solution.js b/src/components/Scoreboard/Solution.js
index 6f87723..1d54b04 100644
--- a/src/components/Scoreboard/Solution.js
+++ b/src/components/Scoreboard/Solution.js
@@ -17,7 +17,6 @@ import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 
 const useStyles = makeStyles(theme => ({
   item: {
-    backgroundColor: theme.palette.secondary.dark,
     margin: theme.spacing(3),
     width: theme.spacing(60),
 
@@ -28,7 +27,7 @@ const useStyles = makeStyles(theme => ({
     },
 
     '& .MuiTypography-h2': {
-      color: theme.palette.orange.main,
+      color: theme.palette.secondary.main,
       margin: theme.spacing(2),
     },
   },
diff --git a/src/theme.js b/src/theme.js
index 350fc49..941c9cd 100644
--- a/src/theme.js
+++ b/src/theme.js
@@ -1,40 +1,23 @@
 import { createMuiTheme } from '@material-ui/core/styles'
-import createPalette from "@material-ui/core/styles/createPalette";
-
-const colorScheme = {
-  dark: '#232020',
-  grey: '#3a3535',
-  white: '#f4f4f4',
-  orange: '#ff7315',
-};
-
-const palette = createPalette({
-  primary: {
-    main: colorScheme.dark,
-  },
-  secondary: {
-    main: colorScheme.grey,
-  },
-  white: {
-    main: colorScheme.white,
-  },
-  orange: {
-    main: colorScheme.orange,
-  },
-});
-
-palette.background = {
-  default: palette.secondary.main,
-  paper: palette.secondary.dark,
-};
-
-palette.text = {
-  primary: palette.white.main,
-  secondary: palette.orange.main,
-};
 
 const theme = createMuiTheme({
-  palette
+  palette: {
+    type: 'dark',
+    primary: {
+      main: '#0a0909',
+    },
+    secondary: {
+      main: '#ff7315',
+    },
+    background: {
+      default: '#232020',
+      paper: '#0f0e0e',
+    },
+    text: {
+      primary: '#f4f4f4',
+      secondary: '#6f6666',
+    }
+  },
 });
 
 export default theme;