aboutsummaryrefslogtreecommitdiff
path: root/src/containers/Profile/Highlight.tsx
diff options
context:
space:
mode:
authoreug-vs <eug-vs@keemail.me>2020-08-10 11:19:53 +0300
committereug-vs <eug-vs@keemail.me>2020-08-10 11:19:53 +0300
commitf97989967ee0b88a8c64f226a4b28a79eeef5fd2 (patch)
tree9311246c260705c3c89fded54fb0bb688c98beec /src/containers/Profile/Highlight.tsx
parentcab8de5c6b246e1aa1376fa2b8666f09b44b6469 (diff)
downloadwhich-ui-f97989967ee0b88a8c64f226a4b28a79eeef5fd2.tar.gz
refactor: remove "Page" from container names
Diffstat (limited to 'src/containers/Profile/Highlight.tsx')
-rw-r--r--src/containers/Profile/Highlight.tsx39
1 files changed, 39 insertions, 0 deletions
diff --git a/src/containers/Profile/Highlight.tsx b/src/containers/Profile/Highlight.tsx
new file mode 100644
index 0000000..ebc3f56
--- /dev/null
+++ b/src/containers/Profile/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;