From d592d4e99adfcd2e5b08b714b03228003e31666a Mon Sep 17 00:00:00 2001
From: archer <545436317@qq.com>
Date: Tue, 20 Jun 2023 14:49:43 +0800
Subject: [PATCH] markdown

---
 client/src/components/Markdown/{ => img}/Image.tsx          | 0
 client/src/components/Markdown/{ => img}/Loading.tsx        | 0
 .../src/components/Markdown/{ => img}/MermaidCodeBlock.tsx  | 6 ++----
 client/src/components/Markdown/index.tsx                    | 4 ++--
 4 files changed, 4 insertions(+), 6 deletions(-)
 rename client/src/components/Markdown/{ => img}/Image.tsx (100%)
 rename client/src/components/Markdown/{ => img}/Loading.tsx (100%)
 rename client/src/components/Markdown/{ => img}/MermaidCodeBlock.tsx (96%)

diff --git a/client/src/components/Markdown/Image.tsx b/client/src/components/Markdown/img/Image.tsx
similarity index 100%
rename from client/src/components/Markdown/Image.tsx
rename to client/src/components/Markdown/img/Image.tsx
diff --git a/client/src/components/Markdown/Loading.tsx b/client/src/components/Markdown/img/Loading.tsx
similarity index 100%
rename from client/src/components/Markdown/Loading.tsx
rename to client/src/components/Markdown/img/Loading.tsx
diff --git a/client/src/components/Markdown/MermaidCodeBlock.tsx b/client/src/components/Markdown/img/MermaidCodeBlock.tsx
similarity index 96%
rename from client/src/components/Markdown/MermaidCodeBlock.tsx
rename to client/src/components/Markdown/img/MermaidCodeBlock.tsx
index dcf720e60..70374fe83 100644
--- a/client/src/components/Markdown/MermaidCodeBlock.tsx
+++ b/client/src/components/Markdown/img/MermaidCodeBlock.tsx
@@ -2,9 +2,7 @@ import React, { useEffect, useRef, memo, useCallback, useState, useMemo } from '
 import { Box } from '@chakra-ui/react';
 // @ts-ignore
 import mermaid from 'mermaid';
-import MyIcon from '../Icon';
-
-import styles from './index.module.scss';
+import MyIcon from '../../Icon';
 
 const mermaidAPI = mermaid.mermaidAPI;
 mermaidAPI.initialize({
@@ -110,8 +108,8 @@ const MermaidBlock = ({ code }: { code: string }) => {
       }}
     >
       <Box
+        overflowX={'auto'}
         ref={ref}
-        className={`${styles.mermaid}`}
         minW={'100px'}
         minH={'50px'}
         py={4}
diff --git a/client/src/components/Markdown/index.tsx b/client/src/components/Markdown/index.tsx
index cd2a5b285..e5885972b 100644
--- a/client/src/components/Markdown/index.tsx
+++ b/client/src/components/Markdown/index.tsx
@@ -10,8 +10,8 @@ import styles from './index.module.scss';
 
 import Link from './Link';
 import CodeLight from './CodeLight';
-import MermaidCodeBlock from './MermaidCodeBlock';
-import MdImage from './Image';
+import MermaidCodeBlock from './img/MermaidCodeBlock';
+import MdImage from './img/Image';
 
 function Code({ inline, className, children }: any) {
   const match = /language-(\w+)/.exec(className || '');