shieldo / unveil-rs

Unveil Rs is a tool to create presentations from markdown inspired by reveal.js, mdbook and zola.

Unveil Rs

Unveil Rs is a tool to create presentations from markdown files. It is inspired by reveal.js , mdbook and zola.

What does it look like ?

See the live demo.

Installation

1. From crates.io

At the moment unveil is only available on crates.io.

To get started you will need to install rust and then type the following command in a terminal :

cargo install unveil-rs --version=0.1.0-aplha>

Note : the --version flag is required while unveil version is still in alpha.

2. From git

If you want the latest you can run :

cargo install --git https://github.com/oknozor/unveil-rs.git unveil-rs

Usage

Initialize

To initialize an empty project run :

unveil init mypresentation

This will create the following directory structure :

├── slides
│   └── landing.md
└── unveil.toml

Build and run

To build your project run :

cd mypresentation && unveil build

This command generate the following files :

├── public
│   ├── fontawesome
│   │   ├── css
│   │   │   └── fontawesome.css
│   │   └── webfonts
│   │       ├── (...)
│   ├── clipboard.js
│   ├── highlight.css
│   ├── highlight.js
│   ├── index.html
│   ├── livereload.js
│   ├── unveil.css
│   └── unveil.js
│   └── user_css.css
├── slides
│   └── landing.md
└── unveil.toml

Actually the build command is optional, you can directly run unveil serve inside your project root directory. This will build the static site and start serving it on localhost:7878.

From this point you can start editing your markdown slides. The site will reload as you edit it.

Add new slides

To add a slide run unveil new myslide inside your project root directory. it will create a new markdown file myslide.md in the slides/ directory and add a slide entry in the unveil.toml config file.

name = "mypresentation"
language = "EN"
gitignore = true
slides = ["landing.md", "myslide.md"]

Add style to your slides

Inspired by zola's frontmatter unveil slides can be styled with a style matter block. The Sass style matter is a style attached to the current slide embedded in a file at the beginning of the file enclosed by triple pluses (+++). If your slide does not have additional styling, the opening and closing +++ are optional.

Example :

+++
background-color: black;
color: white;  

h1 {
    color: red;
}
+++
# I am red 

I am white and my background is black

Custom CSS properties

Unveil use some custom CSS properties to help you design your slides.

For example you can add transition on slides using the --on-enter-animation CSS property on your slide's stylematter :

+++
--on-enter-animation: zoom-in
+++
# I will zoom in on enter

Available custom CSS properties

| name | allowed values | status |
| :--- | :--- | implemented | |--on-enter-animation | fade-in, zoom-in

If you want to see more custom properties and transitions in unveil, please let us know !

Hljs

Unveil use hljs to generate pretty code snippet. Rust code can be played thanks to the rust playground project.

Commands

name	description	args
init	new project	PROJECT_NAME default = unveil
build	build the project
clean	wipe the public directory
serve	serve the project, build it if needed
add	create a new slide	SLIDE_NAME required

Contributions

Unveil is at a very early stage of it's development and any help is welcome. If you want to participate read the contributing guidelines and pick an issue!

Getting Help

Need help ? You can contact us via our matrix channel or ask a question on the issue tracker.