chore: adjust topic content css

bs32g1038 · May 6, 2024 · 906b920 · 906b920
1 parent a66dd08
commit 906b920
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 10 deletions.
diff --git a/web/components/home/components/TopicItem/index.tsx b/web/components/home/components/TopicItem/index.tsx
@@ -8,6 +8,7 @@ import { unionBy } from 'lodash';
 import dynamic from 'next/dynamic';
 import CollectButton from '@/components/CollectButton';
 import EllipsisDropdown from './components/EllipsisDropdown';
+import classnames from 'classnames';
 
 const CImage: any = dynamic(() => import('./components/CImage') as any, {
   ssr: false,
@@ -37,12 +38,12 @@ export default function TopicItem(props: { item: any; isHtml?: boolean }) {
               <p className={styles.lastEditTime}>{item.updatedAt}</p>
             </Space>
             {item.content && props.isHtml ? (
-              <p
-                className={styles.summary}
+              <div
+                className={classnames('rich-text')}
                 dangerouslySetInnerHTML={{
                   __html: item.content,
                 }}
-              ></p>
+              ></div>
             ) : (
               <p className={styles.summary}>{item.content}</p>
             )}

diff --git a/web/styles/style.scss b/web/styles/style.scss
@@ -19,8 +19,21 @@ html,
 body,
 #__next {
   font-size: 14px;
-  font-family: -apple-system, system-ui, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont,
-    Helvetica Neue, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial !important;
+  font-family:
+    -apple-system,
+    system-ui,
+    Segoe UI,
+    Roboto,
+    Ubuntu,
+    Cantarell,
+    Noto Sans,
+    sans-serif,
+    BlinkMacSystemFont,
+    Helvetica Neue,
+    PingFang SC,
+    Hiragino Sans GB,
+    Microsoft YaHei,
+    Arial !important;
   color: rgba(0, 0, 0, 0.85);
 }
 
@@ -185,7 +198,14 @@ table.ProseMirror-selectednode {
 
 .rich-text pre,
 .rich-text code {
-  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
+  font-family:
+    ui-monospace,
+    SFMono-Regular,
+    SF Mono,
+    Menlo,
+    Consolas,
+    Liberation Mono,
+    monospace;
   font-size: 12px;
   border: 0;
   border-radius: 0;
@@ -213,12 +233,11 @@ table.ProseMirror-selectednode {
 }
 
 .rich-text img {
-  width: 84.44%;
-  min-width: 556px;
-  height: 100%;
-  margin: 20px auto;
+  width: 100%;
+  height: auto;
   display: block;
   border-radius: 2px;
+  border: 1px solid rgba(0, 0, 0, 0.05);
 }
 
 .rich-text table {