mdeck 2.3.0 → 3.0.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.
- package/CHANGELOG.md +12 -1
- package/README.md +9 -9
- package/assets/base.css +4 -1
- package/assets/packs/academic/pack.toml +8 -0
- package/assets/packs/aurora/pack.toml +8 -0
- package/assets/packs/lagoon/pack.toml +8 -0
- package/assets/packs/minimal/minimal/extension.toml +45 -0
- package/assets/packs/minimal/minimal/styles.css +342 -0
- package/assets/packs/minimal/pack.toml +8 -0
- package/assets/packs/minimal/paper/extension.toml +27 -0
- package/assets/packs/neue/pack.toml +8 -0
- package/docs/reference/authoring.md +13 -18
- package/docs/reference/claude-skill.md +1 -1
- package/docs/reference/extensions.md +29 -20
- package/docs/reference/palettes.md +8 -12
- package/docs/reference/themes.md +8 -7
- package/docs/site/content/appearance.md +33 -49
- package/docs/site/content/commands.md +2 -2
- package/docs/site/content/theme-authoring.md +1 -1
- package/docs/site/content/theme-repository.md +19 -15
- package/docs/site/examples/first-talk.md +1 -1
- package/docs/site/images/themes/academic-dark.webp +0 -0
- package/docs/site/images/themes/academic-light.webp +0 -0
- package/docs/site/images/themes/academic.webp +0 -0
- package/docs/site/images/themes/aurora-dark.webp +0 -0
- package/docs/site/images/themes/aurora-light.webp +0 -0
- package/docs/site/images/themes/aurora.webp +0 -0
- package/docs/site/images/themes/minimal-dark.webp +0 -0
- package/docs/site/images/themes/minimal-light.webp +0 -0
- package/docs/site/images/themes/minimal.webp +0 -0
- package/docs/site/images/themes/neue-dark.webp +0 -0
- package/docs/site/images/themes/neue-light.webp +0 -0
- package/docs/site/images/themes/neue.webp +0 -0
- package/docs/site/pages.js +1 -1
- package/examples/custom-layouts/slides.md +1 -1
- package/examples/poll/slides.md +1 -1
- package/examples/python/slides.md +2 -2
- package/examples/showcase/slides.md +3 -3
- package/package.json +1 -1
- package/skills/write-slides/SKILL.md +2 -2
- package/src/build/check.js +0 -7
- package/src/build/editorPlugin.js +19 -11
- package/src/build/themeCheck.js +15 -5
- package/src/cli/args.js +1 -1
- package/src/cli/index.js +3 -3
- package/src/cli/themes.js +93 -64
- package/src/core/validateDeck.js +4 -2
- package/src/editor/api.js +9 -1
- package/src/editor/components/App.jsx +4 -2
- package/src/editor/components/DesignApp.jsx +12 -3
- package/src/editor/components/ExtensionEditor.jsx +15 -4
- package/src/editor/components/ExtensionsPanel.jsx +19 -21
- package/src/editor/designLink.js +18 -1
- package/src/editor/sampleDeck.js +3 -1
- package/src/extensions/appearance.js +2 -1
- package/src/extensions/discover.js +56 -16
- package/src/extensions/installed.js +63 -0
- package/src/extensions/moved.js +13 -0
- package/src/extensions/packs.js +135 -46
- package/src/home/Home.jsx +12 -6
- package/src/layouts/layoutApi.jsx +10 -2
- package/src/paths.js +2 -0
- package/src/runtime/themeLoader.js +5 -2
- package/assets/extensions/palettes/brand/extension.toml +0 -29
- package/assets/extensions/palettes/cobalt/extension.toml +0 -27
- package/assets/extensions/palettes/ember/extension.toml +0 -27
- package/assets/extensions/palettes/forest/extension.toml +0 -27
- package/assets/extensions/palettes/graphite/extension.toml +0 -27
- package/assets/extensions/palettes/pastel/extension.toml +0 -30
- package/assets/extensions/palettes/phosphor/extension.toml +0 -27
- package/assets/extensions/palettes/terra/extension.toml +0 -27
- package/assets/extensions/themes/duet/extension.toml +0 -46
- package/assets/extensions/themes/duet/styles.css +0 -573
- package/assets/extensions/themes/editorial/extension.toml +0 -46
- package/assets/extensions/themes/editorial/styles.css +0 -574
- package/assets/extensions/themes/fhnw/extension.toml +0 -61
- package/assets/extensions/themes/fhnw/styles.css +0 -604
- package/assets/extensions/themes/sketch/extension.toml +0 -48
- package/assets/extensions/themes/sketch/styles.css +0 -633
- package/assets/extensions/themes/terminal/extension.toml +0 -38
- package/assets/extensions/themes/terminal/styles.css +0 -550
- package/docs/site/images/themes/duet-dark.webp +0 -0
- package/docs/site/images/themes/duet-light.webp +0 -0
- package/docs/site/images/themes/duet.webp +0 -0
- package/docs/site/images/themes/editorial-dark.webp +0 -0
- package/docs/site/images/themes/editorial-light.webp +0 -0
- package/docs/site/images/themes/editorial.webp +0 -0
- package/docs/site/images/themes/fhnw.webp +0 -0
- package/docs/site/images/themes/sketch-dark.webp +0 -0
- package/docs/site/images/themes/sketch-light.webp +0 -0
- package/docs/site/images/themes/sketch.webp +0 -0
- package/docs/site/images/themes/terminal-dark.webp +0 -0
- package/docs/site/images/themes/terminal-light.webp +0 -0
- package/docs/site/images/themes/terminal.webp +0 -0
- package/examples/python/.mdeck-backups/slides.drawings-2026-10-06T08-36-47Z.json +0 -19
- package/examples/python/.mdeck-backups/slides.drawings-2026-10-06T11-27-30Z.json +0 -6
- package/examples/showcase/.mdeck-backups/slides.drawings-2026-10-06T08-08-30Z.json +0 -10
- package/examples/showcase/.mdeck-backups/slides.drawings-2026-10-06T11-41-35Z.json +0 -13
- /package/assets/{extensions/themes → packs/academic}/academic/extension.toml +0 -0
- /package/assets/{extensions/themes → packs/academic}/academic/styles.css +0 -0
- /package/assets/{extensions/palettes → packs/academic}/nordic/extension.toml +0 -0
- /package/assets/{extensions/themes → packs/aurora}/aurora/extension.toml +0 -0
- /package/assets/{extensions/themes → packs/aurora}/aurora/styles.css +0 -0
- /package/assets/{extensions/palettes → packs/aurora}/neon/extension.toml +0 -0
- /package/assets/{extensions/palettes → packs/lagoon}/lagoon/extension.toml +0 -0
- /package/assets/{extensions/themes → packs/neue}/neue/extension.toml +0 -0
- /package/assets/{extensions/themes → packs/neue}/neue/styles.css +0 -0
- /package/assets/{extensions/palettes → packs/neue}/swiss/extension.toml +0 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,17 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
-
##
|
|
3
|
+
## 3.0.0 — 2026-10-07
|
|
4
|
+
|
|
5
|
+
- Every theme and palette now comes in a pack, also those that come with mdeck: `neue`, `academic`, `aurora` and `minimal` (each a theme with its palette) and the palette `lagoon`. `graphite`, close to `nordic`, moved to the theme repository as a pack of its own. They work right away and offline, and can be removed: `mdeck themes remove aurora` hides it from every deck, `mdeck themes install aurora` brings it back without the internet. A newer version from the theme repository replaces the bundled one. A deck without a theme still uses `neue`, and says so when it was removed; the last theme cannot be removed.
|
|
6
|
+
- `mdeck themes install <pack>` installs for every deck by default; a slide file, a folder or `--local` installs beside that deck. Packs can require other packs (`requires = ["lagoon"]` in `pack.toml`) for palettes their themes use: installing one installs those too, and removing a pack another one needs is refused. The design page lists the packs you can install, including removed bundled ones, and removes a pack for every deck.
|
|
7
|
+
- `mdeck check` no longer warns about themes installed for every deck.
|
|
8
|
+
- Fewer built-in looks: mdeck now comes with the themes `neue`, `academic`, `aurora` and the new `minimal` and the palettes `swiss`, `nordic`, `neon`, `lagoon` and `graphite`. The others moved to the theme repository as packs of the same name: `duet` (with `cobalt`), `editorial` (with `terra`), `fhnw` (with `brand`), `terminal` (with `phosphor`) and `sketch` (with `pastel`), and the palettes `ember` and `forest` as `earth`. A deck that uses one gets an error that says what to run, for example `mdeck themes install duet my-talk.md`; files made with `mdeck send` or `mdeck build` keep working, because they carry their theme.
|
|
9
|
+
- New theme `minimal`: nothing but the content, in the computer's own fonts (no web fonts, so it works offline), with medium weights, space instead of rules and boxes, and "Chapter 2" as a quiet label above chapter titles. Its default palette is the new `paper`: off-white and near-black with one orange accent, charcoal and a softer orange in the dark.
|
|
10
|
+
- The sample deck's picture is a drawing in the palette's colours, and an SVG data URL that uses theme colours is drawn inline like an SVG file. A drawing in a picture's place now takes the space the layout gives it, like a photo, instead of pushing headings aside.
|
|
11
|
+
- The launch page of `mdeck run` has a Theme editor tile under Write and learn; it opens the design page of the deck's editor.
|
|
12
|
+
- The examples use built-in themes: the Python lesson `academic`, the poll and custom-layout examples `neue`, the docs home page talk `academic`.
|
|
13
|
+
|
|
14
|
+
## 2.3.0 — 2026-10-07
|
|
4
15
|
|
|
5
16
|
- mdeck moved to GitHub (<https://github.com/tilman-schieber/mdeck>) and is published on npmjs.com as `mdeck`: install it with `npm install -g mdeck`. The docs are at <https://gh.tschieber.de/mdeck/>. The GitLab project is archived; remove the old package with `npm uninstall -g @tilman.schieber/mdeck`.
|
|
6
17
|
- New `mdeck themes`: themes and palettes from the theme repository (<https://github.com/tilman-schieber/mdeck-themes>). `search` lists the packs, `install <pack> [slides.md]` copies one into the deck's `extensions/`, or with `--global` into `~/.mdeck/extensions` for every deck; `update`, `remove` and `list` work on what is installed, and refuse to overwrite files changed by hand without `--force`. Packs hold only `extension.toml` and `styles.css`, fonts only from Google Fonts or Bunny Fonts, and are checked against the checksum the repository lists. The design page lists the repository's packs with pictures and an Install button.
|
package/README.md
CHANGED
|
@@ -67,11 +67,12 @@ whenever you or the assistant change the file.
|
|
|
67
67
|
|
|
68
68
|
## One file, any look
|
|
69
69
|
|
|
70
|
-
The same slide file rendered with
|
|
71
|
-
|
|
70
|
+
The same slide file rendered with built-in themes and themes from the
|
|
71
|
+
[theme repository](https://github.com/tilman-schieber/mdeck-themes). Change
|
|
72
|
+
one line in the settings, or pick from the presenter view, and the whole deck
|
|
72
73
|
repaints.
|
|
73
74
|
|
|
74
|
-
<p align="center"><img src="docs/images/themes.gif" alt="The same slide cycling through
|
|
75
|
+
<p align="center"><img src="docs/images/themes.gif" alt="The same slide cycling through six themes, built in and from the theme repository" width="800"></p>
|
|
75
76
|
|
|
76
77
|
Try it yourself: the [docs home page](https://gh.tschieber.de/mdeck/)
|
|
77
78
|
embeds a live deck with a theme switcher.
|
|
@@ -113,7 +114,7 @@ mdeck send talk.md # one file to email, with a PDF inside
|
|
|
113
114
|
## What you get
|
|
114
115
|
|
|
115
116
|
- **Layouts:** title, chapter, big statement, image and text, split, full-bleed image, and plain content slides, with points that appear one at a time.
|
|
116
|
-
- **Looks:**
|
|
117
|
+
- **Looks:** four built-in themes and five colour palettes, each light or dark, changeable without touching the slides. Install more from the [theme repository](https://gh.tschieber.de/mdeck-themes/) with `mdeck themes install`, or make your own as small `extension.toml` folders beside the deck.
|
|
117
118
|
- **One launch page:** `mdeck run` opens a page with a live preview, the presenter and audience views, the deck and reader views, the editor, the guides, one-click builds and PDF, the deck's check results, and for decks with a server its health and the presenter code.
|
|
118
119
|
- **Presenting:** a presenter view with notes and timer, and an audience window that stays in sync.
|
|
119
120
|
- **Drawing on slides:** pen with pressure, highlighter and a fading marker, with a mouse, a finger or an iPad pencil (`D`). Drawings are saved in `<deck>.drawings.json` beside the deck and appear in every view, build and PDF. An iPad can present on its own, or pair with the laptop through a QR code on the launch page while the laptop's audience window follows it.
|
|
@@ -143,12 +144,11 @@ complete folder.
|
|
|
143
144
|
| Example | Theme | What it demonstrates |
|
|
144
145
|
|---|---|---|
|
|
145
146
|
| [Tour](examples/showcase/slides.md) | Aurora | Start here: each slide shows the Markdown beside what it becomes, from headings to layouts, live code, notes, drawing, a poll and sharing |
|
|
146
|
-
| [Python](examples/python/slides.md) |
|
|
147
|
-
| [Poll](examples/poll/slides.md) |
|
|
148
|
-
| [Custom layouts](examples/custom-layouts/slides.md) |
|
|
147
|
+
| [Python](examples/python/slides.md) | Academic | A real lesson: live code to try out, points revealed step by step, notes on every slide, a poll to check understanding |
|
|
148
|
+
| [Poll](examples/poll/slides.md) | Neue | A join slide, then a poll, a scale, a word cloud and open questions; start it with `mdeck run slides.md --network` |
|
|
149
|
+
| [Custom layouts](examples/custom-layouts/slides.md) | Neue | A deck-local comparison design and named regions |
|
|
149
150
|
|
|
150
|
-
The docs home page embeds a short talk
|
|
151
|
-
screenshots above show Neue.
|
|
151
|
+
The docs home page embeds a short talk, and the screenshots above show Neue.
|
|
152
152
|
|
|
153
153
|
## Made at FHNW
|
|
154
154
|
|
package/assets/base.css
CHANGED
|
@@ -79,7 +79,10 @@ deck-stage[data-ink-hidden] .slide-ink { display: none; }
|
|
|
79
79
|
}
|
|
80
80
|
.image-pane img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
|
81
81
|
.image-pane .themed-picture { width: 100%; height: 100%; }
|
|
82
|
-
|
|
82
|
+
/* A drawing in a picture's place sizes like a photo: its box takes the space
|
|
83
|
+
the layout gives it and may shrink below the drawing's own proportions. */
|
|
84
|
+
.themed-picture:not(.themed-picture--inline) { min-width: 0; min-height: 0; overflow: hidden; contain: size; }
|
|
85
|
+
.themed-picture:not(.themed-picture--inline) > svg { width: 100%; height: 100%; display: block; }
|
|
83
86
|
.slide-bg .slide-bg-picture { position: absolute; inset: 0; }
|
|
84
87
|
.themed-picture--inline { display: inline-block; max-width: 100%; vertical-align: middle; }
|
|
85
88
|
.themed-picture--inline > svg { display: block; max-width: 100%; height: auto; }
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
schema = 1
|
|
2
|
+
id = "academic"
|
|
3
|
+
title = "Academic"
|
|
4
|
+
description = "A lecture: Source Sans and Source Serif, compact slides with the heading in a fixed place, theorem and definition blocks, booktabs tables and a footnote rule."
|
|
5
|
+
version = "1.0.0"
|
|
6
|
+
author = "Tilman Schieber"
|
|
7
|
+
license = "MIT"
|
|
8
|
+
mdeck = ">=3.0.0"
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
schema = 1
|
|
2
|
+
kind = "theme"
|
|
3
|
+
id = "minimal"
|
|
4
|
+
title = "Minimal"
|
|
5
|
+
description = "Nothing but the content: system fonts, calm type, plenty of space, no decoration. Works offline."
|
|
6
|
+
# The palette this theme uses unless the deck sets one; colours come only from palettes.
|
|
7
|
+
palette = "paper"
|
|
8
|
+
# System fonts only: nothing to download, the same on every computer that has them.
|
|
9
|
+
fonts = []
|
|
10
|
+
|
|
11
|
+
[files]
|
|
12
|
+
styles = "styles.css"
|
|
13
|
+
|
|
14
|
+
# Type, spacing and fonts used by styles.css; colours come from the palette.
|
|
15
|
+
# Deck settings (params) override these.
|
|
16
|
+
[tokens]
|
|
17
|
+
|
|
18
|
+
# Type scale (px) — projection-appropriate at 1920×1080
|
|
19
|
+
"--fs-display" = "132px"
|
|
20
|
+
"--fs-title" = "104px"
|
|
21
|
+
"--fs-focus" = "84px"
|
|
22
|
+
"--fs-h" = "68px"
|
|
23
|
+
"--fs-sub" = "40px"
|
|
24
|
+
"--fs-body" = "34px"
|
|
25
|
+
"--fs-small" = "26px"
|
|
26
|
+
"--fs-eyebrow" = "24px"
|
|
27
|
+
|
|
28
|
+
# Spacing
|
|
29
|
+
"--pad-x" = "150px"
|
|
30
|
+
"--pad-y" = "84px"
|
|
31
|
+
"--gap-title" = "56px"
|
|
32
|
+
"--gap-item" = "26px"
|
|
33
|
+
|
|
34
|
+
# Type families: the system's own
|
|
35
|
+
"--font-display" = "system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif"
|
|
36
|
+
"--font-body" = "system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif"
|
|
37
|
+
|
|
38
|
+
# Settings authors can change under `params:` in the deck; each points at a token above.
|
|
39
|
+
[params.fontDisplay]
|
|
40
|
+
token = "--font-display"
|
|
41
|
+
title = "Display font"
|
|
42
|
+
|
|
43
|
+
[params.fontBody]
|
|
44
|
+
token = "--font-body"
|
|
45
|
+
title = "Body font"
|
|
@@ -0,0 +1,342 @@
|
|
|
1
|
+
/* Minimal — nothing but the content.
|
|
2
|
+
System fonts, so nothing loads and every computer shows the same faces it
|
|
3
|
+
already has; medium weights instead of heavy ones; space instead of rules,
|
|
4
|
+
bars and boxes. The accent marks emphasis and little else. Every slide
|
|
5
|
+
stays on the deck's background: the talk's rhythm comes from the type.
|
|
6
|
+
Everything takes its colours from the palette's roles, so every palette
|
|
7
|
+
works on it. */
|
|
8
|
+
|
|
9
|
+
/* ─────────────────────────────────────────────
|
|
10
|
+
HEADER / FOOTER: quiet labels, no rules
|
|
11
|
+
───────────────────────────────────────────── */
|
|
12
|
+
.slide-header {
|
|
13
|
+
font-weight: 500;
|
|
14
|
+
letter-spacing: 0.02em;
|
|
15
|
+
color: var(--muted);
|
|
16
|
+
}
|
|
17
|
+
.slide-header .brand { color: var(--muted); }
|
|
18
|
+
.slide-logo {
|
|
19
|
+
position: absolute;
|
|
20
|
+
top: var(--pad-y);
|
|
21
|
+
right: var(--pad-x);
|
|
22
|
+
height: 96px;
|
|
23
|
+
width: auto;
|
|
24
|
+
max-width: 420px;
|
|
25
|
+
object-fit: contain;
|
|
26
|
+
filter: var(--logo-filter, none);
|
|
27
|
+
transform: translateY(calc(var(--fs-eyebrow) * 0.5 - 50%));
|
|
28
|
+
}
|
|
29
|
+
.slide-footer {
|
|
30
|
+
font-family: var(--font-body);
|
|
31
|
+
font-size: var(--fs-small);
|
|
32
|
+
color: var(--muted);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
/* ─────────────────────────────────────────────
|
|
36
|
+
TYPOGRAPHY HELPERS
|
|
37
|
+
───────────────────────────────────────────── */
|
|
38
|
+
.eyebrow {
|
|
39
|
+
font-family: var(--font-body);
|
|
40
|
+
font-size: var(--fs-eyebrow);
|
|
41
|
+
font-weight: 500;
|
|
42
|
+
color: var(--muted);
|
|
43
|
+
margin: 0 0 24px 0;
|
|
44
|
+
}
|
|
45
|
+
.display {
|
|
46
|
+
font-family: var(--font-display);
|
|
47
|
+
font-size: var(--fs-display);
|
|
48
|
+
font-weight: 600;
|
|
49
|
+
line-height: 1.05;
|
|
50
|
+
letter-spacing: -0.025em;
|
|
51
|
+
margin: 0;
|
|
52
|
+
color: var(--ink);
|
|
53
|
+
text-wrap: balance;
|
|
54
|
+
}
|
|
55
|
+
.title {
|
|
56
|
+
font-family: var(--font-display);
|
|
57
|
+
font-size: var(--fs-h);
|
|
58
|
+
font-weight: 600;
|
|
59
|
+
line-height: 1.1;
|
|
60
|
+
letter-spacing: -0.02em;
|
|
61
|
+
margin: 0;
|
|
62
|
+
color: var(--ink);
|
|
63
|
+
text-wrap: balance;
|
|
64
|
+
}
|
|
65
|
+
.subtitle {
|
|
66
|
+
font-family: var(--font-body);
|
|
67
|
+
font-size: var(--fs-sub);
|
|
68
|
+
font-weight: 400;
|
|
69
|
+
line-height: 1.3;
|
|
70
|
+
color: var(--ink-soft);
|
|
71
|
+
margin: 0;
|
|
72
|
+
text-wrap: pretty;
|
|
73
|
+
}
|
|
74
|
+
.body-text {
|
|
75
|
+
font-family: var(--font-body);
|
|
76
|
+
font-size: var(--fs-body);
|
|
77
|
+
line-height: 1.5;
|
|
78
|
+
color: var(--ink-soft);
|
|
79
|
+
margin: 0;
|
|
80
|
+
text-wrap: pretty;
|
|
81
|
+
}
|
|
82
|
+
.meta {
|
|
83
|
+
font-family: var(--font-body);
|
|
84
|
+
font-size: var(--fs-small);
|
|
85
|
+
color: var(--muted);
|
|
86
|
+
}
|
|
87
|
+
em { font-style: normal; color: var(--accent); }
|
|
88
|
+
strong { color: var(--ink); font-weight: 600; }
|
|
89
|
+
|
|
90
|
+
/* ─────────────────────────────────────────────
|
|
91
|
+
LAYOUT: TITLE — the title low on the left, nothing else
|
|
92
|
+
───────────────────────────────────────────── */
|
|
93
|
+
.slide--title .slide-body {
|
|
94
|
+
justify-content: flex-end;
|
|
95
|
+
padding-bottom: 40px;
|
|
96
|
+
}
|
|
97
|
+
.slide--title .display { font-size: var(--fs-display); margin: 0; max-width: 1500px; }
|
|
98
|
+
.slide--title .subtitle { margin-top: 36px; max-width: 1200px; }
|
|
99
|
+
.slide--title.has-image .slide-body {
|
|
100
|
+
display: grid;
|
|
101
|
+
grid-template-columns: 1fr 1fr;
|
|
102
|
+
column-gap: 96px;
|
|
103
|
+
align-items: end;
|
|
104
|
+
}
|
|
105
|
+
.slide--title.has-image .display { font-size: calc(var(--fs-display) * 0.72); }
|
|
106
|
+
.slide--title.has-image .title-image { width: 100%; height: 620px; object-fit: cover; }
|
|
107
|
+
|
|
108
|
+
/* ─────────────────────────────────────────────
|
|
109
|
+
LAYOUT: CHAPTER — "Chapter 2" as a quiet label, then the title
|
|
110
|
+
───────────────────────────────────────────── */
|
|
111
|
+
.slide--chapter .slide-body {
|
|
112
|
+
justify-content: center;
|
|
113
|
+
align-items: flex-start;
|
|
114
|
+
}
|
|
115
|
+
/* "Chapter 2" on one line, then the title and the description below. */
|
|
116
|
+
.slide--chapter .chapter-content { display: grid; grid-template-columns: auto 1fr; column-gap: 0.35em; align-items: baseline; justify-items: start; width: 100%; }
|
|
117
|
+
.slide--chapter .chapter-content > * { grid-column: 1 / -1; }
|
|
118
|
+
.slide--chapter .chapter-content > .chapter-meta { grid-column: 1; grid-row: 1; }
|
|
119
|
+
.slide--chapter .chapter-content > .chapter-num { grid-column: 2; grid-row: 1; }
|
|
120
|
+
.chapter-num {
|
|
121
|
+
font-family: var(--font-body);
|
|
122
|
+
font-size: var(--fs-eyebrow);
|
|
123
|
+
font-weight: 500;
|
|
124
|
+
color: var(--accent);
|
|
125
|
+
margin: 0;
|
|
126
|
+
}
|
|
127
|
+
.chapter-meta {
|
|
128
|
+
font-family: var(--font-body);
|
|
129
|
+
font-size: var(--fs-eyebrow);
|
|
130
|
+
font-weight: 500;
|
|
131
|
+
color: var(--muted);
|
|
132
|
+
margin: 0;
|
|
133
|
+
}
|
|
134
|
+
.slide--chapter .chapter-title {
|
|
135
|
+
font-family: var(--font-display);
|
|
136
|
+
font-size: var(--fs-title);
|
|
137
|
+
font-weight: 600;
|
|
138
|
+
line-height: 1.05;
|
|
139
|
+
letter-spacing: -0.025em;
|
|
140
|
+
margin: 24px 0 36px 0;
|
|
141
|
+
color: var(--ink);
|
|
142
|
+
max-width: 1400px;
|
|
143
|
+
text-wrap: balance;
|
|
144
|
+
}
|
|
145
|
+
.slide--chapter .chapter-desc {
|
|
146
|
+
font-family: var(--font-body);
|
|
147
|
+
font-size: var(--fs-sub);
|
|
148
|
+
line-height: 1.35;
|
|
149
|
+
color: var(--ink-soft);
|
|
150
|
+
max-width: 1100px;
|
|
151
|
+
margin: 0;
|
|
152
|
+
}
|
|
153
|
+
.slide--chapter.has-image .slide-body {
|
|
154
|
+
display: grid;
|
|
155
|
+
grid-template-columns: 1fr 1fr;
|
|
156
|
+
column-gap: 96px;
|
|
157
|
+
align-items: center;
|
|
158
|
+
}
|
|
159
|
+
.slide--chapter.has-image .chapter-title { font-size: calc(var(--fs-title) * 0.75); }
|
|
160
|
+
.slide--chapter.has-image .chapter-image { width: 100%; height: 100%; max-height: 760px; object-fit: cover; }
|
|
161
|
+
|
|
162
|
+
/* ─────────────────────────────────────────────
|
|
163
|
+
LAYOUT: FOCUS — one statement, large, on the same background
|
|
164
|
+
───────────────────────────────────────────── */
|
|
165
|
+
.slide--focus .slide-body {
|
|
166
|
+
justify-content: center;
|
|
167
|
+
align-items: flex-start;
|
|
168
|
+
}
|
|
169
|
+
.focus-eyebrow {
|
|
170
|
+
font-family: var(--font-body);
|
|
171
|
+
font-size: var(--fs-eyebrow);
|
|
172
|
+
font-weight: 500;
|
|
173
|
+
color: var(--muted);
|
|
174
|
+
margin: 0 0 40px 0;
|
|
175
|
+
}
|
|
176
|
+
.focus-statement,
|
|
177
|
+
.slide--focus .focus-content h1,
|
|
178
|
+
.slide--focus .focus-content p {
|
|
179
|
+
font-family: var(--font-display);
|
|
180
|
+
font-size: var(--fs-focus);
|
|
181
|
+
font-weight: 500;
|
|
182
|
+
line-height: 1.15;
|
|
183
|
+
letter-spacing: -0.02em;
|
|
184
|
+
color: var(--ink);
|
|
185
|
+
max-width: 1450px;
|
|
186
|
+
margin: 0;
|
|
187
|
+
text-wrap: balance;
|
|
188
|
+
}
|
|
189
|
+
.focus-content { display: flex; flex-direction: column; align-items: flex-start; width: 100%; }
|
|
190
|
+
.focus-attribution {
|
|
191
|
+
font-family: var(--font-body);
|
|
192
|
+
font-size: var(--fs-small);
|
|
193
|
+
color: var(--muted);
|
|
194
|
+
margin: 48px 0 0 0;
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
/* ─────────────────────────────────────────────
|
|
198
|
+
LAYOUT: IMAGE + TEXT
|
|
199
|
+
───────────────────────────────────────────── */
|
|
200
|
+
.image-pane {
|
|
201
|
+
flex: 1.1;
|
|
202
|
+
min-width: 0;
|
|
203
|
+
display: flex;
|
|
204
|
+
align-items: center;
|
|
205
|
+
justify-content: center;
|
|
206
|
+
background: var(--surface);
|
|
207
|
+
overflow: hidden;
|
|
208
|
+
position: relative;
|
|
209
|
+
}
|
|
210
|
+
.image-placeholder { width: 100%; height: 100%; background: var(--surface); display: flex; align-items: center; justify-content: center; }
|
|
211
|
+
.image-placeholder span { font-family: var(--font-body); font-size: 22px; color: var(--muted); }
|
|
212
|
+
.text-pane .title { font-size: calc(var(--fs-h) * 0.9); }
|
|
213
|
+
.text-pane .body-text + .body-text { margin-top: 8px; }
|
|
214
|
+
|
|
215
|
+
/* ─────────────────────────────────────────────
|
|
216
|
+
LISTS — a short dash, plain numbers
|
|
217
|
+
───────────────────────────────────────────── */
|
|
218
|
+
.slide-body ul li { line-height: 1.4; padding-left: 40px; position: relative; }
|
|
219
|
+
.slide-body ul li::before {
|
|
220
|
+
content: '';
|
|
221
|
+
position: absolute;
|
|
222
|
+
left: 0;
|
|
223
|
+
top: 0.72em;
|
|
224
|
+
width: 16px;
|
|
225
|
+
height: 2px;
|
|
226
|
+
background: var(--muted);
|
|
227
|
+
}
|
|
228
|
+
.slide-body ol li { padding-left: 52px; position: relative; }
|
|
229
|
+
.slide-body ol li::before {
|
|
230
|
+
content: counter(slide-ol) '.';
|
|
231
|
+
position: absolute;
|
|
232
|
+
left: 0;
|
|
233
|
+
color: var(--muted);
|
|
234
|
+
font-variant-numeric: tabular-nums;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
/* ─────────────────────────────────────────────
|
|
238
|
+
LAYOUT: FULL-BLEED IMAGE
|
|
239
|
+
───────────────────────────────────────────── */
|
|
240
|
+
.slide--full-bleed-image.has-overlay .slide-bg::after {
|
|
241
|
+
content: '';
|
|
242
|
+
position: absolute;
|
|
243
|
+
inset: 0;
|
|
244
|
+
background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.1) 60%);
|
|
245
|
+
}
|
|
246
|
+
.slide--full-bleed-image .overlay-title {
|
|
247
|
+
font-family: var(--font-display);
|
|
248
|
+
font-size: var(--fs-h);
|
|
249
|
+
font-weight: 600;
|
|
250
|
+
line-height: 1.1;
|
|
251
|
+
letter-spacing: -0.02em;
|
|
252
|
+
color: #fff;
|
|
253
|
+
margin: 0;
|
|
254
|
+
max-width: 1300px;
|
|
255
|
+
text-wrap: balance;
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
/* ─────────────────────────────────────────────
|
|
259
|
+
GENERIC / CONTENT SLIDE
|
|
260
|
+
───────────────────────────────────────────── */
|
|
261
|
+
.slide-body h1 {
|
|
262
|
+
font-family: var(--font-display);
|
|
263
|
+
font-size: var(--fs-h);
|
|
264
|
+
font-weight: 600;
|
|
265
|
+
line-height: 1.1;
|
|
266
|
+
letter-spacing: -0.02em;
|
|
267
|
+
color: var(--ink);
|
|
268
|
+
margin: 0 0 var(--gap-title) 0;
|
|
269
|
+
max-width: 1500px;
|
|
270
|
+
text-wrap: balance;
|
|
271
|
+
}
|
|
272
|
+
.slide-body h2 {
|
|
273
|
+
font-family: var(--font-display);
|
|
274
|
+
font-size: var(--fs-sub);
|
|
275
|
+
font-weight: 600;
|
|
276
|
+
line-height: 1.2;
|
|
277
|
+
color: var(--ink);
|
|
278
|
+
margin: 0 0 var(--gap-item) 0;
|
|
279
|
+
}
|
|
280
|
+
.slide-body p {
|
|
281
|
+
font-family: var(--font-body);
|
|
282
|
+
font-size: var(--fs-body);
|
|
283
|
+
line-height: 1.5;
|
|
284
|
+
color: var(--ink-soft);
|
|
285
|
+
margin: 0 0 var(--gap-item) 0;
|
|
286
|
+
text-wrap: pretty;
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
/* ─────────────────────────────────────────────
|
|
290
|
+
CALLOUTS — a thin line on the left in the callout's colour
|
|
291
|
+
───────────────────────────────────────────── */
|
|
292
|
+
.slide-body .callout {
|
|
293
|
+
background: none;
|
|
294
|
+
border-left: 3px solid var(--rule);
|
|
295
|
+
border-radius: 0;
|
|
296
|
+
padding: 4px 0 4px 32px;
|
|
297
|
+
margin: 32px 0 0;
|
|
298
|
+
max-width: 1200px;
|
|
299
|
+
}
|
|
300
|
+
.slide-body .callout-tip { border-left-color: var(--accent); }
|
|
301
|
+
.slide-body .callout-note { border-left-color: var(--callout-note); }
|
|
302
|
+
.slide-body .callout-important { border-left-color: var(--callout-important); }
|
|
303
|
+
.slide-body .callout-warning { border-left-color: var(--callout-warning); }
|
|
304
|
+
.slide-body .callout-caution { border-left-color: var(--callout-caution); }
|
|
305
|
+
.slide-body .callout-title { margin-bottom: 8px; }
|
|
306
|
+
.slide-body .callout p { padding-left: 0; color: var(--ink); font-size: var(--fs-body); }
|
|
307
|
+
/* Lecture blocks: theorems in the accent, definitions in the second */
|
|
308
|
+
.slide-body :is(.callout-theorem, .callout-lemma, .callout-corollary) { border-left-color: var(--accent); }
|
|
309
|
+
.slide-body .callout-definition { border-left-color: var(--accent-2); }
|
|
310
|
+
|
|
311
|
+
/* ─────────────────────────────────────────────
|
|
312
|
+
CODE — on the surface, no frame
|
|
313
|
+
───────────────────────────────────────────── */
|
|
314
|
+
.code-block {
|
|
315
|
+
--code-bg: var(--surface, var(--rule));
|
|
316
|
+
--code-radius: 6px;
|
|
317
|
+
--code-size: 28px;
|
|
318
|
+
background: var(--code-bg);
|
|
319
|
+
border-radius: var(--code-radius);
|
|
320
|
+
padding: 36px 44px;
|
|
321
|
+
margin: 0;
|
|
322
|
+
overflow: hidden;
|
|
323
|
+
font-size: var(--code-size);
|
|
324
|
+
font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
|
|
325
|
+
line-height: 1.6;
|
|
326
|
+
}
|
|
327
|
+
.code-block code { font-family: inherit; font-size: inherit; background: none; padding: 0; }
|
|
328
|
+
|
|
329
|
+
/* ─────────────────────────────────────────────
|
|
330
|
+
AUDIENCE QUESTIONS
|
|
331
|
+
───────────────────────────────────────────── */
|
|
332
|
+
.slide .poll-track, .slide .scale-track { background: var(--surface); }
|
|
333
|
+
|
|
334
|
+
/* ─────────────────────────────────────────────
|
|
335
|
+
MATH (KaTeX)
|
|
336
|
+
───────────────────────────────────────────── */
|
|
337
|
+
.slide .katex-display {
|
|
338
|
+
font-size: var(--fs-sub);
|
|
339
|
+
margin: 40px 0;
|
|
340
|
+
overflow-x: auto;
|
|
341
|
+
overflow-y: hidden;
|
|
342
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
schema = 1
|
|
2
|
+
kind = "palette"
|
|
3
|
+
id = "paper"
|
|
4
|
+
title = "Paper"
|
|
5
|
+
description = "Off-white paper and near-black ink, with one orange accent; charcoal and a softer orange in the dark."
|
|
6
|
+
|
|
7
|
+
[light]
|
|
8
|
+
"--bg" = "#fbfaf7"
|
|
9
|
+
"--surface" = "#f0eee9"
|
|
10
|
+
"--ink" = "#161616"
|
|
11
|
+
"--ink-soft" = "#333333"
|
|
12
|
+
"--muted" = "#6b6a66"
|
|
13
|
+
"--rule" = "#e0ddd6"
|
|
14
|
+
"--accent" = "#c2410c"
|
|
15
|
+
"--accent-2" = "#1f2937"
|
|
16
|
+
"--on-accent" = "#ffffff"
|
|
17
|
+
|
|
18
|
+
[dark]
|
|
19
|
+
"--bg" = "#151515"
|
|
20
|
+
"--surface" = "#202020"
|
|
21
|
+
"--ink" = "#f1efea"
|
|
22
|
+
"--ink-soft" = "#d6d3cc"
|
|
23
|
+
"--muted" = "#97948c"
|
|
24
|
+
"--rule" = "#2e2e2c"
|
|
25
|
+
"--accent" = "#fb8c4a"
|
|
26
|
+
"--accent-2" = "#e7e5e0"
|
|
27
|
+
"--on-accent" = "#151515"
|
|
@@ -41,7 +41,7 @@ Each `---` line starts a new slide. Frontmatter is only needed when you want a s
|
|
|
41
41
|
| Field | Default | Description |
|
|
42
42
|
|---|---|---|
|
|
43
43
|
| `theme` | `neue` | Theme name |
|
|
44
|
-
| `palette` | _(theme default)_ | Colour palette: `
|
|
44
|
+
| `palette` | _(theme default)_ | Colour palette: `swiss`, `nordic`, `neon`, `lagoon`, `paper`, one installed from the theme repository, or one of your own |
|
|
45
45
|
| `appearance` | _(theme default)_ | `light` or `dark`: which variant of the palette the slides use |
|
|
46
46
|
| `meta.title` | — | Deck title (shown in footer) |
|
|
47
47
|
| `meta.author` | — | Author name (shown in footer) |
|
|
@@ -104,15 +104,15 @@ view is reachable in any build through `?view=reader`.
|
|
|
104
104
|
|---|---|
|
|
105
105
|
| `neue` | Swiss style: Inter Tight and Inter, large flush-left type, a rule across the top, square accent markers, red on white |
|
|
106
106
|
| `aurora` | Northern lights: Plus Jakarta Sans, curtains of light in the palette's accents, night-sky chapter slides, frosted glass |
|
|
107
|
-
| `
|
|
108
|
-
| `editorial` | Magazine spread: Newsreader headlines, Lora body, drop caps and pull quotes |
|
|
109
|
-
| `fhnw` | The FHNW corporate design: Inter, black on white, yellow accent areas |
|
|
110
|
-
| `terminal` | A terminal session: JetBrains Mono, headings at a prompt, a blinking cursor on the title, log-line callouts, a tmux status bar; dark by default |
|
|
107
|
+
| `minimal` | Nothing but the content: the system's own fonts (no web fonts, works offline), medium weights, space instead of rules and boxes |
|
|
111
108
|
| `academic` | A lecture: Source Sans and Source Serif, compact type with the heading fixed at the top and the content centred below, theorem and definition blocks, booktabs tables, a footnote rule |
|
|
112
|
-
| `sketch` | A sketchbook: Caveat and Patrick Hand on dotted paper, marker scribbles, circled numbers, sticky-note callouts, taped photos; a chalkboard in the dark |
|
|
113
109
|
|
|
114
|
-
|
|
115
|
-
|
|
110
|
+
More themes (duet, editorial, fhnw, terminal, sketch) are in the theme
|
|
111
|
+
repository: `mdeck themes search` lists them, and
|
|
112
|
+
`mdeck themes install <pack> <deck>.md` puts one beside the deck.
|
|
113
|
+
|
|
114
|
+
`mdeck list <deck>.md` lists the built-in themes together with any themes kept
|
|
115
|
+
beside the deck.
|
|
116
116
|
|
|
117
117
|
---
|
|
118
118
|
|
|
@@ -122,19 +122,14 @@ Each palette has a light and a dark variant; `appearance:` picks one.
|
|
|
122
122
|
|
|
123
123
|
| Key | Light | Dark |
|
|
124
124
|
|---|---|---|
|
|
125
|
-
| `lagoon` | Teal on warm stone | Bright teal on teal-black |
|
|
126
125
|
| `swiss` | White, black, signal red (neue's default) | Black, white, red |
|
|
127
|
-
| `
|
|
128
|
-
| `nordic` | Ice grey, navy, steel blue | Polar night, ice blue |
|
|
129
|
-
| `graphite` | Black and white, steel blue | Charcoal, light steel blue |
|
|
130
|
-
| `terra` | Cream, navy, brick red (editorial's default) | Navy, cream, coral |
|
|
131
|
-
| `forest` | Deep green, moss, ochre | Forest night, light green |
|
|
132
|
-
| `ember` | Sand, espresso, orange | Dark brown, glowing orange |
|
|
126
|
+
| `nordic` | Ice grey, navy, steel blue (academic's default) | Polar night, ice blue |
|
|
133
127
|
| `neon` | White, violet, magenta (aurora's default) | Black, neon violet and pink |
|
|
134
|
-
| `
|
|
135
|
-
| `
|
|
128
|
+
| `lagoon` | Teal on warm stone | Bright teal on teal-black |
|
|
129
|
+
| `paper` | Off-white, near-black, orange (minimal's default) | Charcoal, soft orange |
|
|
136
130
|
|
|
137
|
-
|
|
131
|
+
More palettes (cobalt, terra, phosphor, pastel, ember, forest, among others)
|
|
132
|
+
are in the theme repository; install them with `mdeck themes install <pack> <deck>.md`.
|
|
138
133
|
|
|
139
134
|
---
|
|
140
135
|
|
|
@@ -40,7 +40,7 @@ to keep to the original.
|
|
|
40
40
|
|
|
41
41
|
```prompt
|
|
42
42
|
/write-slides Rebuild kinetics-2023.pptx as a 45-minute lecture for
|
|
43
|
-
second-year biology students, in German,
|
|
43
|
+
second-year biology students, in German, academic theme. Keep the order
|
|
44
44
|
and the figures, split the crowded slides, and add what is new in
|
|
45
45
|
notes/2026-changes.md.
|
|
46
46
|
```
|