Merge pull request #47 from Eug-VS/benzin

Migrate to BENZIN

7 files changed, 16 insertions, 235 deletions

diff --git a/src/components/ContentSection/ContentSection.js b/src/components/ContentSection/ContentSection.js
deleted file mode 100644
index 5108ce0..0000000
--- a/src/components/ContentSection/ContentSection.js
+++ /dev/null
@@ -1,42 +0,0 @@
-import React from 'react';
-
-import {
-  Typography,
-  Divider,
-  makeStyles
-} from '@material-ui/core';
-
-
-const useStyles = makeStyles(theme => ({
-  content: {
-    padding: theme.spacing(0, 2, 1, 2),
-    marginBottom: theme.spacing(1),
-
-    '& a': {
-      color: theme.palette.secondary.light,
-    },
-    '& .MuiButton-root': {
-      color: theme.palette.background.paper,
-      margin: theme.spacing(1, 2, 2, 0),
-      fontWeight: 'bold',
-    },
-  },
-}));
-
-const ContentSection = ({ sectionName, children }) => {
-  const classes = useStyles();
-
-  return (
-    <>
-      <Typography variant="h4">{sectionName}</Typography>
-      <Divider variant="middle"/>
-      <Typography component="div" className={classes.content}>
-        {children}
-      </Typography>
-    </>
-  );
-
-};
-
-
-export default ContentSection;
diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
deleted file mode 100644
index 1595141..0000000
--- a/src/components/Header/Header.js
+++ /dev/null
@@ -1,72 +0,0 @@
-import React from 'react';
-
-import {
-  AppBar,
-  Tabs,
-  Tab,
-  Typography,
-  Toolbar,
-} from '@material-ui/core';
-
-import { makeStyles } from '@material-ui/core/styles';
-import TimerIcon from '@material-ui/icons/Timer';
-import AccountCircleIcon from '@material-ui/icons/AccountCircle';
-import AssignmentIcon from '@material-ui/icons/Assignment';
-import GitHubIcon from '@material-ui/icons/GitHub';
-
-
-const useStyles = makeStyles(theme => ({
-  logo: {
-    color: theme.palette.secondary.main,
-    margin: theme.spacing(0, 3, 0, 3),
-  },
-  tab: {
-    '& .MuiTab-wrapper': {
-      padding: theme.spacing(2),
-      flexDirection: 'row',
-      '& svg': {
-        marginRight: theme.spacing(1),
-        marginBottom: '0 !important',
-      }
-    }
-  }
-}));
-
-
-const Header = ({ page, setPage }) => {
-  const classes = useStyles();
-
-  const handleChange = (event, newPage) => {
-    setPage(newPage);
-  };
-
-  const icons = {
-    app: (<TimerIcon />),
-    profile: (<AccountCircleIcon />),
-    scoreboard: (<AssignmentIcon />),
-    contribute: (<GitHubIcon />),
-  };
-
-  return (
-  <AppBar position="sticky">
-    <Toolbar>
-      <Typography variant="h4" className={classes.logo}>
-        ChronoCube
-      </Typography>
-      <Tabs onChange={handleChange} value={page}>
-        { Object.keys(icons).map(item => (
-          <Tab
-            label={item}
-            icon={icons[item]}
-            value={item}
-            className={classes.tab}
-            key={item}
-          />
-        ))}
-      </Tabs>
-    </Toolbar>
-  </AppBar>
-  );
-};
-
-export default Header;
diff --git a/src/components/Loading/Loading.js b/src/components/Loading/Loading.js
index e8b9701..e8793cc 100644
--- a/src/components/Loading/Loading.js
+++ b/src/components/Loading/Loading.js
@@ -12,6 +12,7 @@ import CircularProgress from '@material-ui/core/CircularProgress';
 const useStyles = makeStyles(theme => ({
   root: {
     padding: theme.spacing(1),
+    background: theme.palette.background.elevation2,
   },
 }));
 
