Readme Deck.JS Builder
This projects provide an easy working with the awesome Deck.js using Ruby, HAML
and Compass. Starting guard and start editing your presentation. Guard will
rebuild the html and stylesheets (scss/sass) when changed. I used HAML as
templating, because I think it’s awesome and very clean. Textile/MD are not
flexible for me, e.g. using custom ids, tags and ruby functions.
git clone https://github.com/zealot128/DeckJS-Builder cd DeckJS-Builder bundle guard
Then you can start editing:
- slides/*.haml → the slides chapters
- views/*.haml → the layout, title and toc slide
- sass/screen.scss → The Stylings using Scss/Sass
- meta.yml → Title and author
- css/fonts/* → some free-to-use webfonts by fontsquirrel
Guard will automatically rebuild index.html and stylesheet when changed!
Just have a div#toc somewhere, and give your section.slide the additional class:
%section.slide.toc#custom-anchor %h1 Chapter Headline %section.slide.toc#another-custom-anchor %h2 Slide Headline
Only slides that have the .toc class and a h1 or h2 will show up inside the toc.
IMPORTANT: Until now, this includes my work-in-progress thesis’ defense
presentation, because I’am to lazy to put that one in a seperate repos :) Later
it will be extracted to have a clean empty presentation template
- pygmentize has to be installed to use that.
- Debian/Ubuntu: apt-get install python-pygments
- pygments rocks. It has the most lexers and a lot of output formats
- Highlighting gets cached at .syntax-cache/ to make rebuilding faster
- Exporting stylesheet from pygments
@import "syntax/colorful"; /* like this */
Generating new styles:
pygmentize -S colorful -f html -a .highlight >> sass/syntax/colorful.scss
- List available styles
pygmentize -L styles
= pygmentize "ruby" do :preserve def hello_world puts "hello world" end = image_tag_with_caption "imgs/bla.gif", "Source: flickr.com"