Unveil Rs is a tool to create presentations from markdown files. It is inspired by reveal.js , mdbook and zola.
See the live demo.
- 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.
- From git
If you want the latest you can run :
cargo install --git https://github.com/oknozor/unveil-rs.git unveil-rs
To initialize an empty project run :
unveil init mypresentation
This will create the following directory structure :
├── slides
│ └── landing.md
└── unveil.toml
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.
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"]
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
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
| 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 !
Unveil use hljs to generate pretty code snippet. Rust code can be played thanks to the rust playground project.
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 |
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!
Need help ? You can contact us via our matrix channel or ask a question on the issue tracker.