The Vinyl Team
github.com/AlexisBRENON/Vinyl
This is a RevealJS based presentation.
We will present you some features, but feel free to look for the initial project to see all possibilities
Being part of Vinyl, presentation are a little bit pre-configured to work out of the box. Let's see the default behaviour:
Come on, let's explore features...
inverted
slides
You are here in a nested/vertical slide.
Look at the slide numbering in the bottom-right corner.
The first slide of this slides column has the inverted
class. Look
how it has been stylished to denote a new part of the presentation.
The inverted
class can be applied to any slide, not only nested
slides.
Wow! How incredible are views. This is the default one.
Let's press ESC to enter the slide overwiew. So convenient during questions time.
Hold down ALT and click to zoom in and out. Not so useful, but impressing, isn't it?
Finally press S to see the speaker view. Very useful, and very very impressive for a browser based presentation!
Want to know more ? Continue.
Fragments are pieces of slide which appear one at a time.
There's different types of fragments, like:
in fade-in fade-out out
grow / shrink / strike
highlight-primary highlight-success highlight-warning highlight-danger
current-visible highlight-current-primary highlight-current-success highlight-current-warning highlight-current-danger
Based on Animate.css framework.
Input Attention seeker OutputYou can of course trash all the hard and beautiful work made by your lovely developer
and create a full new CSS theme. Look at the
_sass/reveal/theme/blue.scss
file to
get some inspiration.
Of course if you do a very beautiful theme, feel free to share it, with Vinyl community, or even better, with RevealJS community.
An image worth a thousand words.
Instead of inserting a small image just near your text, you can set it as slide background!
Set the data-background
attribute to point to an image. Thats it!
It even works with, GIFs, videos, etc...
But colors are strong too!
Sometimes it's hard to find a picture. Colors have many meanings use them!
Did you notice that it's a gradient instead of a plain color?
You can also change the background transition style. Here it's a zoom.
As said, all plugins are activated in Vinyl.
You have to use a server (like Jekyll, or NodeJS) to use them
#!/usr/bin/env python3
print("What to say? It's so useful.")
print("You can even edit this code block, if necessary!")
You can easily paste your LaTeX equation and MathJax do the job.
When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
An obvious feature for a scientific presentation tool!
Last but not least, you can use Vinyl features such as the columns framework.
That what allow us to do this three parts slide. Two half on the top. And one full-width part on the bottom.
Impressive, isn't it ?