Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tillahoffmann/slides
Create stunning presentations using markdown powered by reveal.js.
https://github.com/tillahoffmann/slides
markdown reveal-js
Last synced: 27 days ago
JSON representation
Create stunning presentations using markdown powered by reveal.js.
- Host: GitHub
- URL: https://github.com/tillahoffmann/slides
- Owner: tillahoffmann
- License: bsd-3-clause
- Created: 2023-01-26T16:01:57.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2023-06-04T03:14:38.000Z (over 1 year ago)
- Last Synced: 2024-09-30T20:08:43.085Z (about 1 month ago)
- Topics: markdown, reveal-js
- Language: Python
- Homepage:
- Size: 62.5 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
---
css: static/css/harvard.css
title: Markdown Slides Demo
---# 📽️ slides
Create stunning presentations using [markdown](https://www.markdownguide.org) powered by [reveal.js](https://revealjs.com).
[![Markdown Slides](https://github.com/tillahoffmann/slides/actions/workflows/main.yaml/badge.svg)](https://github.com/tillahoffmann/slides/actions/workflows/main.yaml)
[![PyPI](https://img.shields.io/pypi/v/markdown-slides)](https://pypi.org/project/markdown-slides/)---
This README is a slide deck. Run `pip install markdown-slides` from the command line to install the package. Then run `slides --demo` to launch a presentation server and view the deck.
---
![](figure.png)
Here is a simple figure floated to the right.
Note:
Speaker notes start with `Note:` on each slide and can be accessed by hitting the `S` code. They support `$m\times a^{th}$`.
---
You can also [include equations](https://revealjs.com/math/#markdown) wrapped in backticks.
`\[\begin{aligned}
F(x)&=\int dx\, \cos(x)\\
&=\sin(x) + C.
\end{aligned}\]`---
Create columns using a `div` with `class="col"`. There must be an empty line after the `div` for embedded markdown to render.
```markdown
Content. Use `col-4` or
`col-6` to create 40% and
60% width columns,
respectively. Make sure the
numbers add up to 10 or
subsequent content may float.
```---
Code can be included with [code fences](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks).
```python
def add(a: int, b: int) -> int:
"""
Add two integers.
"""
return a + b
```---
Reveal.js supports special syntax to set arbitrary HTML attributes on [slides](https://revealjs.com/markdown/#slide-attributes), such as this background gradient.
```html
```
This also works for [elements](https://revealjs.com/markdown/#element-attributes):
- green bullet point```markdown
- green bullet point
```---
Want a full-screen image? Use the [`data-background-image`](https://revealjs.com/backgrounds/#image-backgrounds) attribute, as illustrated on the next slide with a penguin. [unsplash.com](https://unsplash.com) has a great collection of free images.
```html
```
---
---
For labeled slides, we can link back to them. E.g., the [next one](#next-slide).
---
This is a slide labeled with the id `next-slide`.
```markdown
```
Also note the vertical slide below. 👇
^^^
[Vertical slides](https://revealjs.com/vertical-slides/) can be used to logically group content. They are created using the `^^^` separator between slides.
---
> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
>
> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
>
> --- Cicero---
| Symbol | Description |
| ---------- | -------------------------------------------------------- |
| `$n$` | Number of samples |
| `$x_{ij}$` | `$j^\text{th}$` covariate for the `$i^\text{th}$` sample |
| `$y_i$` | target for the `$i^\text{th}$` sample |---
- important
- bulletsand
1. numbered
2. items---
[Jekyll-style frontmatter](https://jekyllrb.com/docs/front-matter/) can be used to configure the presentation. See [`slides/frontmatter.schema.yaml`](slides/frontmatter.schema.yaml) for details.
---
Visit the [reveal.js website](https://revealjs.com/markdown/) for further information.