tweak(web): adjust markdown heading margins (#393)

* tweak(web): components for markdown headings

Fixed nomenclature and set as default export.

* fix(ui): temp remove MarkdownComponents file

* fix(ui): return MarkdownComponents file

web/src/features/notifications/NotificationWrapper.tsx

@@ -5,6 +5,7 @@ import ReactMarkdown from 'react-markdown';
 import { Avatar, createStyles, Group, Stack, Box, Text, keyframes, Sx } from '@mantine/core';
 import React from 'react';
 import type { NotificationProps } from '../../typings';
+import MarkdownComponents from '../../config/MarkdownComponents';
 
 const useStyles = createStyles((theme) => ({
   container: {
@@ -181,7 +182,10 @@ const Notifications: React.FC = () => {
             <Stack spacing={0}>
               {data.title && <Text className={classes.title}>{data.title}</Text>}
               {data.description && (
-                <ReactMarkdown className={`${!data.title ? classes.descriptionOnly : classes.description} description`}>
+                <ReactMarkdown
+                  components={MarkdownComponents}
+                  className={`${!data.title ? classes.descriptionOnly : classes.description} description`}
+                >
                   {data.description}
                 </ReactMarkdown>
               )}