Skip to content

Commit 77e5507

Browse files
refactor(content): markdown to mdx
1 parent c5e026d commit 77e5507

File tree

17 files changed

+94
-29
lines changed

17 files changed

+94
-29
lines changed

.vscode/settings.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"files.associations": {
3+
"*.mdx": "markdown"
4+
}
5+
}

astro.config.mjs

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,10 @@ import { defineConfig } from 'astro/config';
33
// https://astro.build/config
44
import tailwind from "@astrojs/tailwind";
55

6+
// https://astro.build/config
7+
import mdx from "@astrojs/mdx";
8+
69
// https://astro.build/config
710
export default defineConfig({
8-
integrations: [tailwind()]
11+
integrations: [tailwind(), mdx()]
912
});
File renamed without changes.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
"format": "prettier -w --plugin-search-dir=. --cache ."
1313
},
1414
"dependencies": {
15+
"@astrojs/mdx": "^0.12.1",
1516
"@astrojs/tailwind": "^2.1.3",
1617
"astro": "^1.6.14",
1718
"tailwindcss": "^3.2.4"

src/components/Bulle.astro

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
---
2+
interface Props {
3+
emote: "marvin-hype" | "marvin-happy" | "marvin-oof" | "astride-smile" | "astride-wink" | "astride-sigh" | "remi-smile" | "remi-prof" | "remi-notlikethis"
4+
}
5+
const { emote } = Astro.props;
6+
const getSpeaker = () => {
7+
switch (emote.split("-")[0]) {
8+
case "marvin":
9+
return "Marvin"
10+
case "astride":
11+
return "Astride"
12+
case "remi":
13+
return "Rémi"
14+
}
15+
}
16+
const name = getSpeaker()
17+
---
18+
19+
<div class={"bubble bubble-" + emote}>
20+
<div class="bubble-heading">
21+
<h5>{name}</h5>
22+
</div>
23+
<div class="bubble-content">
24+
<slot />
25+
</div>
26+
</div>

src/components/Callout.astro

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
interface Props {
3+
heading?: string
4+
}
5+
const { heading = "Remarque" } = Astro.props;
6+
---
7+
8+
<div class={"bubble"}>
9+
<div class="bubble-heading">
10+
<h5>{heading}</h5>
11+
</div>
12+
<div class="bubble-content">
13+
<slot />
14+
</div>
15+
</div>

src/components/Video.astro

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
---
2+
interface Props {
3+
url: string
4+
autoplay: boolean
5+
muted: boolean
6+
loop: boolean
7+
controls: boolean
8+
poster?: string
9+
}
10+
const { url, autoplay, muted, loop, controls, poster } = Astro.props;
11+
---
12+
13+
<video autoplay={autoplay} muted={muted} loop={loop} controls={controls} poster={poster}>
14+
<source type="video/mp4" src={url} />
15+
</video>

src/data/chapters.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import type { MarkdownInstance } from "astro"
1+
import type { MDXInstance } from "astro"
22
import type { BaseFrontmatter } from "./shared"
33

44
export interface Chapter extends BaseFrontmatter {}
55

6-
export type ChapterInstance = MarkdownInstance<Chapter>
6+
export type ChapterInstance = MDXInstance<Chapter>

src/data/courses.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import type { MarkdownInstance } from "astro"
1+
import type { MDXInstance } from "astro"
22
import type { BaseFrontmatter } from "./shared"
33

44
export interface Course extends BaseFrontmatter {
@@ -12,4 +12,4 @@ export interface Course extends BaseFrontmatter {
1212
cover_tall: string
1313
}
1414

15-
export type CourseInstance = MarkdownInstance<Course>
15+
export type CourseInstance = MDXInstance<Course>

src/pages/glob.astro

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export async function getStaticPathFromContentType(
2020
2121
switch (contentType) {
2222
case "Course":
23-
contents = await Astro.glob<Course>("../../content/**/index.md")
23+
contents = await Astro.glob<Course>("../../content/**/index.mdx")
2424
return contents.map((content) => ({
2525
params: {
2626
course: getSlugFromFilePath(content.file, contentType),
@@ -31,7 +31,7 @@ export async function getStaticPathFromContentType(
3131
}))
3232
3333
case "Chapter":
34-
contents = await Astro.glob<Chapter>(`../../content/**/**/chapter.md`)
34+
contents = await Astro.glob<Chapter>(`../../content/**/**/chapter.mdx`)
3535
3636
return contents.map((content) => ({
3737
params: {
@@ -43,7 +43,7 @@ export async function getStaticPathFromContentType(
4343
}))
4444
4545
case "Page":
46-
contents = await Astro.glob<Chapter>("../../content/**/**/*.md")
46+
contents = await Astro.glob<Chapter>("../../content/**/**/*.mdx")
4747
4848
default:
4949
throw new Error(

src/pages/index.astro

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import type { Course } from "$data"
33
import { getSlugFromFilePath } from "$utils"
44
import MainLayout from "$layouts/MainLayout.astro"
55
6-
const courses = await Astro.glob<Course>("../../content/**/index.md")
6+
const courses = await Astro.glob<Course>("../../content/**/index.mdx")
77
---
88

99
<MainLayout title="FaireDesJeux.fr">

src/utils/files.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ export function getSlugFromFilePath(
1212
): string {
1313
switch (contentType) {
1414
case "Course":
15-
return extractSlugFromFilePath(path, "index.md")
15+
return extractSlugFromFilePath(path, "index.mdx")
1616
case "Chapter":
17-
return extractSlugFromFilePath(path, "chapter.md")
17+
return extractSlugFromFilePath(path, "chapter.mdx")
1818
default:
1919
throw new Error(
2020
`[getSlugFromFilePath] contentType not yet implemented: ${contentType}`

tailwind.config.cjs

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -89,15 +89,15 @@ module.exports = {
8989

9090
// Speech bubbles
9191
backgroundImage: () => ({
92-
marvinNeutral: "url('~@avatars/marvin.png')",
92+
marvinHappy: "url('~@avatars/marvin.png')",
9393
marvinHype: "url('~@avatars/marvin-hehe.png')",
9494
marvinOof: "url('~@avatars/marvin-oof.png')",
9595

96-
astrideNeutral: "url('~@avatars/astride.png')",
96+
astrideSmile: "url('~@avatars/astride.png')",
9797
astrideWink: "url('~@avatars/astride-wink.png')",
9898
astrideSigh: "url('~@avatars/astride-tss.png')",
9999

100-
remiNeutral: "url('~@avatars/remi.png')",
100+
remiSmile: "url('~@avatars/remi.png')",
101101
remiProf: "url('~@avatars/remi-hum.png')",
102102
remiNotLikeThis: "url('~@avatars/remi-ono.png')",
103103
}),
@@ -364,7 +364,7 @@ module.exports = {
364364
},
365365

366366
// Speech Bubbles - Marvin
367-
".bubble-marvin, .bubble-hypemarvin, .bubble-oofmarvin": {
367+
".bubble-marvin-happy, .bubble-marvin-hype, .bubble-marvin-oof": {
368368
textAlign: "right",
369369

370370
"& h5": {
@@ -377,26 +377,26 @@ module.exports = {
377377
},
378378
},
379379

380-
".bubble-marvin": {
380+
".bubble-marvin-happy": {
381381
"&::after": {
382-
backgroundImage: theme("backgroundImage.marvinNeutral"),
382+
backgroundImage: theme("backgroundImage.marvinHappy"),
383383
},
384384
},
385385

386-
".bubble-hypemarvin": {
386+
".bubble-marvin-hype": {
387387
"&::after": {
388388
backgroundImage: theme("backgroundImage.marvinHype"),
389389
},
390390
},
391391

392-
".bubble-oofmarvin": {
392+
".bubble-marvin-oof": {
393393
"&::after": {
394394
backgroundImage: theme("backgroundImage.marvinOof"),
395395
},
396396
},
397397

398398
// Speech Bubbles - Astride
399-
".bubble-astride, .bubble-winkastride, .bubble-sighastride": {
399+
".bubble-astride-smile, .bubble-astride-wink, .bubble-astride-sigh": {
400400
textAlign: "left",
401401

402402
"& h5": {
@@ -409,26 +409,26 @@ module.exports = {
409409
},
410410
},
411411

412-
".bubble-astride": {
412+
".bubble-astride-smile": {
413413
"&::after": {
414-
backgroundImage: theme("backgroundImage.astrideNeutral"),
414+
backgroundImage: theme("backgroundImage.astrideSmile"),
415415
},
416416
},
417417

418-
".bubble-winkastride": {
418+
".bubble-astride-wink": {
419419
"&::after": {
420420
backgroundImage: theme("backgroundImage.astrideWink"),
421421
},
422422
},
423423

424-
".bubble-sighastride": {
424+
".bubble-astride-sigh": {
425425
"&::after": {
426426
backgroundImage: theme("backgroundImage.astrideSigh"),
427427
},
428428
},
429429

430430
// Speech Bubbles - Rémi
431-
".bubble-remi, .bubble-profremi, .bubble-notlikethisremi": {
431+
".bubble-remi-smile, .bubble-remi-prof, .bubble-remi-notlikethis": {
432432
textAlign: "left",
433433

434434
"& h5": {
@@ -441,19 +441,19 @@ module.exports = {
441441
},
442442
},
443443

444-
".bubble-remi": {
444+
".bubble-remi-smile": {
445445
"&::after": {
446-
backgroundImage: theme("backgroundImage.remiNeutral"),
446+
backgroundImage: theme("backgroundImage.remiSmile"),
447447
},
448448
},
449449

450-
".bubble-profremi": {
450+
".bubble-remi-prof": {
451451
"&::after": {
452452
backgroundImage: theme("backgroundImage.remiProf"),
453453
},
454454
},
455455

456-
".bubble-notlikethisremi": {
456+
".bubble-remi-notlikethis": {
457457
"&::after": {
458458
backgroundImage: theme("backgroundImage.remiNotLikeThis"),
459459
},

0 commit comments

Comments
 (0)