portfolios_lea-jean/themes/academia-hugo/exampleSite/content/slides/example/index.md

167 lines
3.1 KiB
Markdown
Raw Normal View History

2022-02-02 16:09:48 +01:00
---
title: Slides
summary: An introduction to using academia's Slides feature.
authors: []
tags: []
categories: []
date: "2019-02-05T00:00:00Z"
slides:
# Choose a theme from https://github.com/hakimel/reveal.js#theming
theme: black
# Choose a code highlighting style (if highlighting enabled in `params.toml`)
# Light style: github. Dark style: dracula (default).
highlight_style: dracula
---
# Welcome to Slides
[academia](https://sourcethemes.com/academic/)
---
## Features
- Efficiently write slides in Markdown
- 3-in-1: Create, Present, and Publish your slides
- Supports speaker notes
- Mobile friendly slides
---
## Controls
- Next: `Right Arrow` or `Space`
- Previous: `Left Arrow`
- Start: `Home`
- Finish: `End`
- Overview: `Esc`
- Speaker notes: `S`
- Fullscreen: `F`
- Zoom: `Alt + Click`
- [PDF Export](https://github.com/hakimel/reveal.js#pdf-export): `E`
---
## Code Highlighting
Inline code: `variable`
Code block:
```python
porridge = "blueberry"
if porridge == "blueberry":
print("Eating...")
```
---
## Math
In-line math: $x + y = z$
Block math:
$$
f\left( x \right) = \;\frac{{2\left( {x + 4} \right)\left( {x - 4} \right)}}{{\left( {x + 4} \right)\left( {x + 1} \right)}}
$$
---
## Fragments
Make content appear incrementally
```
{{%/* fragment */%}} One {{%/* /fragment */%}}
{{%/* fragment */%}} **Two** {{%/* /fragment */%}}
{{%/* fragment */%}} Three {{%/* /fragment */%}}
```
Press `Space` to play!
{{% fragment %}} One {{% /fragment %}}
{{% fragment %}} **Two** {{% /fragment %}}
{{% fragment %}} Three {{% /fragment %}}
---
A fragment can accept two optional parameters:
- `class`: use a custom style (requires definition in custom CSS)
- `weight`: sets the order in which a fragment appears
---
## Speaker Notes
Add speaker notes to your presentation
```markdown
{{%/* speaker_note */%}}
- Only the speaker can read these notes
- Press `S` key to view
{{%/* /speaker_note */%}}
```
Press the `S` key to view the speaker notes!
{{< speaker_note >}}
- Only the speaker can read these notes
- Press `S` key to view
{{< /speaker_note >}}
---
## Themes
- black: Black background, white text, blue links (default)
- white: White background, black text, blue links
- league: Gray background, white text, blue links
- beige: Beige background, dark text, brown links
- sky: Blue background, thin dark text, blue links
---
- night: Black background, thick white text, orange links
- serif: Cappuccino background, gray text, brown links
- simple: White background, black text, blue links
- solarized: Cream-colored background, dark green text, blue links
---
{{< slide background-image="/img/boards.jpg" >}}
## Custom Slide
Customize the slide style and background
```markdown
{{</* slide background-image="/img/boards.jpg" */>}}
{{</* slide background-color="#0000FF" */>}}
{{</* slide class="my-style" */>}}
```
---
## Custom CSS Example
Let's make headers navy colored.
Create `assets/css/reveal_custom.css` with:
```css
.reveal section h1,
.reveal section h2,
.reveal section h3 {
color: navy;
}
```
---
# Questions?
[Ask](https://discourse.gohugo.io)
[Documentation](https://sourcethemes.com/academic/docs/)