Wiki

2026-09-15 19:44:58 +02:00
parent ca6c9fe38c
commit 6d4fdffee9
82 changed files with 29906 additions and 151 deletions
@@ -0,0 +1,96 @@
+<script lang="ts" setup>
+import MarkdownIt from 'markdown-it';
+import markdownItKatex from 'markdown-it-katex';
+import { ref, onMounted } from 'vue';
+import 'katex/dist/katex.min.css';
+
+const props = defineProps<{
+    markdownFileName: string;
+}>();
+const emit = defineEmits<{
+    loaded: [];
+}>();
+
+const html = ref<string>('');
+const title = ref<string>('');
+
+onMounted(() => {
+    const fullUrl = `/helptext/${props.markdownFileName}.md`;
+
+    fetch(fullUrl)
+        .then((res) => {
+            if (!res.ok) throw new Error('Failed to load file');
+            return res.text();
+        })
+        .then((markdown) => {
+            const md = new MarkdownIt({
+                html: true,
+                linkify: true,
+                typographer: true,
+            });
+            md.use(markdownItKatex);
+            md.renderer.rules.link_open = (
+                tokens,
+                index,
+                options,
+                env,
+                self,
+            ) => {
+                const token = tokens[index];
+                token.attrSet('target', '_blank');
+                token.attrSet('rel', 'noopener noreferrer');
+                return self.renderToken(tokens, index, options);
+            };
+
+            html.value = md.render(markdown);
+            const firstHeading = html.value.match(/<h[1-6]>(.*?)<\/h[1-6]>/i);
+            title.value = firstHeading?.[1].trim() || '';
+            html.value = firstHeading
+                ? html.value.replace(firstHeading[0], '')
+                : html.value;
+            emit('loaded');
+        })
+        .catch((err) => {
+            console.error('Could not load help file:', err);
+            html.value = '';
+            title.value = '';
+        });
+});
+</script>
+
+<template>
+    <div class="p-6 w-full">
+        <h1 class="b-4 mb-7 text-4xl font-semibold">{{ title }}</h1>
+
+        <div
+            v-html="html"
+            class="max-w-none block prose prose-lg text-justify prose-headings:text-left dark:prose-invert prose-code:before:hidden prose-code:after:hidden"
+            role="region"
+            aria-label="Help text"
+        ></div>
+    </div>
+</template>
+
+<style scoped>
+.prose :deep(.katex) {
+    white-space: nowrap;
+}
+
+.prose :deep(.katex .vlist) {
+    font-size: 0.7em;
+    line-height: 0em;
+}
+</style>
+<style>
+
+/* Custom styles for the help text */
+.exercice {
+    padding: 0.1px 1rem;
+    background-color: var(--accent);
+    border-radius: 0.5rem;
+}
+
+.exercice ul li span {
+    font-style: oblique;
+}
+</style>