Skip to content

Commit

Permalink
Add starter slides.
Browse files Browse the repository at this point in the history
Add a README and copy the workflow to build on GitHub actions.
  • Loading branch information
samcunliffe committed Dec 20, 2023
0 parents commit 4b53e30
Show file tree
Hide file tree
Showing 5 changed files with 198 additions and 0 deletions.
47 changes: 47 additions & 0 deletions .github/workflows/marp.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
name: marp-to-pages
concurrency: marp-to-pages

on:
push:
branches: [ main ]
pull_request:
jobs:
build:
runs-on: ubuntu-latest
permissions:
contents: write
pull-requests: write
steps:

- name: Checkout code
uses: actions/checkout@v3

- name: Ensure build dir exists
run: mkdir -p build

- name: Copy images directory
run: cp -R assets build/assets

- name: Marp Build
uses: docker://marpteam/marp-cli:v3.0.2
with:
args: slides.md --html -o build/index.html
env:
MARP_USER: root:root

- name: Deploy preview
if: ${{ github.event_name == 'pull_request' }}
uses: rossjrw/pr-preview-action@v1
with:
source-dir: ./build/
preview-branch: gh-pages
umbrella-dir: pr-preview

- name: Deploy production
if: ${{ github.event_name == 'push' }}
uses: JamesIves/github-pages-deploy-action@v4
with:
branch: gh-pages
folder: ./build/
clean-exclude: pr-preview/

3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
*.html
.DS_Store
slides.pdf
21 changes: 21 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# UCL talk template with [marp](https://marp.app/)

This is my very minimalist template for UCL talks using [marp](https://marp.app/)/[marpit](https://marpit.marp.app/). Anyone in UCL is welcome to use the template! If you're not from UCL then please remove the UCL branding.

## How to use this template

1. Follow [the instructions for creating a new repository from a template](https://docs.github.com/en/repositories/creating-and-managing-repositories/creating-a-repository-from-a-template) (**tl; dr** click on "Use this template").

2. Edit [slides.md](./slides.md) to build your talk.
- Follow the excellent [marpit](https://marpit.marp.app/image-syntax) docs for inserting images and backgrounds and split screens etc. Put images in the [assets](./assets) folder.
- I recommend the [marp-vscode extension](https://marketplace.visualstudio.com/items?itemName=marp-team.marp-vscode) if you use Visual Studio Code.

3. If you push to GitHub there is a [workflow](.github/workflows/marp.yml) to automatically build the talk with [marp-cli](https://github.com/marp-team/marp-cli) and publish the result to a `gh-pages` branch.
- Go to the repo settings and enable GitHub pages ([follow from step 5 of these instructions](https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-github-pages-site)), you should then see your slides at `https://yourusername.github.io/name-of-your-talk-repo`.

If you're not ready or don't want to publish your talk then don't do the final steps.

## Further reading

* [UCL branding instructions](https://www.ucl.ac.uk/staff/external-engagement/brand-and-visual-identity).
* [UCL banner usage rules](https://www.ucl.ac.uk/brand/brand-essentials/ucl-banner).
Binary file added assets/ucl-banner.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
127 changes: 127 additions & 0 deletions slides.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,127 @@
---
marp: true
theme: default
style: |
.ccolumns {
display: grid;
grid-template-columns: 50% auto;
gap: 1rem;
}
---

![bg fit](assets/ucl-banner.png)

<br/><br/><br/><!-- aesthetic vspace so the title isn't too close to the UCL banner -->

# Title of the talk

First Author¹, Second Author²

¹Centre for Advanced Research Computing, UCL.
¹Department of Collaborators, UCL.

Conference, Location. 202Y-MM-DD.

---

<!--
paginate: true
footer: F. Author, 202Y-MM-DD.
-->

# A basic slide with bullets

- First point.
- Second point.

---

# Slide with bullets that appear

* I appear...
* Then I appear...
* Then **I** appear 🎉!

---

# Centered on a slide

<center>

Example of something centred.

</center>

---

# Split bullet slide

<br/>
<div class="ccolumns">
<div>

- Bullet to the left

</div>
<div>

- Bullet to the right

</div>

---

# Code

```py

def i_prefer_python() -> None
print("Obiously I use type hints")
return

```

```c++

int butWillWriteCppIfNeeded()
{
return 1337;
}

```

---

# Emoji are cool

- ❤️🎉✅

---

# Maths

- An example of inline maths $e^{i\pi} = -1$
- An example of display format maths:

$$
\widehat{f}(\xi) = \int_{-\infty}^{\infty} f(x)\ e^{-i 2\pi \xi x}\,dx.
$$


---

# Conclusions

- One or two clear takehome points.
- Don't overload your audience.

---

# Appendix

---

# Add appendix slides if needed

- Delete all of this if you don't need it.
- (Obviously)

0 comments on commit 4b53e30

Please sign in to comment.