feat: add icons, better suited than emojis

This commit is contained in:
Julien Calixte
2026-03-17 23:43:29 +01:00
parent 514d08946d
commit 944b128894
3 changed files with 17 additions and 0 deletions

View File

@@ -25,6 +25,11 @@
rel="stylesheet" rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/4.0.0/github-markdown.min.css" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/4.0.0/github-markdown.min.css"
/> />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/dist/tabler-icons.min.css"
fetchpriority="low"
/>
</head> </head>
<body> <body>
<noscript> <noscript>

View File

@@ -9,6 +9,7 @@ import { Ref, toValue } from "vue"
import { decodeBase64ToUTF8 } from "@/utils/decodeBase64ToUTF8" import { decodeBase64ToUTF8 } from "@/utils/decodeBase64ToUTF8"
import { html5Media } from "@/utils/markdown/markdown-html5-media" import { html5Media } from "@/utils/markdown/markdown-html5-media"
import { markdownItTablerIcons } from "@/utils/markdown/markdown-it-tabler-icons"
import mermaid from "mermaid" import mermaid from "mermaid"
import type Token from "markdown-it/lib/token.mjs" import type Token from "markdown-it/lib/token.mjs"
import Renderer, { type RenderRuleRecord } from "markdown-it/lib/renderer.mjs" import Renderer, { type RenderRuleRecord } from "markdown-it/lib/renderer.mjs"
@@ -62,6 +63,7 @@ const md = new MarkdownIt({
width: "100%", width: "100%",
}) })
.use(MarkdownItGitHubAlerts) .use(MarkdownItGitHubAlerts)
.use(markdownItTablerIcons)
let shikijiInitialized = false let shikijiInitialized = false

View File

@@ -0,0 +1,10 @@
import { markdownItPlugin } from "./markdown-it-regexp"
// Matches :icon-name: where icon-name is letters, digits, hyphens
export const markdownItTablerIcons = markdownItPlugin(
/:([\w-]+):/,
(match) => {
const name = match[0][1]
return `<i class="ti ti-${name}"></i>`
},
)