diff options
author | Eug-VS <eug-vs@keemail.me> | 2020-01-26 15:50:08 +0300 |
---|---|---|
committer | Eug-VS <eug-vs@keemail.me> | 2020-01-26 15:57:53 +0300 |
commit | caee577929870603eb0ef7f28c89c2c4207b8050 (patch) | |
tree | 453a18f0bb12539a0b78ba1323ac4a336d6efd52 /src/lib/components/ContentSection/ContentSection.js | |
parent | 54f982569b67f7401d91d9e9642065a403d4eb61 (diff) | |
download | react-benzin-caee577929870603eb0ef7f28c89c2c4207b8050.tar.gz |
feat: initialize npm module, add components
Diffstat (limited to 'src/lib/components/ContentSection/ContentSection.js')
-rw-r--r-- | src/lib/components/ContentSection/ContentSection.js | 42 |
1 files changed, 42 insertions, 0 deletions
diff --git a/src/lib/components/ContentSection/ContentSection.js b/src/lib/components/ContentSection/ContentSection.js new file mode 100644 index 0000000..5108ce0 --- /dev/null +++ b/src/lib/components/ContentSection/ContentSection.js @@ -0,0 +1,42 @@ +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; |