zucchetti-sa5/themes/onepirate/modules/components/Markdown.js

50 lines
1.1 KiB
JavaScript
Raw Normal View History

2022-10-28 11:41:58 +02:00
import * as React from 'react';
import ReactMarkdown from 'markdown-to-jsx';
import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';
import Link from '@mui/material/Link';
const options = {
overrides: {
h1: {
component: Typography,
props: {
gutterBottom: true,
variant: 'h4',
},
},
h2: {
component: Typography,
props: { gutterBottom: true, variant: 'h6' },
},
h3: {
component: Typography,
props: { gutterBottom: true, variant: 'subtitle1' },
},
h4: {
component: Typography,
props: {
gutterBottom: true,
variant: 'caption',
paragraph: true,
},
},
p: {
component: Typography,
props: { paragraph: true },
},
a: { component: Link },
li: {
component: (props) => (
<Box component="li" sx={{ mt: 1 }}>
<Typography component="span" {...props} />
</Box>
),
},
},
};
export default function Markdown(props) {
return <ReactMarkdown options={options} {...props} />;
}