Markdown syntax I used in my YouTube video

slidev youtube tutorial.md

theme	aspectRatio	title
default	16/9	Slide 1

Slide 1

Content of my slide

---

Side 2

Content of the second slide

a = 3

console.log("hello")

function add(
    a: Ref<number> | number,
    b: Ref<number> | number
) {
    return computed(() => unref(a) + unref(b))
}

<style> h1 { color: white } </style>

---

Slide 3

Third slide

asterisks

asterisks

asterisks and underscores

Scratch this.

---

Slide 4

1. First ordered list item
2. Another item
   • Unordered sub-list.

• Unordered list can use asterisks

• Or minuses

• Or pluses

I'm an inline-style link

You can use numbers for reference-style link definitions ¹

---

Slide Image

---

Slide 5

Tables	Are	Cool
col 3 is	right-aligned	$1600
col 2 is	centered	$12
zebra stripes	are neat	$1

Block quote

---

Icons

---

layout: two-cols

Left

This shows on the left side

::right::

Right

This shows on the right

---

LaTeX

In line $\sqrt{3x-1}+(1+x)^2$ and $a=2$

$$ \begin{array}{c}

\nabla \times \vec{\mathbf{B}} -, \frac1c, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \

\nabla \times \vec{\mathbf{E}}, +, \frac1c, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \

\nabla \cdot \vec{\mathbf{B}} & = 0

\end{array} $$

---

src: ./flowchart.md

Flowchart

graph TD
B[Text] --> C{{Decision}}
C -->|One| D[Result 1]
C -->|Two| E[Result 2]
C -->|Yes| F[Result3]

---

Animations

Subtitle

Text to animate

Hello

Hello after

• Item 1
• Item 2
• Item 3
• Item 4

1

2

3

<style> .slidev-vclick-target { transition: all 2000ms ease 10ms; } .slidev-vclick-hidden { transform: scale(0); } </style>

---

preload: false

Motion

Slidev

---

preload: false

Animate an image

<style> .my-fade { transition-duration: 3000ms; } </style>

Footnotes

1. https://www.google.com ↩