@@ -19,7 +20,7 @@ const Loading = () => {
   const classes = useStyles();
 
   return (
-    <Card elevation={5} className={classes.root}>
+    <Card className={classes.root}>
       <CardHeader
         avatar={(<CircularProgress color="secondary" />)}
         title="Loading"
diff --git a/src/components/SmartList/SmartList.js b/src/components/SmartList/SmartList.js
deleted file mode 100644
index b462c47..0000000
--- a/src/components/SmartList/SmartList.js
+++ /dev/null
@@ -1,28 +0,0 @@
-import React from 'react';
-
-import { FixedSizeList } from 'react-window';
-import AutoSizer from 'react-virtualized-auto-sizer';
-
-
-const SmartList = ({ itemSize, itemCount, renderItem }) => {
-
-  return (
-    <div style={{ flex: '1 1 auto', overflow: 'hidden' }}>
-      <AutoSizer>
-        {({ width, height }) => (
-          <FixedSizeList
-            height={height}
-            width={width}
-            itemSize={itemSize}
-            itemCount={itemCount}
-          >
-            {renderItem}
-          </FixedSizeList>
-        )}
-      </AutoSizer>
-    </div>
-  );
-};
-
-
-export default SmartList;
diff --git a/src/components/SolutionCard/SolutionCard.js b/src/components/SolutionCard/SolutionCard.js
index 8252347..fdd4bdf 100644
--- a/src/components/SolutionCard/SolutionCard.js
+++ b/src/components/SolutionCard/SolutionCard.js
@@ -15,6 +15,7 @@ import {
 import { makeStyles } from '@material-ui/core/styles';
 import TimerIcon from '@material-ui/icons/Timer';
 import MoreVertIcon from '@material-ui/icons/MoreVert';
+import DeleteIcon from '@material-ui/icons/Delete';
 
 import { del } from '../../requests';
 
@@ -30,12 +31,17 @@ const DATE_FORMAT = {
 const useStyles = makeStyles(theme => ({
   root: {
     padding: theme.spacing(1),
+    background: theme.palette.background.elevation2,
 
     '& .MuiTypography-h3': {
-      color: theme.palette.secondary.main,
       margin: theme.spacing(2),
     },
   },
+  menu: {
+    '& ul': {
+      background: theme.palette.background.elevation3,
+    }
+  },
 }));
 
 const SolutionCard = ({ data, removeThisCard }) => {
@@ -61,7 +67,7 @@ const SolutionCard = ({ data, removeThisCard }) => {
   };
 
   return (
-    <Card elevation={5} className={classes.root}>
+    <Card className={classes.root}>
       <CardHeader
         avatar={
           author === 'anonymous'?
@@ -82,8 +88,12 @@ const SolutionCard = ({ data, removeThisCard }) => {
         open={Boolean(anchorEl)}
         keepMounted
         onClose={handleClose}
+        className={classes.menu}
       >
-        <MenuItem onClick={handleDelete}>Delete</MenuItem>
+        <MenuItem onClick={handleDelete}>
+          <DeleteIcon />
+          Delete
+        </MenuItem>
       </Menu>
       <CardContent>
         <Grid container direction="row" justify="center" alignItems="center">
@@ -91,7 +101,7 @@ const SolutionCard = ({ data, removeThisCard }) => {
             <TimerIcon/>
           </Grid>
           <Grid item>
-            <Typography variant="h3">
+            <Typography variant="h3" color="primary">
               { data.result }
             </Typography>
           </Grid>
diff --git a/src/components/Window/Window.js b/src/components/Window/Window.js
deleted file mode 100644
index 0ba2454..0000000
--- a/src/components/Window/Window.js
+++ /dev/null
@@ -1,55 +0,0 @@
-import React from 'react';
-
-import { Typography, Divider, makeStyles } from '@material-ui/core';
-
-import WindowSurface from './WindowSurface/WindowSurface';
-
-
-const useStyles = makeStyles(theme => ({
-  header: {
-    padding: theme.spacing(1, 0, 1, 2),
-    background: theme.palette.background.elevation,
-  },
-}));
-
-
-const Window = ({ type, name, children }) => {
-  const classes = useStyles();
-
-  const size = {
-    height: '85vh',
-  };
-
-  const position = {
-    bottom: '3vh',
-  };
-
-  if (type === 'primary') {
-    size.width = '63vw';
-    position.left = '2vw';
-  } else if (type === 'secondary') {
-    size.width = '31vw';
-    position.right = '2vw';
-  } else if (type === 'mono') {
-    position.left = '2vw';
-    position.right = '2vw';
-  }
-
-  return (
-    <WindowSurface
-      size={size}
-      position={position}
-    >
-      {name &&
-      <div>
-        <Typography variant="h5" className={classes.header}>{name}</Typography>
-        <Divider />
-      </div>
-      }
-      {children}
-    </WindowSurface>
-  );
-};
-
-
-export default Window;
diff --git a/src/components/Window/WindowSurface/WindowSurface.js b/src/components/Window/WindowSurface/WindowSurface.js
deleted file mode 100644
index 26fea01..0000000
--- a/src/components/Window/WindowSurface/WindowSurface.js
+++ /dev/null
@@ -1,33 +0,0 @@
-import React from 'react';
-
-import { Paper, makeStyles } from '@material-ui/core';
-
-
-const useStyles = makeStyles(theme => ({
-  surface: {
-    position: 'absolute',
-    display: 'flex',
-    flexDirection: 'column',
-    background: theme.palette.background.elevation,
-    overflowY: 'auto',
-    scrollbarColor: `${theme.palette.primary.dark} ${theme.palette.primary.light}`,
-  }
-}));
-
-
-const WindowSurface = ({ size, position, children }) => {
-  const classes = useStyles();
-
-  return (
-    <Paper
-      elevation={3}
-      style={{...size, ...position}}
-      className={classes.surface}
-    >
-      {children}
-    </Paper>
-  )
-};
-
-
-export default WindowSurface;
\ No newline at end of file