up

Author: gbouteiller

package.json

@@ -16,14 +16,12 @@
 		"test:unit": "vitest"
 	},
 	"devDependencies": {
-		"@magidoc/plugin-svelte-marked": "^4.1.2",
 		"@playwright/test": "^1.40.1",
 		"@sveltejs/adapter-auto": "^3.0.1",
 		"@sveltejs/adapter-vercel": "^4.0.3",
 		"@sveltejs/kit": "^2.0.6",
 		"@sveltejs/vite-plugin-svelte": "^3.0.1",
 		"@tailwindcss/typography": "^0.5.10",
-		"@types/marked": "^6.0.0",
 		"@typescript-eslint/eslint-plugin": "^6.16.0",
 		"@typescript-eslint/parser": "^6.16.0",
 		"autoprefixer": "^10.4.16",

pnpm-lock.yaml

@@ -132,6 +132,6 @@
     @apply border-border;
   }
   body {
-    @apply bg-background text-foreground;
+    @apply bg-background text-foreground font-base;
   }
 }

src/app.pcss

@@ -1,9 +1,8 @@
-<article class={cn('prose lg:prose-lg xl:prose-xl 2xl:prose-2xl', c)}><Markdown {source} /></article>
+<article class={cn('prose lg:prose-lg xl:prose-xl 2xl:prose-2xl', c)}>{@html source}</article>
 
 <script lang="ts">
   import {cn} from '$lib/utils';
-  import Markdown from '@magidoc/plugin-svelte-marked';
-
+  
   // PROPS ---------------------------------------------------------------------------------------------------------------------------------
   export let source: string;
 

src/lib/components/ui/article/article.svelte

@@ -3,6 +3,7 @@ export const prerender = true;
 import {cacheImage, findEntries, findEntry} from '$lib/server';
 import {zImage} from '$lib/server/schemas';
 import {zContentEntry} from '@niama/notion-tools';
+import {marked} from 'marked';
 import {z} from 'zod';
 import type {PageServerLoad} from './$types';
 
@@ -32,5 +33,5 @@ export const load: PageServerLoad = async () => {
     .filter(({data: {count}}) => count > 0)
     .map(({data: {image, title}, slug}) => ({href: `/originaux/${slug}`, image, title}));
 
-  return {body, items, title: data.title};
+  return {body: await marked(body), items, title: data.title};
 };

src/routes/originaux/+page.server.ts

@@ -1,12 +1,12 @@
-<!-- <Section intent="primary" {title}>
+<Section intent="primary" {title}>
   <Article source={body} />
-</Section> -->
+</Section>
 <Section grid={items}>
   {#each items as item, index}<Item {index} {...item} />{/each}
 </Section>
 
 <script lang="ts">
-  // import {Article} from '$lib/components/ui/article';
+  import {Article} from '$lib/components/ui/article';
   import {Item} from '$lib/components/ui/item';
   import {Section} from '$lib/components/ui/section';