Pas mal de changements internes.

- Utilisation de modules séparés pour le téléchargement, la génération et la transformation des contenus.
- Amélioration de la compilation et du cache.
- Ajout d'images pour chacun des cours.

.github/workflows/cd.yml

@@ -32,7 +32,7 @@ jobs:
     strategy:
       matrix:
         os: [ ubuntu-latest ]
-        node: [ 20 ]
+        node: [ latest ]
     steps:
       - name: Checkout 🛎
         uses: actions/checkout@v3

.gitignore

@@ -105,9 +105,3 @@ sw.*
 *.run.xml
 .output
 content/
-!components/content/
-public/images/lessons/
-public/pdf/
-static/CNAME
-latex/
-tikz-images/

README.md

@@ -45,7 +45,7 @@ fichier `site/authentication.ts`. Indiquez votre `Client ID` dans le champ `clie
 Pour modifier le contenu de la page d'accueil, il faut éditer le fichier `pages/index.vue`.
 Une façon plus rapide (et intuitive...) de modifier les pages sera sûrement ajoutée à l'avenir.
 
-Vous pouvez également modifier certains paramètres dans le fichier `site/content-generator.js`, ceci vous permettra
+Vous pouvez également modifier la plupart des paramètres dans le fichier `site/content.js`. Ceci vous permettra
 de personnaliser les fichiers à compiler en PDF, à transformer en markdown, où se situent les images, etc.
 Le fichier `site/levels.ts` contient les différents niveaux disponibles. Chacun d'eux doit posséder un sous-dossier
 dans votre répertoire LaTeX.

components/ErrorDisplay.vue

@@ -1,5 +1,8 @@
 <script setup lang="ts">
-const props = defineProps<{ error: any }>()
+const props = defineProps<{
+  error: any,
+  changeTitle?: boolean
+}>()
 
 const errorCode = computed(() => {
   if (/^-?\d+$/.test(props.error.toString())) {
@@ -24,6 +27,7 @@ const title = computed(() => {
 
 <template>
   <div>
+    <Title v-if="changeTitle">{{ title }}</Title>
     <h1 v-text="title" />
     <p>
       Vous pouvez continuer votre navigation en allant sur <a href="javascript:history.back()">la page précédente</a> ou

components/MathDocument.vue

@@ -1,21 +1,29 @@
 <script setup lang="ts">
 import html2canvas from 'html2canvas'
-import { LessonContent } from '~/types'
 
 withDefaults(defineProps<{
-  document: LessonContent,
+  title: string,
+  body: string,
   color?: string
 }>(), {
   color: 'red'
 })
 
 const root = ref<HTMLElement | null>(null)
-const setupTimeout = ref<ReturnType<typeof setTimeout> | null>(null)
-const initialDotsTimeout = ref<ReturnType<typeof setTimeout> | null>(null)
 
 const route = useRoute()
 
 const setupDocument = () => {
+  const tables = root.value!.querySelectorAll<HTMLElement>('table')
+  for (const table of tables) {
+    table.classList.add('table', 'table-bordered', 'table-hover')
+    const parent = table.parentNode
+    const wrapper = document.createElement('div')
+    wrapper.classList.add('table-responsive')
+    parent!.replaceChild(wrapper, table)
+    wrapper.appendChild(table)
+  }
+
   const dotLines = root.value!.querySelectorAll<HTMLElement>('.dots')
   for (const dotLine of dotLines) {
     const parent = dotLine.parentElement
@@ -76,8 +84,6 @@ const setupDocument = () => {
   if (scrollCollapse) {
     scrollCollapse.scrollIntoView(true)
   }
-
-  setupTimeout.value = null
 }
 
 const resizeDotLines = () => {
@@ -95,35 +101,26 @@ const resizeDotLines = () => {
       dotLine.innerHTML = dotLine.innerHTML.substring(0, Math.max(0, dotLine.innerHTML.length - 2))
     }
   }
-  initialDotsTimeout.value = null
 }
 
 onMounted(async () => {
   await nextTick()
-  setupTimeout.value = setTimeout(setupDocument, 1000)
-  initialDotsTimeout.value = setTimeout(resizeDotLines, 1000)
+  setupDocument()
+  resizeDotLines()
   window.addEventListener('load', resizeDotLines)
   window.addEventListener('resize', resizeDotLines)
 })
 
 onUnmounted(() => {
-  if (setupTimeout.value) {
-    clearTimeout(setupTimeout.value)
-    setupTimeout.value = null
-  }
-  if (initialDotsTimeout.value) {
-    clearTimeout(initialDotsTimeout.value)
-    initialDotsTimeout.value = null
-  }
   window.removeEventListener('load', resizeDotLines)
   window.removeEventListener('resize', resizeDotLines)
 })
 </script>
 
 <template>
   <div ref="root" class="math-document" :class="color">
-    <h1 v-html="document.name" />
-    <content-renderer class="math-document-content" :value="document" />
+    <h1 v-html="title" />
+    <div class="math-document-content" v-html="body" />
   </div>
 </template>
 
@@ -187,6 +184,46 @@ onUnmounted(() => {
       display: none;
     }
 
+    h2 {
+      color: #1c567d;
+      padding-bottom: 0.2em;
+      margin-bottom: 0.75em;
+      counter-increment: headline-2;
+      counter-reset: headline-3;
+
+      &::before {
+        content: counter(headline-2, upper-roman) ' - ';
+      }
+    }
+
+    h3 {
+      color: #2980b9;
+      border-bottom: 1px solid #d7d7d7;
+      margin-bottom: 0.75em;
+      counter-increment: headline-3;
+
+      &::before {
+        content: counter(headline-3) '. ';
+      }
+    }
+
+    h4 {
+      border-bottom: none !important;
+      margin-bottom: 0 !important;
+    }
+
+    img {
+      max-width: 100%;
+    }
+
+    .table {
+      background-color: white;
+
+      td {
+        height: 2.5em;
+      }
+    }
+
     .button-exercice {
       font-size: 0.8em;
       margin-top: calc(-1.6em - 1.5rem);
@@ -241,9 +278,34 @@ onUnmounted(() => {
       }
     }
 
-    ol,
-    ul {
+    ol, ul {
+      padding-left: 1.5rem;
       margin-bottom: 1rem;
+
+      li {
+        padding-left: 1rem;
+
+        &::marker {
+          font-weight: bold;
+        }
+
+        :last-child {
+          margin-bottom: 0;
+        }
+      }
+    }
+
+    ol > li > ol {
+      list-style-type: lower-alpha;
+    }
+
+    ul li {
+      list-style-type: '— ';
+
+      &:last-child,
+      &:last-child > p {
+        margin-bottom: 0;
+      }
     }
 
     .center {