From 57a8a5dccbc267543799fd01192b2a1534e53c64 Mon Sep 17 00:00:00 2001 From: Eug-VS Date: Sun, 5 Jan 2020 01:57:42 +0300 Subject: Isolate SolutionCard component --- src/components/Scoreboard/Scoreboard.js | 4 +- src/components/Scoreboard/Solution.js | 71 ----------------------------- src/components/SolutionCard/SolutionCard.js | 71 +++++++++++++++++++++++++++++ 3 files changed, 73 insertions(+), 73 deletions(-) delete mode 100644 src/components/Scoreboard/Solution.js create mode 100644 src/components/SolutionCard/SolutionCard.js (limited to 'src') diff --git a/src/components/Scoreboard/Scoreboard.js b/src/components/Scoreboard/Scoreboard.js index 1235f9a..399a017 100644 --- a/src/components/Scoreboard/Scoreboard.js +++ b/src/components/Scoreboard/Scoreboard.js @@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react'; import { Container, Typography } from "@material-ui/core"; import { get } from "../../requests"; -import Solution from "./Solution"; +import SolutionCard from "../SolutionCard/SolutionCard"; const Scoreboard = () => { @@ -22,7 +22,7 @@ const Scoreboard = () => { return ( Scoreboard - {solutions.map(solution => ())} + {solutions.map(solution => ())} ); }; diff --git a/src/components/Scoreboard/Solution.js b/src/components/Scoreboard/Solution.js deleted file mode 100644 index 1d54b04..0000000 --- a/src/components/Scoreboard/Solution.js +++ /dev/null @@ -1,71 +0,0 @@ -import React from 'react'; - -import { - Typography, - Card, - Container, - Box, - ExpansionPanelSummary, - ExpansionPanel, - ExpansionPanelDetails, -} from "@material-ui/core"; - -import { makeStyles } from "@material-ui/core/styles"; -import TimerIcon from '@material-ui/icons/Timer'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; - - -const useStyles = makeStyles(theme => ({ - item: { - margin: theme.spacing(3), - width: theme.spacing(60), - - '& .MuiBox-root': { - display: 'flex', - justifyContent: 'center', - alignItems: 'center', - }, - - '& .MuiTypography-h2': { - color: theme.palette.secondary.main, - margin: theme.spacing(2), - }, - }, - -})); - -const Solution = ({ solution }) => { - const classes = useStyles(); - - const author = solution.author? solution.author : 'anonymous'; - return ( - - - - - - { solution.result } - - - - - - }> - - By {author} - - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit. - Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget. - Lorem ipsum dolor sit amet, consectetur adipiscing elit. - Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget. - - - - - ) -}; - -export default Solution; diff --git a/src/components/SolutionCard/SolutionCard.js b/src/components/SolutionCard/SolutionCard.js new file mode 100644 index 0000000..41d61c1 --- /dev/null +++ b/src/components/SolutionCard/SolutionCard.js @@ -0,0 +1,71 @@ +import React from 'react'; + +import { + Typography, + Card, + Container, + Box, + ExpansionPanelSummary, + ExpansionPanel, + ExpansionPanelDetails, +} from "@material-ui/core"; + +import { makeStyles } from "@material-ui/core/styles"; +import TimerIcon from '@material-ui/icons/Timer'; +import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; + + +const useStyles = makeStyles(theme => ({ + item: { + margin: theme.spacing(3), + width: theme.spacing(60), + + '& .MuiBox-root': { + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + }, + + '& .MuiTypography-h2': { + color: theme.palette.secondary.main, + margin: theme.spacing(2), + }, + }, + +})); + +const SolutionCard = ({ solution }) => { + const classes = useStyles(); + + const author = solution.author? solution.author : 'anonymous'; + return ( + + + + + + { solution.result } + + + + + + }> + + By {author} + + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. + Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget. + Lorem ipsum dolor sit amet, consectetur adipiscing elit. + Suspendisse malesuada lacus ex, sit amet blandit leo lobortis eget. + + + + + ) +}; + +export default SolutionCard; -- cgit v1.2.3