✨ Markdown content

pkg/view/package.json

@@ -17,11 +17,13 @@
     "hls.js": "^1.5.3",
     "medium-zoom": "^1.1.0",
     "solid-js": "^1.8.7",
+    "solid-markdown": "^2.0.0",
     "universal-cookie": "^7.0.2"
   },
   "devDependencies": {
+    "@tailwindcss/typography": "^0.5.10",
     "autoprefixer": "^10.4.17",
-    "daisyui": "^4.6.0",
+    "daisyui": "^4.6.1",
     "postcss": "^8.4.33",
     "solid-devtools": "^0.29.3",
     "tailwindcss": "^3.4.1",

pkg/view/src/components/PostItem.tsx

@@ -1,6 +1,7 @@
 import { createSignal, For, Show } from "solid-js";
 import { getAtk, useUserinfo } from "../stores/userinfo.tsx";
 import PostAttachments from "./PostAttachments.tsx";
+import { SolidMarkdown } from "solid-markdown";
 
 export default function PostItem(props: {
   post: any,
@@ -55,18 +56,20 @@ export default function PostItem(props: {
         </a>
       </Show>
 
-      <div class="py-5 px-7">
+      <div class="px-7">
         <h2 class="card-title">{props.post.title}</h2>
-        <article class="prose">{props.post.content}</article>
+        <article class="prose">
+          <SolidMarkdown children={props.post.content} />
+        </article>
 
         <div class="mt-2 flex gap-2">
           <For each={props.post.categories}>
-            {item => <a class="link link-primary">
+            {item => <a class="link link-primary pb-5">
               #{item.name}
             </a>}
           </For>
           <For each={props.post.tags}>
-            {item => <a class="link link-primary">
+            {item => <a class="link link-primary pb-5">
               #{item.name}
             </a>}
           </For>

pkg/view/tailwind.config.js

@@ -39,6 +39,6 @@ export default {
       }
     ]
   },
-  plugins: [require("daisyui")]
+  plugins: [require("daisyui"), require("@tailwindcss/typography")]
 };