fix: edit answer page style adjustment

ui/src/common/sideNavLayout.scss

@@ -1,28 +1,17 @@
+// .flex-auto {
+//   max-width: 70%;
+// }
 .page-right-side {
   flex: none;
   width: 30%;
 }
 
-.line {
-  position: absolute;
-  top: 0;
-  right: 12px;
-  width: 1px;
-  height: 100%;
-  background-color: var(--bs-gray-300);
-  min-height: calc(100vh - 62px - 74px);
-}
-
 // lg
 @media screen and (max-width: 1199.9px) {
+  // .flex-auto {
+  //   max-width: 100%;
+  // }
   .page-right-side {
     width: 100%;
   }
 }
-
-// md
-@media screen and (max-width: 991.9px) {
-  .line {
-    display: none;
-  }
-}

ui/src/components/Editor/utils/index.ts

@@ -94,13 +94,17 @@ export function htmlRender(el: HTMLElement | null) {
 
     el.querySelectorAll('.language-mermaid').forEach((pre) => {
       const flag = Date.now();
-      mermaid.render(`theGraph${flag}`, pre.textContent, function (svgCode) {
-        const p = document.createElement('p');
-        p.className = 'text-center';
-        p.innerHTML = svgCode;
+      mermaid.render(
+        `theGraph${flag}`,
+        pre.textContent || '',
+        function (svgCode) {
+          const p = document.createElement('p');
+          p.className = 'text-center';
+          p.innerHTML = svgCode;
 
-        pre.parentNode?.replaceChild(p, pre);
-      });
+          pre.parentNode?.replaceChild(p, pre);
+        },
+      );
     });
   });
   import('katex/contrib/auto-render/auto-render').then(

ui/src/components/SideNav/index.scss

@@ -14,6 +14,15 @@
     color: black;
     background-color: var(--bs-gray-200);
   }
+  .side-nav-right-line {
+    position: absolute;
+    top: 0;
+    right: 12px;
+    width: 1px;
+    height: 100%;
+    background-color: var(--bs-gray-300);
+    min-height: calc(100vh - 62px - 74px);
+  }
 }
 
 @media screen and (max-width: 991.9px) {
@@ -21,5 +30,8 @@
     .nav {
       max-width: 100%;
     }
+    .side-nav-right-line {
+      display: none;
+    }
   }
 }

ui/src/components/SideNav/index.tsx

@@ -66,7 +66,7 @@ const Index: FC = () => {
           </>
         ) : null}
       </Nav>
-      <div className="line" />
+      <div className="side-nav-right-line" />
     </Col>
   );
 };