From f5c21698a09d9214f57ce6dab2595f3d61e1ff11 Mon Sep 17 00:00:00 2001
From: eug-vs <eug-vs@keemail.me>
Date: Thu, 7 Jan 2021 13:22:21 +0300
Subject: feat!: use react-markdown

---
 src/lib/Markdown/Heading.tsx | 33 +++++++++++++++++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 src/lib/Markdown/Heading.tsx

(limited to 'src/lib/Markdown/Heading.tsx')

diff --git a/src/lib/Markdown/Heading.tsx b/src/lib/Markdown/Heading.tsx
new file mode 100644
index 0000000..cc0b709
--- /dev/null
+++ b/src/lib/Markdown/Heading.tsx
@@ -0,0 +1,33 @@
+import React from 'react';
+import { Typography, Divider, makeStyles } from '@material-ui/core';
+
+interface PropTypes {
+  level: number;
+}
+
+type Variant = 'h3' | 'h4' | 'h5' | 'h6';
+
+const useStyles = makeStyles(theme => ({
+  root: {
+    padding: theme.spacing(2, 0, 1, 0),
+  },
+}));
+
+const Heading: React.FC<PropTypes> = ({ children, level }) => {
+  const classes = useStyles();
+
+  let adjustedLevel = level + 2; // Make everything smaller
+  if (adjustedLevel > 6) adjustedLevel = 6;
+
+  const variant: Variant = `h${adjustedLevel}` as Variant;
+
+  return (
+    <div className={classes.root}>
+      <Typography variant={variant}>{children}</Typography>
+      <Divider variant="middle" />
+    </div>
+  );
+};
+
+export default Heading;
+
-- 
cgit v1.2.3

