mdeck 3.6.1 → 3.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/README.md +44 -2
  3. package/assets/extensions/palettes/cobalt/extension.toml +2 -0
  4. package/assets/extensions/palettes/greyscale/extension.toml +4 -12
  5. package/assets/extensions/palettes/lagoon/extension.toml +2 -0
  6. package/assets/extensions/palettes/nordic/extension.toml +2 -0
  7. package/assets/extensions/palettes/paper/extension.toml +2 -0
  8. package/assets/extensions/palettes/swiss/extension.toml +2 -0
  9. package/assets/extensions/themes/academic/styles.css +2 -4
  10. package/assets/extensions/themes/glass/styles.css +2 -6
  11. package/assets/extensions/themes/minimal/styles.css +2 -5
  12. package/assets/extensions/themes/neue/styles.css +2 -5
  13. package/assets/extensions/themes/plain/styles.css +1 -2
  14. package/assets/extensions/themes/work/styles.css +2 -5
  15. package/docs/reference/authoring.md +1 -1
  16. package/docs/reference/extensions.md +2 -0
  17. package/docs/reference/palettes.md +7 -4
  18. package/docs/site/assets/site.css +21 -0
  19. package/docs/site/assets/site.js +17 -7
  20. package/docs/site/build.js +15 -6
  21. package/docs/site/content/drawing.md +1 -1
  22. package/docs/site/content/sharing.md +1 -1
  23. package/docs/site/content/theme-authoring.md +6 -3
  24. package/docs/site/content/welcome.md +70 -6
  25. package/docs/site/examples/chart.svg +5 -0
  26. package/docs/site/examples/contours.jpg +0 -0
  27. package/docs/site/examples/first-talk.drawings.json +1 -0
  28. package/docs/site/examples/first-talk.md +125 -35
  29. package/docs/site/examples/first-talk.results.json +171 -0
  30. package/docs/site/examples/mdeck.svg +66 -0
  31. package/docs/site/examples/references.bib +23 -0
  32. package/docs/site/images/features/citations.webp +0 -0
  33. package/docs/site/images/features/code.webp +0 -0
  34. package/docs/site/images/features/drawing.webp +0 -0
  35. package/docs/site/images/features/polls.webp +0 -0
  36. package/docs/site/images/features/reader.webp +0 -0
  37. package/docs/site/images/features/themes.webp +0 -0
  38. package/docs/site/images/themes/academic-thumb.webp +0 -0
  39. package/docs/site/images/themes/glass-thumb.webp +0 -0
  40. package/docs/site/images/themes/minimal-thumb.webp +0 -0
  41. package/docs/site/images/themes/neue-thumb.webp +0 -0
  42. package/docs/site/images/themes/plain-thumb.webp +0 -0
  43. package/docs/site/images/themes/work-thumb.webp +0 -0
  44. package/package.json +3 -2
  45. package/skills/write-slides/SKILL.md +1 -1
  46. package/src/build/check.js +1 -0
  47. package/src/cli/themes.js +1 -1
  48. package/src/components/callout.css +11 -21
  49. package/src/core/labels.js +6 -0
  50. package/src/editor/components/PalettePicker.jsx +1 -1
  51. package/src/editor/extensions.js +2 -2
  52. package/src/extensions/contrast.js +3 -1
  53. package/src/extensions/manifest.js +7 -3
  54. package/src/extensions/packages.js +3 -0
  55. package/src/extensions/tokens.js +10 -2
  56. package/src/live/client.js +1 -1
  57. package/src/runtime/ReaderView.jsx +21 -12
  58. package/src/runtime/chrome.jsx +1 -1
  59. package/src/runtime/deck-stage.js +5 -1
  60. package/src/runtime/reader.css +2 -0
  61. package/docs/site/examples/notebook.svg +0 -58
@@ -6,6 +6,74 @@ The content stays yours. The assistant works from your material, not from its ow
6
6
 
7
7
  [Make your first presentation](getting-started.html)
8
8
 
