client: improve markdown styles

client/components/preview/index.tsx

@@ -47,7 +47,7 @@ const MarkdownPreview = ({ height = 500, fileId, content, title }: Props) => {
         fetchPost()
     }, [content, fileId, title])
     return (<>
-        {isLoading ? <div>Loading...</div> : <div data-theme={theme} className={styles.markdownPreview} dangerouslySetInnerHTML={{ __html: preview }} style={{
+        {isLoading ? <div>Loading...</div> : <article data-theme={theme} className={styles.markdownPreview} dangerouslySetInnerHTML={{ __html: preview }} style={{
             height
         }} />}
     </>)

client/components/preview/preview.module.css

@@ -75,19 +75,10 @@
   content: "";
 }
 
-.markdownPreview ul ul {
-  list-style: circle;
-}
-
-.markdownPreview ul ul li {
-  margin-left: var(--gap);
-}
-
 .markdownPreview code {
   border-radius: 3px;
   white-space: pre-wrap;
   word-wrap: break-word;
-  padding: 2px 4px;
 }
 
 .markdownPreview code::before,

client/lib/render-markdown.tsx

@@ -1,6 +1,7 @@
 import { marked } from 'marked'
-import Highlight, { defaultProps, Language } from 'prism-react-renderer'
+import Highlight, { defaultProps, Language, } from 'prism-react-renderer'
 import { renderToStaticMarkup } from 'react-dom/server'
+
 //@ts-ignore
 delete defaultProps.theme
 // import linkStyles from '../components/link/link.module.css'

client/styles/markdown.css

@@ -8,10 +8,6 @@ article > * + * {
   margin-top: 2em;
 }
 
-article p {
-  color: var(--article-color);
-}
-
 article img {
   max-width: 100%;
   /* width: var(--main-content); */