From f67d9b549f8cba939a0420c16207a9e71b03be37 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Sun, 5 Apr 2020 09:06:02 +0300
Subject: feat: change sectionName size respectively

---
 src/lib/ContentSection/ContentSection.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

(limited to 'src/lib/ContentSection')

diff --git a/src/lib/ContentSection/ContentSection.tsx b/src/lib/ContentSection/ContentSection.tsx
index 68ecbca..ba8b882 100644
--- a/src/lib/ContentSection/ContentSection.tsx
+++ b/src/lib/ContentSection/ContentSection.tsx
@@ -9,11 +9,12 @@ import {
 
 interface PropTypes {
   sectionName: string;
+  level?: number;
 }
 
 const useStyles = makeStyles(theme => ({
   content: {
-    padding: theme.spacing(1, 2, 1, 3),
+    padding: theme.spacing(2, 2, 1, 3),
     marginBottom: theme.spacing(1),
 
     '& .MuiButton-root': {
@@ -22,12 +23,18 @@ const useStyles = makeStyles(theme => ({
   },
 }));
 
-const ContentSection: React.FC<PropTypes> = ({ sectionName, children }) => {
+const ContentSection: React.FC<PropTypes> = ({ sectionName, children, level = 0 }) => {
   const classes = useStyles();
 
+  level += 2; // Make everything smaller
+  if (level > 6) level = 6;
+
+  type Variant = 'h3' | 'h4' | 'h5' | 'h6';
+  const variant: Variant = 'h' + level as Variant;
+
   return (
     <>
-      <Typography variant="h4">{sectionName}</Typography>
+      <Typography variant={variant}>{sectionName}</Typography>
       <Divider variant="middle"/>
       <Typography component="div" className={classes.content}>
         {children}
-- 
cgit v1.2.3