feat: ✨ markdown 添加 github 风格 alerts

xiaohuohumax · Oct 16, 2024 · 2149996 · 2149996
1 parent 6f78c2a
commit 2149996
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 9 deletions.
diff --git a/app/web/CHANGELOG.md b/app/web/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @xiaohuohumax/miaoji-web
 
+## 1.5.0
+
+### Minor Changes
+
+- markdown 添加 github 风格 alerts
+
 ## 1.4.1
 
 ### Minor Changes

diff --git a/app/web/package.json b/app/web/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@xiaohuohumax/miaoji-web",
   "type": "module",
-  "version": "1.4.1",
+  "version": "1.5.0",
   "private": true,
   "description": "MiaoJi web client",
   "author": {
@@ -26,6 +26,7 @@
     "@xiaohuohumax/miaoji-util": "workspace:^",
     "await-to-js": "^3.0.0",
     "markdown-it-emoji": "^3.0.0",
+    "markdown-it-github-alerts": "^0.3.0",
     "md-editor-v3": "^4.20.2",
     "naive-ui": "^2.39.0",
     "octokit": "^4.0.2",

diff --git a/app/web/src/views/components/CMarkdown.vue b/app/web/src/views/components/CMarkdown.vue
@@ -1,8 +1,12 @@
 <script setup lang="ts">
 import { full as emoji } from 'markdown-it-emoji'
+import MarkdownItGitHubAlerts from 'markdown-it-github-alerts'
 import { config, MdPreview } from 'md-editor-v3'
 import { useAppStore } from '~/store/app'
 import 'md-editor-v3/lib/style.css'
+import 'markdown-it-github-alerts/styles/github-colors-light.css'
+import 'markdown-it-github-alerts/styles/github-colors-dark-class.css'
+import 'markdown-it-github-alerts/styles/github-base.css'
 
 export interface CMarkdownProps {
   content?: string | null
@@ -15,6 +19,7 @@ const appStore = useAppStore()
 config({
   markdownItConfig: (md) => {
     md.use(emoji)
+    md.use(MarkdownItGitHubAlerts)
   },
 })
 </script>

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml