mdeck 2.3.0 → 3.0.0

package/assets/extensions/themes/duet/styles.css

@@ -1,573 +0,0 @@
-/* Duet — two voices.
-   Two accents for contrasting ideas, on every slide: the footer rule changes
-   colour halfway, list markers take turns, a split slide is a dialogue of two
-   colour fields, and a chapter slide is cut diagonally between the two.
-   Headings are heavy, tight slab serif; body text a quiet grotesque.
-   The second accent is only guaranteed 3:1 on the background, so it carries
-   headings, markers and surfaces, never body text, and nothing is written on
-   it except the background colour. Colours come only from the palette roles. */
-
-.slide {
-  --tint-1: color-mix(in oklab, var(--accent) 9%, var(--bg));
-  --tint-2: color-mix(in oklab, var(--accent-2) 12%, var(--bg));
-}
-
-/* ─────────────────────────────────────────────
-   HEADER / FOOTER — the footer rule is two-tone, split at the middle
-   ───────────────────────────────────────────── */
-.slide-header {
-  font-weight: 500;
-  letter-spacing: 0.1em;
-  text-transform: uppercase;
-}
-.slide-header .brand   { color: var(--muted); }
-.slide-header .section { color: var(--accent); font-weight: 700; }
-
-.slide-logo {
-  position: absolute;
-  top: var(--pad-y);
-  right: var(--pad-x);
-  height: 120px;
-  width: auto;
-  max-width: 480px;
-  object-fit: contain;
-  filter: var(--logo-filter, none);
-  transform: translateY(calc(var(--fs-eyebrow) * 0.5 - 50%));
-}
-
-.slide-footer {
-  font-family: var(--font-body);
-  font-size: var(--fs-small);
-  font-weight: 400;
-  color: var(--muted);
-  border-top: 4px solid;
-  border-image: linear-gradient(to right, var(--accent) 50%, var(--accent-2) 50%) 1;
-  padding-top: 24px;
-}
-/* The page number in the slab face (a title slide's footer has only the author line). */
-.slide-footer > span:last-child:not(:first-child) {
-  font-family: var(--font-display);
-  font-weight: 700;
-  color: var(--ink);
-}
-
-/* ─────────────────────────────────────────────
-   TYPOGRAPHY HELPERS
-   ───────────────────────────────────────────── */
-.eyebrow {
-  font-family: var(--font-body);
-  font-size: var(--fs-eyebrow);
-  font-weight: 700;
-  letter-spacing: 0.16em;
-  text-transform: uppercase;
-  color: var(--accent);
-  margin: 0 0 var(--gap-title) 0;
-}
-.display {
-  font-family: var(--font-display);
-  font-size: var(--fs-display);
-  font-weight: 700;
-  line-height: 0.98;
-  letter-spacing: -0.03em;
-  margin: 0;
-  color: var(--ink);
-  text-wrap: balance;
-}
-.title {
-  font-family: var(--font-display);
-  font-size: var(--fs-h);
-  font-weight: 700;
-  line-height: 1.02;
-  letter-spacing: -0.025em;
-  margin: 0;
-  color: var(--ink);
-  text-wrap: balance;
-}
-.subtitle {
-  font-family: var(--font-body);
-  font-size: var(--fs-sub);
-  font-weight: 400;
-  line-height: 1.25;
-  letter-spacing: -0.01em;
-  color: var(--ink-soft);
-  margin: 0;
-  text-wrap: pretty;
-}
-.body-text {
-  font-family: var(--font-body);
-  font-size: var(--fs-body);
-  font-weight: 400;
-  line-height: 1.5;
-  color: var(--ink-soft);
-  margin: 0;
-  text-wrap: pretty;
-}
-.meta {
-  font-family: var(--font-body);
-  font-size: var(--fs-small);
-  color: var(--muted);
-}
-
-/* Emphasis: the first voice in running text, the second in large type. */
-em {
-  font-style: normal;
-  font-weight: 500;
-  color: var(--accent);
-}
-:is(h1, h2, .display, .title, .chapter-title, .focus-content) em {
-  font-weight: inherit;
-  color: var(--accent-2);
-}
-strong { color: var(--ink); font-weight: 700; }
-
-/* ─────────────────────────────────────────────
-   LAYOUT: TITLE — the boldest slide: all of it in the first accent, a band
-   of the second slanted like the chapter seam, the headline in the
-   accent's own text colour
-   ───────────────────────────────────────────── */
-.slide--title {
-  background: var(--accent);
-  color: var(--on-accent);
-}
-.slide--title::after {
-  content: '';
-  position: absolute;
-  inset: 0;
-  background: var(--accent-2);
-  clip-path: polygon(85% 0, 91% 0, 81% 100%, 75% 100%);
-  pointer-events: none;
-}
-.slide--title > :not(.slide-logo, .slide-ink) { position: relative; z-index: 1; }
-.slide--title .slide-logo { z-index: 1; }
-.slide--title :is(.slide-header, .slide-header .brand, .slide-footer) { color: var(--on-accent); }
-.slide--title .slide-footer { border-image-source: none; border-top-color: transparent; }
-.slide--title .slide-body {
-  justify-content: center;
-  align-items: flex-start;
-}
-/* The duet mark: a bar in the slide's text colour, one in the second accent. */
-.slide--title .title-text::before {
-  content: '';
-  display: block;
-  width: 244px;
-  height: 52px;
-  background:
-    linear-gradient(var(--on-accent), var(--on-accent)) 0 0 / 180px 20px no-repeat,
-    linear-gradient(var(--accent-2), var(--accent-2)) 64px 32px / 180px 20px no-repeat;
-  margin-bottom: 64px;
-}
-.slide--title .display {
-  font-size: var(--fs-display);
-  color: var(--on-accent);
-  /* Clear of the band on the right. */
-  max-width: 1280px;
-}
-/* The second accent is not readable on the first: emphasis keeps the
-   slide's text colour and is underlined in the second accent. */
-.slide--title :is(.display, .subtitle) em {
-  color: inherit;
-  text-decoration: underline;
-  text-decoration-color: var(--accent-2);
-  text-decoration-thickness: 0.09em;
-  text-underline-offset: 0.12em;
-  text-decoration-skip-ink: none;
-}
-.slide--title .subtitle {
-  margin-top: 48px;
-  max-width: 1100px;
-  color: var(--on-accent);
-}
-.slide--title.has-image .slide-body {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  column-gap: 80px;
-  align-items: center;
-}
-.slide--title.has-image .display { font-size: calc(var(--fs-display) * 0.65); }
-.slide--title.has-image .title-image {
-  width: 100%;
-  height: 600px;
-  object-fit: cover;
-}
-.slide--title.has-image .display { max-width: none; }
-
-/* ─────────────────────────────────────────────
-   LAYOUT: CHAPTER — cut diagonally: a field of the first accent with the
-   number, a seam of the second, and the title on the background
-   ───────────────────────────────────────────── */
-.slide--chapter:not(.has-image)::before,
-.slide--chapter:not(.has-image)::after {
-  content: '';
-  position: absolute;
-  inset: 0;
-  pointer-events: none;
-}
-.slide--chapter:not(.has-image)::before {
-  background: var(--accent);
-  clip-path: polygon(0 0, 40% 0, 30% 100%, 0 100%);
-}
-.slide--chapter:not(.has-image)::after {
-  background: var(--accent-2);
-  clip-path: polygon(40% 0, 43% 0, 33% 100%, 30% 100%);
-}
-.slide--chapter > * { position: relative; z-index: 1; }
-.slide--chapter > .slide-ink { position: absolute; z-index: 50; }
-.slide--chapter:not(.has-image) .slide-header .brand,
-.slide--chapter:not(.has-image) .slide-footer > span:first-child { color: var(--on-accent); }
-.slide--chapter:not(.has-image) .slide-footer { border-image-source: none; border-top-color: transparent; }
-
-.slide--chapter .slide-body {
-  justify-content: center;
-  align-items: flex-start;
-  position: static;
-}
-/* The title starts clear of the seam (the slide is 1920 px wide). */
-.slide--chapter:not(.has-image) .slide-body { padding-left: calc(880px - var(--pad-x)); }
-.chapter-num {
-  position: absolute;
-  left: var(--pad-x);
-  bottom: calc(var(--pad-y) + 110px);
-  font-family: var(--font-display);
-  font-size: 360px;
-  font-weight: 700;
-  line-height: 0.75;
-  letter-spacing: -0.02em;
-  color: var(--on-accent);
-  margin: 0;
-  pointer-events: none;
-}
-.chapter-meta {
-  font-family: var(--font-body);
-  font-size: var(--fs-eyebrow);
-  font-weight: 700;
-  letter-spacing: 0.16em;
-  text-transform: uppercase;
-  color: var(--accent-2);
-  margin: 0 0 28px 0;
-}
-.slide--chapter .chapter-title {
-  font-family: var(--font-display);
-  font-size: var(--fs-title);
-  font-weight: 700;
-  line-height: 1.0;
-  letter-spacing: -0.03em;
-  margin: 0 0 40px 0;
-  color: var(--ink);
-  max-width: 900px;
-  text-wrap: balance;
-}
-.slide--chapter .chapter-desc {
-  font-family: var(--font-body);
-  font-size: var(--fs-sub);
-  font-weight: 400;
-  line-height: 1.3;
-  color: var(--ink-soft);
-  max-width: 860px;
-  margin: 0;
-}
-.slide--chapter.has-image .slide-body {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  column-gap: 80px;
-  align-items: center;
-}
-.slide--chapter.has-image .chapter-num {
-  position: static;
-  font-size: 200px;
-  color: var(--accent);
-  margin-bottom: 24px;
-}
-.slide--chapter.has-image .chapter-image {
-  width: 100%;
-  height: 100%;
-  max-height: 760px;
-  object-fit: cover;
-}
-
-/* ─────────────────────────────────────────────
-   LAYOUT: FOCUS — a statement beside a thick bar in each accent
-   ───────────────────────────────────────────── */
-.slide--focus .slide-body {
-  justify-content: center;
-  align-items: flex-start;
-}
-.focus-eyebrow {
-  font-family: var(--font-body);
-  font-size: var(--fs-eyebrow);
-  font-weight: 700;
-  letter-spacing: 0.16em;
-  text-transform: uppercase;
-  color: var(--accent);
-  margin: 0 0 48px 96px;
-}
-.focus-content {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  padding-left: 96px;
-  box-sizing: border-box;
-}
-/* The bars stand beside the statement only, not beside code or a list below it. */
-.focus-content > :is(h1, h2, h3, p, blockquote):first-child { position: relative; }
-.focus-content > :is(h1, h2, h3, p, blockquote):first-child::before {
-  content: '';
-  position: absolute;
-  left: -96px;
-  top: 0.08em;
-  bottom: 0.08em;
-  width: 50px;
-  background:
-    linear-gradient(var(--accent), var(--accent)) 0 0 / 18px 100% no-repeat,
-    linear-gradient(var(--accent-2), var(--accent-2)) 32px 0 / 18px 100% no-repeat;
-}
-.focus-statement,
-.slide--focus .focus-content h1,
-.slide--focus .focus-content p {
-  font-family: var(--font-display);
-  font-size: var(--fs-focus);
-  font-weight: 700;
-  line-height: 1.08;
-  letter-spacing: -0.025em;
-  color: var(--ink);
-  max-width: 1450px;
-  margin: 0;
-  text-wrap: balance;
-}
-.focus-attribution {
-  font-family: var(--font-body);
-  font-size: var(--fs-small);
-  font-weight: 700;
-  letter-spacing: 0.12em;
-  text-transform: uppercase;
-  color: var(--muted);
-  margin: 56px 0 0 96px;
-}
-
-/* ─────────────────────────────────────────────
-   LAYOUT: IMAGE + TEXT
-   ───────────────────────────────────────────── */
-.image-pane {
-  flex: 1.15;
-  min-width: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: var(--tint-1);
-  overflow: hidden;
-  position: relative;
-}
-.image-placeholder {
-  width: 100%;
-  height: 100%;
-  background: repeating-linear-gradient(135deg, var(--tint-1) 0 22px, var(--tint-2) 22px 44px);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.image-placeholder span {
-  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
-  font-size: 22px;
-  color: var(--muted);
-  letter-spacing: 0.08em;
-  text-transform: uppercase;
-  background: var(--bg);
-  padding: 14px 20px;
-  border: 1px solid var(--rule);
-}
-.text-pane .title { font-size: calc(var(--fs-h) * 1.05); }
-.text-pane .body-text + .body-text { margin-top: 8px; }
-.text-pane .eyebrow { margin-bottom: 12px; }
-
-/* ─────────────────────────────────────────────
-   LAYOUT: SPLIT — a dialogue: two colour fields side by side, the heading
-   above the seam, each column's first heading in its side's accent
-   ───────────────────────────────────────────── */
-.slide--split .split-columns { gap: 0; }
-.slide--split .split-left,
-.slide--split .split-right {
-  padding: 48px 56px;
-  justify-content: safe center;
-}
-.slide--split .split-left  { background: var(--tint-1); box-shadow: inset 0 6px 0 var(--accent); }
-.slide--split .split-right { background: var(--tint-2); box-shadow: inset 0 6px 0 var(--accent-2); }
-.slide--split .split-left  > :is(h1, h2, h3):first-child { color: var(--accent); }
-.slide--split .split-right > :is(h1, h2, h3):first-child { color: var(--accent-2); }
-.slide--split :is(.split-left, .split-right) > :last-child { margin-bottom: 0; }
-/* In a field, code needs no box of its own: the field is its surface. */
-.slide--split .code-block {
-  background: none;
-  border: 0;
-  padding: 0;
-}
-
-/* ─────────────────────────────────────────────
-   LISTS — markers take turns between the two accents
-   ───────────────────────────────────────────── */
-.slide-body ul li {
-  font-weight: 400;
-  line-height: 1.32;
-  padding-left: 48px;
-  position: relative;
-}
-.slide-body ul li::before {
-  content: '';
-  position: absolute;
-  left: 0;
-  top: 0.55em;
-  width: 24px;
-  height: 7px;
-  background: var(--accent);
-}
-.slide-body ol li {
-  counter-increment: slide-ol;
-  padding-left: 56px;
-  position: relative;
-}
-.slide-body ol li::before {
-  content: counter(slide-ol);
-  position: absolute;
-  left: 0;
-  top: -0.04em;
-  font-family: var(--font-display);
-  font-size: calc(var(--fs-body) * 1.15);
-  font-weight: 700;
-  color: var(--accent);
-  line-height: 1.3;
-}
-.slide-body ul > li:nth-child(even)::before { background: var(--accent-2); }
-.slide-body ol > li:nth-child(even)::before { color: var(--accent-2); }
-
-/* ─────────────────────────────────────────────
-   LAYOUT: FULL-BLEED IMAGE
-   ───────────────────────────────────────────── */
-.slide--full-bleed-image.has-overlay .slide-bg::after {
-  content: '';
-  position: absolute;
-  inset: 0;
-  background: rgba(0, 0, 0, 0.45);
-}
-.slide--full-bleed-image .overlay-title {
-  font-family: var(--font-display);
-  font-size: calc(var(--fs-h) * 1.15);
-  font-weight: 700;
-  line-height: 1.02;
-  letter-spacing: -0.025em;
-  color: #fff;
-  margin: 0;
-  max-width: 1300px;
-  text-wrap: balance;
-}
-
-/* ─────────────────────────────────────────────
-   GENERIC / CONTENT SLIDE
-   ───────────────────────────────────────────── */
-.slide-body h1 {
-  font-family: var(--font-display);
-  font-size: var(--fs-h);
-  font-weight: 700;
-  line-height: 1.02;
-  letter-spacing: -0.025em;
-  color: var(--ink);
-  margin: 0 0 var(--gap-title) 0;
-  max-width: 1500px;
-  text-wrap: balance;
-}
-.slide-body h2 {
-  font-family: var(--font-display);
-  font-size: var(--fs-sub);
-  font-weight: 700;
-  line-height: 1.12;
-  letter-spacing: -0.02em;
-  color: var(--accent-2);
-  margin: 0 0 var(--gap-item) 0;
-}
-.slide-body p {
-  font-family: var(--font-body);
-  font-size: var(--fs-body);
-  font-weight: 400;
-  line-height: 1.5;
-  color: var(--ink-soft);
-  margin: 0 0 var(--gap-item) 0;
-  text-wrap: pretty;
-}
-.slide-body > p { max-width: 1500px; }
-
-/* ─────────────────────────────────────────────
-   CALLOUTS — a tinted field with its title as a tab: tips (and notes) in
-   the first accent, warnings (and cautions) in the second
-   ───────────────────────────────────────────── */
-.slide-body .callout {
-  --tab: var(--accent);
-  --tab-ink: var(--on-accent);
-  background: var(--tint-1);
-  border-left: 0;
-  border-top: 6px solid var(--tab);
-  padding: 0 36px 28px;
-  margin: 44px 0 0;
-  max-width: 1300px;
-}
-.slide-body :is(.callout-warning, .callout-caution, .callout-definition) {
-  --tab: var(--accent-2);
-  --tab-ink: var(--bg);
-  background: var(--tint-2);
-}
-/* Lecture blocks: theorems in the first voice, definitions in the second (above) */
-.slide-body .callout:is(.callout-theorem, .callout-lemma, .callout-corollary, .callout-definition) .callout-title { color: var(--tab-ink); }
-.slide-body .callout .callout-title {
-  display: inline-block;
-  background: var(--tab);
-  color: var(--tab-ink);
-  font-weight: 700;
-  letter-spacing: 0.14em;
-  padding: 6px 18px 8px;
-  margin: 0 0 20px;
-}
-.slide-body .callout p { padding-left: 0; color: var(--ink); font-size: var(--fs-body); }
-
-/* ─────────────────────────────────────────────
-   CODE BLOCK — a tinted surface with a rule of the first accent on top
-   ───────────────────────────────────────────── */
-.code-block {
-  --code-bg: var(--surface);
-  --code-radius: 0;
-  --code-size: 28px;
-  background: var(--code-bg);
-  border-radius: 0;
-  border-top: 6px solid var(--accent);
-  padding: 40px 48px;
-  margin: 0;
-  overflow: hidden;
-  font-size: var(--code-size);
-  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
-  line-height: 1.6;
-  color: var(--ink);
-}
-.code-block code {
-  font-family: inherit;
-  font-size: inherit;
-  background: none;
-  padding: 0;
-}
-
-/* ─────────────────────────────────────────────
-   AUDIENCE QUESTIONS — bars take turns between the two accents
-   ───────────────────────────────────────────── */
-.slide .poll-track, .slide .poll-fill, .slide .scale-track, .slide .scale-fill { border-radius: 0; }
-.slide .poll-track, .slide .scale-track { background: var(--tint-1); }
-.slide .poll-row:nth-child(even) .poll-track { background: var(--tint-2); }
-.slide .poll-row:nth-child(even) .poll-fill,
-.slide .scale-column:nth-child(even) .scale-fill { background: var(--accent-2); }
-.slide .question-cards li { border-radius: 0; background: var(--tint-1); }
-.slide .question-cards li:nth-child(even) { background: var(--tint-2); border-left-color: var(--accent-2); }
-.slide .question-cards li:first-child { border-left-color: var(--accent); }
-.slide .poll-join { border-radius: 0; border: 3px solid var(--accent); }
-
-/* ─────────────────────────────────────────────
-   MATH (KaTeX)
-   ───────────────────────────────────────────── */
-.slide .katex-display {
-  font-size: var(--fs-sub);
-  margin: 48px 0;
-  overflow-x: auto;
-  overflow-y: hidden;
-}

package/assets/extensions/themes/editorial/extension.toml

@@ -1,46 +0,0 @@
-schema = 1
-kind = "theme"
-id = "editorial"
-title = "Editorial"
-description = "A magazine spread: Newsreader headlines, Lora text, drop caps, pull quotes and Roman chapter numerals."
-# The palette this theme uses unless the deck sets one; colours come only from palettes.
-palette = "terra"
-fonts = [
-  "https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400..800;1,6..72,400..800&family=Lora:ital,wght@0,400;0,600;1,400;1,600&display=swap",
-]
-
-[files]
-styles = "styles.css"
-
-# Type, spacing and fonts used by styles.css; colours come from the palette.
-# Deck settings (params) override these.
-[tokens]
-
-# Type scale (px) — projection-appropriate at 1920×1080
-"--fs-display" = "148px"
-"--fs-title" = "112px"
-"--fs-focus" = "80px"
-"--fs-h" = "68px"
-"--fs-sub" = "40px"
-"--fs-body" = "32px"
-"--fs-small" = "24px"
-"--fs-eyebrow" = "22px"
-
-# Spacing
-"--pad-x" = "128px"
-"--pad-y" = "72px"
-"--gap-title" = "48px"
-"--gap-item" = "24px"
-
-# Type families
-"--font-display" = "\"Newsreader\", Georgia, \"Times New Roman\", serif"
-"--font-body" = "\"Lora\", Georgia, \"Times New Roman\", serif"
-
-# Settings authors can change under `params:` in the deck; each points at a token above.
-[params.fontDisplay]
-token = "--font-display"
-title = "Display font"
-
-[params.fontBody]
-token = "--font-body"
-title = "Body font"