diff --git a/functions/chips/[shuttle]/[project]/index.ts b/functions/chips/[shuttle]/[project]/index.ts index 6ac876f4..bc0e8211 100644 --- a/functions/chips/[shuttle]/[project]/index.ts +++ b/functions/chips/[shuttle]/[project]/index.ts @@ -76,6 +76,12 @@ export const onRequestGet: PagesFunction = async (context) => { ``, ``, '', + + // if this stylesheet is missing, then the equation text is duplicated on page + // see https://katex.org/docs/browser + ``, + ``, ].join('\n'), ) .replaceAll('__ttreplace_shuttle_id__', shuttle) diff --git a/functions/components/ProjectPage.tsx b/functions/components/ProjectPage.tsx index 5c3a5973..ab687b65 100644 --- a/functions/components/ProjectPage.tsx +++ b/functions/components/ProjectPage.tsx @@ -3,6 +3,7 @@ import MarkdownIt from 'markdown-it'; import React from 'react'; +import katex from 'katex'; import { IProjectFeedbackList, summarizeFeedback } from '../model/feedback.js'; import { markdownHeadingLimiter, markdownImagePathTransformer } from '../model/project.js'; import { getShuttlePdk, scanchainShuttles, type IShuttleIndexProject } from '../model/shuttle.js'; @@ -27,7 +28,16 @@ export function ProjectPage({ feedback, shuttleMapSvg, }: IProjectPropProps) { - const md = MarkdownIt(); + const md = MarkdownIt().use(require('markdown-it-texmath'), { + engine: katex, + // see https://katex.org/docs/options for all options + katexOptions: { + throwOnError: true, + strict: true, // be faithful to LaTeX math + trust: false, // prevent commands which cause adverse behaviour + maxSize: 80, + }, + }); // Add base URL to image paths md.renderer.rules['image'] = markdownImagePathTransformer(shuttle, project.macro); diff --git a/package.json b/package.json index 39a5afc0..e81c1147 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,9 @@ }, "dependencies": { "@cloudflare/pages-plugin-vercel-og": "^0.1.2", + "katex": "^0.16.27", "markdown-it": "^14.1.0", + "markdown-it-texmath": "^1.0.0", "react": "^18.3.1", "react-dom": "^18.3.1" }, diff --git a/static/css/katex.css b/static/css/katex.css new file mode 100644 index 00000000..2c741da6 --- /dev/null +++ b/static/css/katex.css @@ -0,0 +1,11 @@ +/* set font-size to match the rest of the content (https://katex.org/docs/font) */ +.katex { + font-size: 1em; +} + +/* hide equation numbering - this isn't supported in the datasheet, so to avoid confusion i'll just hide it + there is no option to toggle it, see https://github.com/KaTeX/KaTeX/discussions/3180 +*/ +.eqn-num { + display: none !important; +}