Перейти до вмісту

Математика й код

Формули між знаками долара верстаються, блоки коду підсвічуються, в HTML-сторінці, зображеннях і PDF.

Математика й код з’явилися у v0.2.0.

Математика

$…$ — рядкова формула, $$…$$ — виносна:

The famous one is $E=mc^2$, and this is a display formula:

$$
\int_0^\infty e^{-x^2}\,dx = \frac{\sqrt{\pi}}{2}
$$
  • Правила роздільників — це правила Marp Core, прочитані з marp-core 4.4.0: $, за яким іде пробіл, не відкриває формулу, а за яким іде цифра, не закриває її, тож ціни на кшталт $5 and $10 залишаються текстом.
  • go-tex/math верстає кожну формулу в рядковий SVG розміром в em, тож вона слідує розміру тексту й стоїть на його базовій лінії. Той самий SVG використовується в HTML-сторінці, зображеннях і PDF.
  • Формула, яка не розбирається, залишається видимою як написано; помилка зберігається в її title.

Код

Блоки коду розфарбовує go-rouge, що пише імена класів highlight.js — ті, які стилізують теми Marp:

```go
fmt.Println("hello")
```

Мова, якої go-rouge не знає, записується звичайним текстом, як це робить Marp Core.

Номери рядків

У v0.8.0 блок може нумерувати свої рядки. У Marp Core номерів рядків немає, і він ігнорує все, що йде після мови в огорожі, тож параметри там записуються у фігурних дужках, і презентація, що їх використовує, рендериться в Marp так, як без них:

```go {lineNumbers}
func main() {
	fmt.Println("hello")
}
```

```go {lineNumbers=10}
// starts at 10
```
ЗаписЗначення
{lineNumbers}нумерувати з 1 ({lines:true} Slidev і {.numberLines} Pandoc теж читаються)
{lineNumbers=10}нумерувати з 10 (також startLine=10, startFrom="10" Pandoc)
{lineNumbers=false}без номерів, що б не казав слайд

Для кожного блока слайда й наступних слайдів задайте директиву: <!-- lineNumbers: true --> (_lineNumbers для одного слайда). Kind може задати її один раз для родини слайдів:

kinds:
  listing: {lineNumbers: true}

Кожен номер починає свій рядок усередині блока коду теми, відокремлений рискою. Він лишається на базовій лінії свого рядка, навіть коли рядок вищий, наприклад через виноску чи емодзі. Номери приглушені кольором, змішаним з кольору коду та його фону, з контрастом 4,5:1 або більше в темах default, gaia та uncover, світлих і темних. Вони не виділяються на сторінці й не читаються екранними читачами. У PDF вони малюються, але не входять до тексту, тож екстрактор тексту читає лише код. У файлі PowerPoint чи OpenDocument це редагований текст на початку кожного рядка. Презентація, що не використовує цю опцію, рендериться як і раніше, байт у байт. Підсвічування вибраних рядків поки не підтримується.

Виноски в коді

У v0.8.0 рядок коду може закінчуватися нумерованим диском, що посилається на примітку під блоком. Синтаксис — Quarto, він же форма коментарів Asciidoctor. Маркер — це коментар мовою самого коду, тож код лишається чинним, а примітки — це впорядкований список одразу після блока:

```go
func main() { // <1>
	x := load() // <2>
	fmt.Println(x)
}
```

1. The entry point.
2. Reads the input.
ЗаписЗначення
// <1>, # <1>, -- <1>, ; <1>, % <1>, ' <1>рядковий коментар, що містить лише маркер: обидва замінюються диском
<!-- <1> -->, /* <1> */те саме, для мов з обгорнутими коментарями
// <1> <2>два диски в одному рядку
x = 1 # count <1>текст коментаря лишається, а диск іде за ним

Маркери стають дисками лише тоді, коли список одразу після блока починається з 1 і має елемент для кожного номера. Інакше блок лишається як написано. Диски — це кільця кольору коду, в темах default, gaia та uncover, світлих чи темних. Елементи списку нумеруються тими самими дисками.

Диски не виділяються. Копіювання коду зі сторінки дає код без маркерів. У PDF вони є векторами, що не входять до тексту, а у файлі PowerPoint чи OpenDocument — редагованими фігурами. Виноски поєднуються з номерами рядків. У Marp Core виносок немає (marp-core 4.4.0), тож у Marp коментарі й нумерований список показуються як написано. Презентація, що їх не використовує, рендериться як і раніше, байт у байт.

У v0.9.0 диск і його примітка знаходять одне одного в HTML-сторінці. Наведення на диск або перехід до нього через Tab підсвічує його примітку, а примітка робить те саме для свого диска. Це те, що робить code-annotations: hover у Quarto, але тут це робить самостійно таблиця стилів, без скрипта. Тому це працює однаково в ізольованому перегляді Playground і в перегляді VS Code, які обидва обмежують скрипти. Кожен диск описується своєю приміткою, тож екранний читач читає примітку, коли доходить до диска. Підсвічування плавно з’являється лише тоді, коли читач не просив зменшити анімацію. Зображення, PDF, файли PowerPoint та OpenDocument не змінюються, байт у байт.

Шрифти

Lato Regular, Bold, Black і курсиви та Roboto Mono Regular, Bold і курсиви вбудовані, тож заголовки gaia мають свою вагу, а курсивний текст рендериться курсивом.

Created on by tannevaled

Modified on by tannevaled