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/dialog/AlertDialog.tsx

@@ -6,6 +6,7 @@ import { fetchNui } from '../../utils/fetchNui';
 import { useLocales } from '../../providers/LocaleProvider';
 import remarkGfm from 'remark-gfm';
 import type { AlertProps } from '../../typings';
+import MarkdownComponents from '../../config/MarkdownComponents';
 
 const AlertDialog: React.FC = () => {
   const { locale } = useLocales();
@@ -46,12 +47,13 @@ const AlertDialog: React.FC = () => {
         overlayOpacity={0.5}
         exitTransitionDuration={150}
         transition="fade"
-        title={<ReactMarkdown>{dialogData.header}</ReactMarkdown>}
+        title={<ReactMarkdown components={MarkdownComponents}>{dialogData.header}</ReactMarkdown>}
       >
         <Stack>
           <ReactMarkdown
             remarkPlugins={[remarkGfm]}
             components={{
+              ...MarkdownComponents,
               img: ({ ...props }) => <img style={{ maxWidth: '100%', maxHeight: '100%' }} {...props} />,
             }}
           >