9
+ ## What you can do with it
10
+
11
+ <div class="features">
12
+
13
+ <section>
14
+
15
+ [![The presenter view on an iPad with circles, an arrow and a highlight drawn on a chart slide, and the projector behind it showing the same strokes](images/features/drawing.webp)](images/features/drawing.webp)
16
+
17
+ ### Draw on your slides, from an iPad if you like
18
+
19
+ Circle a number, underline a phrase, point with a laser. Pair an iPad by scanning a code, and it becomes your presenter screen and drawing pad while the laptop drives the projector: every stroke shows on the big screen as you draw. Drawings are kept with the talk, in its PDF too. [Draw on your slides](drawing.html)
20
+
21
+ </section>
22
+
23
+ <section>
24
+
25
+ [![A poll slide with live bars and a QR code, and a phone showing the same question with one answer picked](images/features/polls.webp)](images/features/polls.webp)
26
+
27
+ ### Ask the room, and show the answers on the slide
28
+
29
+ Polls, scales, word clouds, open questions and numbers to guess. People scan the code and answer on their phones, no app needed, and the bars grow as votes come in. Close the vote, discuss, reveal the right answer. The answers are kept with the talk. [Ask your audience](audience.html)
30
+
31
+ </section>
32
+
33
+ <section>
34
+
35
+ [![A slide with author–year citations and the full references at its foot, next to a slide that lists all references](images/features/citations.webp)](images/features/citations.webp)
36
+
37
+ ### Cite your sources properly
38
+
39
+ Cite as in a paper, `[@knuth1984, p. 97]`, from the BibTeX, CSL-JSON or Hayagriva file you already keep. Each slide lists what it cites at its foot, and a references slide lists everything, in APA, Vancouver, Harvard or any CSL style. [Cite a source](more-content.html#cite-a-source)
40
+
41
+ </section>
42
+
43
+ <section>
44
+
45
+ [![The same chart slide in six themes: neue, plain, work, academic, minimal and glass](images/features/themes.webp)](images/features/themes.webp)
46
+
47
+ ### Write the content once, change the look anytime
48
+
49
+ The file holds what you say; a theme and a palette decide how it looks. One line changes every slide, light or dark, and your text never moves. Six themes come with mdeck, more are one command away in the [theme repository](https://gh.tschieber.de/mdeck-themes/). [Change the look](appearance.html)
50
+
51
+ </section>
52
+
53
+ <section>
54
+
55
+ [![A slide with a short Python example and its output below it](images/features/code.webp)](images/features/code.webp)
56
+
57
+ ### Run code on the slide
58
+
59
+ Give a Python or JavaScript example a Run button, change it in front of the audience and run it again. Python runs right in the browser, with packages such as NumPy and pandas, so nothing needs installing. [Show a code example](more-content.html#show-a-code-example)
60
+
61
+ </section>
62
+
63
+ <section>
64
+
65
+ [![The reader view of a talk on a laptop, with an outline of the slides, and on a phone in reading mode](images/features/reader.webp)](images/features/reader.webp)
66
+
67
+ ### Send one file that anyone can open
68
+
69
+ `mdeck send` makes a single HTML file for the people you send the talk to: an outline, a reading mode for phones, light and dark, and the PDF inside. It opens in any browser, also offline, and your speaker notes stay out. [Send, host or print](sharing.html)
70
+
71
+ </section>
72
+
73
+ </div>
74
+
75
+ Also: a presenter view with notes, timer and the next slide; points revealed one at a time; pictures, videos and formulas; a browser editor for those who prefer clicking; and a launch page (`mdeck run`) that gathers it all, with a check for missing pictures and slides that do not fit.
76
+
9
77
  <!-- preview -->
10
78
 
11
79
  ## Bring your material, then shape it
@@ -52,13 +120,9 @@ The `#` makes a heading. The line with `---` starts another slide. A dash before
52
120
  - **Which view or server do I need?** See [Views, commands and servers](views.html).
53
121
  - **Something looks wrong?** Try [the troubleshooting guide](troubleshooting.html).
54
122
 
55
- ## What mdeck does today
56
-
57
- mdeck gives you ready-made slide layouts, different visual themes, speaker notes, pictures, videos, a separate presenter view, drawing on slides (also from an iPad), polls and other questions your audience answers on their phones, and a reader view with a PDF for people you send the slides to. It can also use layouts, themes and colors made for your team, and your assistant can make new ones for a single talk.
58
-
59
- `mdeck run` opens a launch page for your talk with all of this in one place: the presenter view, the editor, these guides, buttons that make the files to share, and a check for missing pictures.
123
+ ## Your file, whoever edits it
60
124
 
61
- Whoever writes the slides, your assistant, a text editor, or the built-in browser editor (`mdeck edit`), the file stays the single copy, and the preview updates as it changes.
125
+ Whoever writes the slides, your assistant, a text editor, or the built-in browser editor (`mdeck edit`), the file stays the single copy, and the preview updates as it changes. mdeck can also use layouts, themes and colours made for your team, and your assistant can make new ones for a single talk.
62
126
 
63
127
  ## Keep this guide nearby
64
128
 
@@ -0,0 +1,5 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 820 900"><rect width="820" height="900" fill="var(--surface, #f2f2f2)"/>
2
+ <g stroke="var(--rule, #ddd)" stroke-width="2"><path d="M60 760H780"/><path d="M60 585H780"/><path d="M60 410H780"/><path d="M60 235H780"/></g>
3
+ <rect x="90" y="550" width="70" height="210" rx="5" fill="var(--muted, #888)"/><rect x="205" y="480" width="70" height="280" rx="5" fill="var(--muted, #888)"/><rect x="320" y="130" width="70" height="630" rx="5" fill="var(--accent, #888)"/><rect x="435" y="410" width="70" height="350" rx="5" fill="var(--muted, #888)"/><rect x="550" y="550" width="70" height="210" rx="5" fill="var(--muted, #888)"/><rect x="665" y="620" width="70" height="140" rx="5" fill="var(--muted, #888)"/>
4
+ <g fill="var(--muted, #666)" font-family="sans-serif" font-size="30" text-anchor="middle"><text x="125" y="815">A</text><text x="240" y="815">B</text><text x="355" y="815">C</text><text x="470" y="815">D</text><text x="585" y="815">E</text><text x="700" y="815">F</text></g>
5
+ </svg>
Binary file
@@ -0,0 +1 @@
1
+ {"version":1,"width":1920,"height":1080,"slides":{"draw":[{"id":"peak","tool":"pen","color":"#e11d48","size":7,"points":[[427,193,0.45],[434,188,0.47],[443,182,0.48],[453,178,0.5],[464,175,0.52],[476,174,0.54],[487,173,0.55],[499,175,0.57],[510,177,0.59],[520,181,0.6],[530,186,0.62],[538,191,0.63],[546,197,0.65],[553,203,0.66],[559,209,0.67],[564,216,0.69],[569,223,0.7],[573,230,0.71],[577,237,0.72],[580,245,0.73],[581,252,0.74],[582,261,0.75],[581,269,0.76],[579,277,0.77],[575,285,0.78],[569,293,0.78],[561,299,0.79],[553,305,0.79],[543,309,0.79],[533,312,0.8],[522,314,0.8],[511,315,0.8],[501,315,0.8],[491,315,0.8],[481,314,0.8],[471,312,0.79],[461,311,0.79],[452,309,0.79],[443,307,0.78],[433,304,0.78],[424,301,0.77],[415,297,0.76],[407,292,0.75],[400,286,0.74],[394,280,0.73],[389,272,0.72],[386,265,0.71],[385,257,0.7],[386,249,0.69],[388,241,0.67],[391,233,0.66],[396,226,0.65],[401,220,0.63],[407,214,0.62],[414,209,0.6],[421,204,0.59],[428,199,0.57],[436,194,0.55],[444,190,0.54],[453,186,0.52],[463,182,0.5],[473,179,0.48],[484,177,0.47],[496,176,0.45]]},{"id":"arrow","tool":"pen","color":"#e11d48","size":7,"points":[[600,215,0.45],[615,215,0.49],[630,215,0.53],[644,215,0.57],[659,215,0.61],[674,216,0.64],[689,218,0.67],[704,220,0.7],[719,223,0.73],[733,226,0.75],[748,230,0.77],[763,236,0.79],[778,242,0.79],[793,249,0.8],[807,257,0.8],[822,266,0.79],[837,275,0.79],[852,286,0.77],[867,298,0.75],[881,310,0.73],[896,323,0.7],[911,337,0.67],[926,352,0.64],[941,367,0.61],[956,382,0.57],[970,398,0.53],[985,414,0.49],[1000,430,0.45]]},{"id":"arrow-head","tool":"pen","color":"#e11d48","size":7,"points":[[967,421,0.45],[1000,430,0.8],[993,397,0.45]]}]}}
@@ -1,20 +1,41 @@
1
1
  ---
2
- theme: academic
2
+ theme: neue
3
+ meta:
4
+ title: "A short tour of mdeck"
3
5
  show:
4
6
  organization: none
5
7
  author: none
6
- ---
7
-
8
+ bibliography: references.bib
8
9
  ---
9
10
  :::meta
10
11
  layout: title
12
+ image: ./mdeck.svg
13
+ fit: contain
14
+ alt: "A Markdown file turning into a stack of slides"
11
15
  id: hello
12
16
  :::
13
- # Write it down.
14
- ## Why every lab keeps a notebook
17
+ # Slides from a text file.
18
+ ## A short tour of mdeck
19
+
20
+ :::notes
21
+ These notes are only for you: they show in the presenter view.
22
+ :::
23
+
24
+ ---
25
+ :::meta
26
+ id: how-it-works
27
+ :::
28
+ # From your material to a talk
29
+
30
+ :::steps
31
+ - Hand your slides, papers or notes to an AI assistant
32
+ - It writes one Markdown file with your content
33
+ - mdeck presents it in the browser
34
+ - Send it as one file, or as a PDF
35
+ :::
15
36
 
16
37
  :::notes
17
- Ask who has ever repeated an experiment because nobody remembered how it was done.
38
+ Press Next: the points appear one at a time.
18
39
  :::
19
40
 
20
41
  ---
@@ -22,67 +43,136 @@ Ask who has ever repeated an experiment because nobody remembered how it was don
22
43
  layout: split
23
44
  props:
24
45
  ratio: [1, 1]
46
+ id: write-this
25
47
  :::
26
- # A notebook answers three questions.
48
+ # Write this, get a slide
49
+
50
+ :::slot left
51
+ ```markdown
52
+ # Three ideas
27
53
 
28
- - What did I do?
29
- - What did I see?
30
- - What would I change?
54
+ - Start small
55
+ - Show an example
56
+ - Ask a question
57
+ ```
58
+ :::
31
59
 
32
- :::notes
33
- Everything else in a good notebook serves one of these three questions.
60
+ :::slot right
61
+ A `#` makes the heading, a dash a point, and `---` starts the next slide. Your assistant writes it; you can read and change every word.
34
62
  :::
35
63
 
36
64
  ---
37
65
  :::meta
38
66
  layout: focus
39
- attribution: "A saying in many labs"
40
67
  :::
41
- # If it is not written down, it did not happen.
68
+ # Your talk is a text file: you can read it, change it and keep it.
42
69
 
43
70
  ---
71
+
44
72
  :::meta
45
73
  layout: chapter
46
74
  number: 1
47
- part: "Good habits"
75
+ part: "In the room"
48
76
  :::
49
- # Write as you work.
77
+ # Present it, live.
50
78
 
51
- Two habits that make a notebook useful a year later.
79
+ Draw, ask the room, cite and run code, right on the slides.
52
80
 
53
81
  ---
54
82
  :::meta
55
- layout: split
56
- props:
57
- ratio: [1, 1]
83
+ layout: image-text
84
+ image: ./chart.svg
85
+ alt: "A bar chart with one bar much taller than the others"
86
+ id: draw
58
87
  :::
59
- # Two habits that pay off
88
+ # Draw while you talk
60
89
 
61
- :::slot left
62
- ## Date every page
63
- The date and the experiment's name come first, before anything else.
90
+ - Circle, underline, point with a laser
91
+ - From an iPad paired with the laptop
92
+ - Saved with the slide, also in the PDF
93
+
94
+ :::notes
95
+ The circle and the arrow were drawn on this slide and stay with it.
64
96
  :::
65
97
 
66
- :::slot right
67
- ## Record what went wrong
68
- Failed runs explain the successful ones. Never tear out a page.
98
+ ---
99
+ :::meta
100
+ id: first
101
+ :::
102
+ # Which will you try first?
103
+
104
+ <poll room="first" options="Drawing on slides|Polls from phones|Citations|A new theme" />
105
+
106
+ :::notes
107
+ People answer on their phones and the bars grow live. These answers are kept from a talk.
69
108
  :::
70
109
 
71
110
  ---
72
111
  :::meta
73
- layout: image-text
74
- image: ./notebook.svg
75
- alt: "An open lab notebook with written steps, a results table and a plot"
112
+ id: cite
76
113
  :::
77
- # One page per experiment
114
+ # Cite like in a paper
78
115
 
79
- Aim, materials, steps, results and a short conclusion. Glue in printouts so nothing gets lost.
116
+ Slides are Markdown, a plain text format meant to read well as it is [@gruber2004]. Text and code kept together is an old idea [@knuth1984].
117
+
118
+ Citations use Pandoc's syntax [@pandoc] and any citation style; each slide lists its references at its foot.
119
+
120
+ ---
121
+ :::meta
122
+ id: references
123
+ :::
124
+ # References
125
+
126
+ <bibliography />
127
+
128
+ ---
129
+ :::meta
130
+ id: run
131
+ :::
132
+ # Run code on the slide
133
+
134
+ ```python live editable
135
+ features = ["drawing", "polls", "citations", "themes"]
136
+ print(", ".join(name.capitalize() for name in features))
137
+ ```
138
+
139
+ :::tip
140
+ Press Run, change the list, run it again.
141
+ :::
142
+
143
+ ---
144
+ :::meta
145
+ layout: chapter
146
+ number: 2
147
+ part: "The look"
148
+ :::
149
+ # Content and style, apart.
150
+
151
+ The file holds what you say. A theme decides how it looks.
152
+
153
+ ---
154
+ :::meta
155
+ layout: split
156
+ props:
157
+ ratio: [1, 1]
158
+ :::
159
+ # One file, many looks
160
+
161
+ :::slot left
162
+ ## Themes
163
+ Six come with mdeck, more are one command away. Try the pictures below this deck.
164
+ :::
165
+
166
+ :::slot right
167
+ ## Light or dark
168
+ Every palette has both. Switch while presenting, without touching the file.
169
+ :::
80
170
 
81
171
  ---
82
172
  :::meta
83
173
  layout: full-bleed-image
84
- image: ./notebook.svg
85
- alt: "An open lab notebook with written steps, a results table and a plot"
174
+ image: ./contours.jpg
175
+ alt: "Contour lines like those on a map"
86
176
  overlay: true
87
177
  :::
88
- # Your future self will thank you.
178
+ # Make your next presentation.
@@ -0,0 +1,171 @@
1
+ {
2
+ "version": 1,
3
+ "rooms": {
4
+ "first": {
5
+ "savedAt": "2026-10-09T09:13:00.000Z",
6
+ "closed": false,
7
+ "answers": [
8
+ {
9
+ "phone": 1,
10
+ "at": "2026-10-09T09:12:00.000Z",
11
+ "value": "Drawing on slides"
12
+ },
13
+ {
14
+ "phone": 2,
15
+ "at": "2026-10-09T09:12:01.700Z",
16
+ "value": "A new theme"
17
+ },
18
+ {
19
+ "phone": 3,
20
+ "at": "2026-10-09T09:12:03.400Z",
21
+ "value": "Citations"
22
+ },
23
+ {
24
+ "phone": 4,
25
+ "at": "2026-10-09T09:12:05.100Z",
26
+ "value": "Drawing on slides"
27
+ },
28
+ {
29
+ "phone": 5,
30
+ "at": "2026-10-09T09:12:06.800Z",
31
+ "value": "A new theme"
32
+ },
33
+ {
34
+ "phone": 6,
35
+ "at": "2026-10-09T09:12:08.500Z",
36
+ "value": "Polls from phones"
37
+ },
38
+ {
39
+ "phone": 7,
40
+ "at": "2026-10-09T09:12:10.200Z",
41
+ "value": "Drawing on slides"
42
+ },
43
+ {
44
+ "phone": 8,
45
+ "at": "2026-10-09T09:12:11.900Z",
46
+ "value": "A new theme"
47
+ },
48
+ {
49
+ "phone": 9,
50
+ "at": "2026-10-09T09:12:13.600Z",
51
+ "value": "Polls from phones"
52
+ },
53
+ {
54
+ "phone": 10,
55
+ "at": "2026-10-09T09:12:15.300Z",
56
+ "value": "Drawing on slides"
57
+ },
58
+ {
59
+ "phone": 11,
60
+ "at": "2026-10-09T09:12:17.000Z",
61
+ "value": "A new theme"
62
+ },
63
+ {
64
+ "phone": 12,
65
+ "at": "2026-10-09T09:12:18.700Z",
66
+ "value": "Polls from phones"
67
+ },
68
+ {
69
+ "phone": 13,
70
+ "at": "2026-10-09T09:12:20.400Z",
71
+ "value": "Drawing on slides"
72
+ },
73
+ {
74
+ "phone": 14,
75
+ "at": "2026-10-09T09:12:22.100Z",
76
+ "value": "Citations"
77
+ },
78
+ {
79
+ "phone": 15,
80
+ "at": "2026-10-09T09:12:23.800Z",
81
+ "value": "Polls from phones"
82
+ },
83
+ {
84
+ "phone": 16,
85
+ "at": "2026-10-09T09:12:25.500Z",
86
+ "value": "Drawing on slides"
87
+ },
88
+ {
89
+ "phone": 17,
90
+ "at": "2026-10-09T09:12:27.200Z",
91
+ "value": "Citations"
92
+ },
93
+ {
94
+ "phone": 18,
95
+ "at": "2026-10-09T09:12:28.900Z",
96
+ "value": "Drawing on slides"
97
+ },
98
+ {
99
+ "phone": 19,
100
+ "at": "2026-10-09T09:12:30.600Z",
101
+ "value": "A new theme"
102
+ },
103
+ {
104
+ "phone": 20,
105
+ "at": "2026-10-09T09:12:32.300Z",
106
+ "value": "Polls from phones"
107
+ },
108
+ {
109
+ "phone": 21,
110
+ "at": "2026-10-09T09:12:34.000Z",
111
+ "value": "Drawing on slides"
112
+ },
113
+ {
114
+ "phone": 22,
115
+ "at": "2026-10-09T09:12:35.700Z",
116
+ "value": "A new theme"
117
+ },
118
+ {
119
+ "phone": 23,
120
+ "at": "2026-10-09T09:12:37.400Z",
121
+ "value": "Polls from phones"
122
+ },
123
+ {
124
+ "phone": 24,
125
+ "at": "2026-10-09T09:12:39.100Z",
126
+ "value": "Drawing on slides"
127
+ },
128
+ {
129
+ "phone": 25,
130
+ "at": "2026-10-09T09:12:40.800Z",
131
+ "value": "A new theme"
132
+ },
133
+ {
134
+ "phone": 26,
135
+ "at": "2026-10-09T09:12:42.500Z",
136
+ "value": "Polls from phones"
137
+ },
138
+ {
139
+ "phone": 27,
140
+ "at": "2026-10-09T09:12:44.200Z",
141
+ "value": "Drawing on slides"
142
+ },
143
+ {
144
+ "phone": 28,
145
+ "at": "2026-10-09T09:12:45.900Z",
146
+ "value": "Citations"
147
+ },
148
+ {
149
+ "phone": 29,
150
+ "at": "2026-10-09T09:12:47.600Z",
151
+ "value": "Polls from phones"
152
+ },
153
+ {
154
+ "phone": 30,
155
+ "at": "2026-10-09T09:12:49.300Z",
156
+ "value": "Drawing on slides"
157
+ },
158
+ {
159
+ "phone": 31,
160
+ "at": "2026-10-09T09:12:51.000Z",
161
+ "value": "Citations"
162
+ },
163
+ {
164
+ "phone": 32,
165
+ "at": "2026-10-09T09:12:52.700Z",
166
+ "value": "Polls from phones"
167
+ }
168
+ ]
169
+ }
170
+ }
171
+ }
@@ -0,0 +1,66 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="960" height="800" viewBox="0 0 960 800">
2
+ <!-- A Markdown file becoming a stack of slides. The colours come from the
3
+ deck's palette (var(--accent) …), so the picture follows the theme;
4
+ the fallbacks apply where it is shown as a plain image. -->
5
+ <style>
6
+ .mdk-paper { fill: var(--surface, #eef1fb); stroke: var(--rule, #d5dbf0); stroke-width: 3; }
7
+ .mdk-fold { fill: var(--rule, #d5dbf0); }
8
+ .mdk-shadow { fill: var(--ink, #0c1033); opacity: .12; }
9
+ .mdk-code { font-family: ui-monospace, 'JetBrains Mono', Menlo, Consolas, monospace; font-size: 30px; fill: var(--ink-soft, #2a2f55); }
10
+ .mdk-mark { fill: var(--accent, #1f3fd1); font-weight: 700; }
11
+ .mdk-quiet { fill: var(--muted, #5b6080); }
12
+ .mdk-slide { fill: var(--bg, #ffffff); stroke: var(--ink, #0c1033); stroke-width: 3; }
13
+ .mdk-accent { fill: var(--accent, #1f3fd1); }
14
+ .mdk-accent-2 { fill: var(--accent-2, #e8590c); }
15
+ .mdk-rule { fill: var(--rule, #d5dbf0); }
16
+ .mdk-on-accent { fill: var(--on-accent, #ffffff); font-family: var(--font-display, sans-serif); font-weight: 800; font-size: 96px; }
17
+ .mdk-title { fill: var(--ink, #0c1033); font-family: var(--font-display, sans-serif); font-weight: 800; font-size: 46px; }
18
+ .mdk-arrow { fill: none; stroke: var(--accent-2, #e8590c); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
19
+ </style>
20
+
21
+ <!-- The text file -->
22
+ <g transform="rotate(-5 230 400)">
23
+ <rect class="mdk-shadow" x="56" y="146" width="370" height="510" rx="18"/>
24
+ <path class="mdk-paper" d="M58 130 h290 l62 62 v438 a18 18 0 0 1 -18 18 h-316 a18 18 0 0 1 -18 -18 v-482 a18 18 0 0 1 18 -18 z"/>
25
+ <path class="mdk-fold" d="M348 130 v44 a18 18 0 0 0 18 18 h44 z"/>
26
+ <text class="mdk-code" x="84" y="232"><tspan class="mdk-mark">#</tspan> A talk</text>
27
+ <text class="mdk-code" x="84" y="300"><tspan class="mdk-mark">-</tspan> one idea</text>
28
+ <text class="mdk-code" x="84" y="344"><tspan class="mdk-mark">-</tspan> an example</text>
29
+ <text class="mdk-code mdk-mark" x="84" y="412">---</text>
30
+ <text class="mdk-code mdk-quiet" x="84" y="480">:::notes</text>
31
+ <text class="mdk-code mdk-quiet" x="84" y="524">pause here</text>
32
+ <text class="mdk-code mdk-quiet" x="84" y="568">:::</text>
33
+ </g>
34
+
35
+ <!-- From text to slides -->
36
+ <path class="mdk-arrow" d="M300 112 C 380 20, 560 22, 640 150" stroke-dasharray="2 16"/>
37
+ <path class="mdk-arrow" d="M612 138 l30 16 l4 -34"/>
38
+ <path class="mdk-accent" d="M470 60 l7 17 l17 7 l-17 7 l-7 17 l-7 -17 l-17 -7 l17 -7 z"/>
39
+ <path class="mdk-accent-2" d="M760 210 l5 12 l12 5 l-12 5 l-5 12 l-5 -12 l-12 -5 l12 -5 z"/>
40
+
41
+ <!-- The slides: a chapter, a statement, and a content slide in front -->
42
+ <g transform="rotate(9 680 330)">
43
+ <rect class="mdk-accent-2" x="440" y="200" width="480" height="270" rx="14"/>
44
+ </g>
45
+ <g transform="rotate(3 660 420)">
46
+ <rect class="mdk-accent" x="420" y="290" width="480" height="270" rx="14"/>
47
+ <text class="mdk-on-accent" x="452" y="386">2</text>
48
+ <rect class="mdk-accent-2" x="512" y="350" width="80" height="10" rx="5"/>
49
+ </g>
50
+ <g transform="rotate(-3 640 540)">
51
+ <rect class="mdk-shadow" x="412" y="420" width="480" height="270" rx="14"/>
52
+ <rect class="mdk-slide" x="400" y="404" width="480" height="270" rx="14"/>
53
+ <text class="mdk-title" x="432" y="470">A talk</text>
54
+ <rect class="mdk-accent" x="432" y="486" width="88" height="8" rx="4"/>
55
+ <rect class="mdk-accent" x="432" y="524" width="14" height="14" rx="3"/>
56
+ <rect class="mdk-rule" x="458" y="525" width="150" height="12" rx="6"/>
57
+ <rect class="mdk-accent" x="432" y="562" width="14" height="14" rx="3"/>
58
+ <rect class="mdk-rule" x="458" y="563" width="120" height="12" rx="6"/>
59
+ <rect class="mdk-accent" x="432" y="600" width="14" height="14" rx="3"/>
60
+ <rect class="mdk-rule" x="458" y="601" width="136" height="12" rx="6"/>
61
+ <rect class="mdk-accent-2" x="682" y="580" width="34" height="62" rx="4"/>
62
+ <rect class="mdk-accent" x="726" y="530" width="34" height="112" rx="4"/>
63
+ <rect class="mdk-accent-2" x="770" y="556" width="34" height="86" rx="4"/>
64
+ <rect class="mdk-accent" x="814" y="500" width="34" height="142" rx="4"/>
65
+ </g>
66
+ </svg>
@@ -0,0 +1,23 @@
1
+ @misc{gruber2004,
2
+ author = {Gruber, John},
3
+ title = {Markdown},
4
+ howpublished = {Daring Fireball},
5
+ year = {2004},
6
+ url = {https://daringfireball.net/projects/markdown/}
7
+ }
8
+ @article{knuth1984,
9
+ author = {Knuth, Donald E.},
10
+ title = {Literate Programming},
11
+ journal = {The Computer Journal},
12
+ volume = {27},
13
+ number = {2},
14
+ pages = {97--111},
15
+ year = {1984},
16
+ doi = {10.1093/comjnl/27.2.97}
17
+ }
18
+ @misc{pandoc,
19
+ author = {MacFarlane, John},
20
+ title = {Pandoc: A Universal Document Converter},
21
+ year = {2006},
22
+ url = {https://pandoc.org/}
23
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "mdeck",
3
- "version": "3.6.1",
3
+ "version": "3.7.0",
4
4
  "type": "module",
5
5
  "description": "Write slides as a plain text file, present them in the browser, share them as one HTML file or PDF.",
6
6
  "license": "MIT",
@@ -54,7 +54,8 @@
54
54
  "playground": "vite --config playground/vite.config.js",
55
55
  "playground:build": "vite build --config playground/vite.config.js",
56
56
  "readme-images": "node tools/readme-images.mjs",
57
- "theme-images": "node tools/theme-images.mjs"
57
+ "theme-images": "node tools/theme-images.mjs",
58
+ "feature-images": "node tools/feature-images.mjs"
58
59
  },
59
60
  "dependencies": {
60
61
  "@citation-js/core": "^0.9.0",
@@ -142,7 +142,7 @@ To see slides yourself, if you can read pictures, run `mdeck snapshot <deck>.md
142
142
 
143
143
  When the user wants a look the built-in themes and palettes do not give (their institute's colours, a font, the style of a poster or picture), first run `mdeck themes search` or `mdeck palettes search` (with a word or two): someone may have shared it, and `mdeck themes install <theme> <deck>.md` (with its palette) or `mdeck palettes install <palette> <deck>.md` puts it beside the deck, so the slide folder carries it. Otherwise make it as an extension in `extensions/` beside the deck, never as styling on single slides. Read `extensions.md` from the reference folder first; it lists every setting.
144
144
 
145
- - **Colours only: a palette.** `extensions/<id>/extension.toml` with `kind = "palette"`, and every colour role (`--bg`, `--surface`, `--ink`, `--ink-soft`, `--muted`, `--rule`, `--accent`, `--accent-2`, `--on-accent`) in both `[light]` and `[dark]`. Text colours must stay readable on `--bg` and `--surface` in both variants, because themes use the other variant for inverted slides.
145
+ - **Colours only: a palette.** `extensions/<id>/extension.toml` with `kind = "palette"`, and every colour role (`--bg`, `--surface`, `--ink`, `--ink-soft`, `--muted`, `--rule`, `--accent`, `--accent-2`, `--accent-3`, `--on-accent`) in both `[light]` and `[dark]`: `--accent` is emphasis, `--accent-2` its companion, `--accent-3` attention (warnings; it may be too light for text, such as a yellow). Set all of them. Text colours must stay readable on `--bg` and `--surface` in both variants, because themes use the other variant for inverted slides.
146
146
  - **Fonts, sizes, spacing or arrangement: a theme.** Copy the folder of the closest built-in theme (`assets/extensions/themes/<id>/` in the mdeck repository or in `$(npm root -g)/mdeck/`) to `extensions/<new-id>/`, change `id` and `title`, then its tokens and `styles.css`. A theme takes no colours of its own: it names its default `palette`, and the colours come from palettes.
147
147
  - **Use it:** set `theme:` and `palette:` in the deck settings. `mdeck list <deck>.md` must show it as local, and `mdeck check <deck>.md` reports any mistake in its `extension.toml`.
148
148
  - **Hand over:** tell the user to run `mdeck design <deck>.md` (or `mdeck design <folder>` when there is no deck yet). It shows the look on a sample deck with every kind of slide, light and dark, and lets them fine-tune colours, fonts and sizes there.
@@ -26,6 +26,7 @@ export function checkDeck(slidesPath, registry, source = readFileSync(slidesPath
26
26
  for (const record of Object.values(registry.palettes)) {
27
27
  if (record.source !== 'local') continue
28
28
  for (const problem of paletteProblems(record.manifest)) diagnostics.push({ severity: 'warning', code: 'palette-contrast', message: `Palette "${record.id}", ${problem}`, line: 1, column: 1 })
29
+ for (const role of record.manifest.fallbacks ?? []) diagnostics.push({ severity: 'warning', code: 'palette-fallback', message: `Palette "${record.id}" sets no ${role}, so it gets mdeck's amber; give it a colour of its own in [light] and [dark]`, line: 1, column: 1 })
29
30
  }
30
31
  // The deck's drawings file: readable, and only for slides that still exist.
31
32
  const inkPath = inkFileFor(resolve(slidesPath))