aboutsummaryrefslogtreecommitdiff
path: root/src/containers/ProfilePage/Highlight.tsx
diff options
context:
space:
mode:
authoreug-vs <eug-vs@keemail.me>2020-08-10 00:28:39 +0300
committereug-vs <eug-vs@keemail.me>2020-08-10 00:28:39 +0300
commit7ba15a22d1bd57e7c26ff2d5fccf5505aaf8619e (patch)
tree8a71d8dd4bf89f09f14aee2636f519572e95f891 /src/containers/ProfilePage/Highlight.tsx
parentdfa6f0a8d1415539e1ff6a3ca848627bbe87b470 (diff)
downloadwhich-ui-7ba15a22d1bd57e7c26ff2d5fccf5505aaf8619e.tar.gz
refactor: move pages -> containers
Diffstat (limited to 'src/containers/ProfilePage/Highlight.tsx')
-rw-r--r--src/containers/ProfilePage/Highlight.tsx39
1 files changed, 39 insertions, 0 deletions
diff --git a/src/containers/ProfilePage/Highlight.tsx b/src/containers/ProfilePage/Highlight.tsx
new file mode 100644
index 0000000..ebc3f56
--- /dev/null
+++ b/src/containers/ProfilePage/Highlight.tsx
@@ -0,0 +1,39 @@
+import React from 'react';
+import { makeStyles } from '@material-ui/core/styles';
+
+interface PropTypes {
+ text: string;
+ value: string | number;
+}
+
+const useStyles = makeStyles({
+ root: {
+ position: 'relative'
+ },
+ menuButton: {
+ width: 200,
+ height: 50,
+ textAlign: 'center'
+ },
+ menuNumber: {
+ fontWeight: 800,
+ color: 'black'
+ },
+ menuText: {
+ color: 'darkgray'
+ }
+});
+
+
+const Highlight: React.FC<PropTypes> = ({ text, value }) => {
+ const classes = useStyles();
+
+ return (
+ <div className={classes.menuButton}>
+ <div className={classes.menuNumber}>{value}</div>
+ <div className={classes.menuText}>{text}</div>
+ </div>
+ );
+};
+
+export default Highlight;