portfolio_server/src/render_gfm.ts

40 lines
936 B
TypeScript

import { CSS, KATEX_CSS, render } from '@deno/gfm'
export function renderGfm(md: string): string {
const body = render(md, { allowMath: true })
return `
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
main {
max-width: 800px;
margin: 0 auto;
border-radius: 0.5rem;
padding: 0.5rem;
}
body {
background-color: #f7eedc;
@media (prefers-color-scheme: dark) {
background-color: #02010a;
}
}
${CSS}
${KATEX_CSS}
</style>
</head>
<body>
<main data-color-mode="auto" data-light-theme="light" data-dark-theme="dark" class="markdown-body">
${body}
</main>
</body>
</html>
`
}