slides.md

marp	size	paginate	theme	footer	header	headingDivider
true	14580	true	Naereen2	Titre footer en bas à gauche, © 2021 <a class="right" href="https://perso.crans.org/besson/">Lilian Besson </a>, (<a class="right" href="https://GitHub.com/Naereen">GitHub/@Naereen</a>), <a href="https://lbesson.mit-license.org/">sous licence MIT</a>	<img height="30em" src="logo.png"> Titre header en haut à gauche	2

Démo de Marp slides !

Ces slides peuvent être rédigés dans VSCode et visualisés avec Marp.

Cf Marp.app

On peut les exporter comme une présentation HTML/js interactive, depuis VSCode, et ensuite convertir cette présentation comme un PDF.

© This document is © Lilian Besson, 2021 see https://github.com/Naereen/slides/

Paragraphs 🚀

On my theme, paragraphs have justified text by default!

This is random paragraph: Et commodo culpa adipisicing culpa irure officia excepteur. Irure exercitation veniam laboris quis elit tempor amet pariatur aute est dolore. Excepteur cillum sint in ea laborum in ex duis laboris nostrud minim.

This is random paragraph: Et commodo culpa adipisicing culpa irure officia excepteur. Irure exercitation veniam laboris quis elit tempor amet pariatur aute est dolore. Excepteur cillum sint in ea laborum in ex duis laboris nostrud minim.

This is random paragraph: Et commodo culpa adipisicing culpa irure officia excepteur. Irure exercitation veniam laboris quis elit tempor amet pariatur aute est dolore. Excepteur cillum sint in ea laborum in ex duis laboris nostrud minim.

Paragraphs

1. This is random paragraph: Et commodo culpa adipisicing culpa irure officia excepteur. Irure exercitation veniam laboris quis elit tempor amet pariatur aute est dolore. Excepteur cillum sint in ea laborum in ex duis laboris nostrud minim.

2. This is random paragraph: Et commodo culpa adipisicing culpa irure officia excepteur. Irure exercitation veniam laboris quis elit tempor amet pariatur aute est dolore. Excepteur cillum sint in ea laborum in ex duis laboris nostrud minim.

3. This is random paragraph: Et commodo culpa adipisicing culpa irure officia excepteur. Irure exercitation veniam laboris quis elit tempor amet pariatur aute est dolore. Excepteur cillum sint in ea laborum in ex duis laboris nostrud minim.

Maths using $\LaTeX$ notations

Maths, with MathJax

Inline equations, as for instance the classic $\Delta = b^2-4ac$ and $x_{1,2} = \frac{-b\pm\sqrt{\Delta}}{2a}$, or display equations as this one: $$ J_\alpha(x) = \sum\limits_{m=0}^\infty \frac{(-1)^m}{m! , \Gamma(m + \alpha + 1)}{\left({\frac{x}{2}}\right)}^{2 m + \alpha} $$

More maths

$$ 4 \sum_{n=1}^{+\infty} \rho_n^2 \sin^2 nh = \frac{1}{2\pi} \int_{-\pi}^{\pi}\lvert f(x+h) - f(x-h)\rvert^2 dx. $$ $$ 4 \sum_{n=1}^{+\infty} \rho_n^2 \sin^2 nh = \frac{1}{2\pi} \int_{-\pi}^{\pi}\lvert f(x+h) - f(x-h)\rvert^2 dx. $$ $$ 4 \sum_{n=1}^{+\infty} \rho_n^2 \sin^2 nh = \frac{1}{2\pi} \int_{-\pi}^{\pi}\lvert f(x+h) - f(x-h)\rvert^2 dx. $$ $$ 4 \sum_{n=1}^{+\infty} \rho_n^2 \sin^2 nh = \frac{1}{2\pi} \int_{-\pi}^{\pi}\lvert f(x+h) - f(x-h)\rvert^2 dx. $$

See https://naereen.github.io/StrapDown.js/example3.html

Images

J'ai essayé de faire de ce slide un "titre" avec :

<!-- _class: titre -->

Using images

Image left aligned (default):

Image centered:

Image right aligned:

![width:250](logo.png)
![width:250](logo.png#left)
![width:250](logo.png#right)
![width:250](logo.png#center)

Change width/height of image

![width:100](logo.png)
![width:200](logo.png)
![width:300](logo.png)

Code listing

In OCaml, for instance:

let rec fact n = n ;;
type 'a Tree = Leaf | Node of ('a Tree, 'a, 'a Tree);;

Using this Markdown code:

```ocaml
let rec fact n = n ;;
type 'a Tree = Leaf | Node of ('a Tree, 'a, 'a Tree);;
```

Bullet list

• One
• Two
• Three

- One
- Two
- Three

Fragmented list

• One
• Two
• Three

Lists using * should appear one at a time, in the produced HTML or PDF.

* One
* Two
* Three

See marp-team/marpit#145

Hex color (White BG + Black text)

Demo of using

![bg](#fff)    <!-- white background: default -->
![](#000)      <!-- black text: default -->

to change font color and slide background. (Marp Markdown's syntax extension)

Named color (black BG + white text)

Demo of using

![bg](black)    <!-- black background: ugly -->
![](white)      <!-- white text: ugly -->

to change font color and slide background. (Marp Markdown's syntax extension)

RGB values (Orange BG + White text)

Demo of using

![bg](rgb(255,128,0))    <!-- orange background: ugly -->
![](rgb(255,255,255))    <!-- white text: ugly -->

to change font color and slide background. (Marp Markdown's syntax extension)

Slides split in two-columns?

See marp-team/marpit#137

• item
• item

Image on left side:

Image on right background side

TODO: DONE!

• Titles are NOT top aligned yet, I managed to obtain this on old Marp, I want it again! DONE
• fontify and my own handwriting font don't work yet!
• Test de ligature fi if si tl rst rest Naereen failed
• How to export slides to PDF? Use decktape or marp-cli
• TODO lines are not correctly converted?

Test of empty slide

I want this header to be top aligned!

Test of empty slide

I want this header to be top aligned!

Conclusion

👉 Take home message

• Pretty OK, but not perfect

Merci de votre attention 👍 !