MrOrz/spec.md

## spec.md

      
    Raw
  

              spec.md
            
          
    vebdew SPEC

Head elements

:title 
:description 
:author 
:email 
:stylesheet_link_tag 
:javascript_include_tag 

Head elements should be put on the top of the document.
When any of the body elements are reached, head element is closed. That is,  is emitted and the Reveal.js body structure is established.


Body Elements

All Reveal.js slides are  wrapped in the following structure:
  
    
  ... SECTION_TARGET : <sections> here ...

</div>
<!-- The navigational controls UI -->
<aside class="controls">
  <a class="left" href="#">&#x25C4;</a>
  <a class="right" href="#">&#x25BA;</a>
  <a class="up" href="#">&#x25B2;</a>
  <a class="down" href="#">&#x25BC;</a>
</aside>

<!-- Displays presentation progress, max value changes via JS to reflect # of slides -->
<div class="progress"><span></span></div>

  
The following defines keywords emits 
s in the SECTION_TARGET.
!SLIDE, !ENDSLIDE
Marks the starting and ending of a slide (
) block.
Current slide is closed and a new slide is created when a "!SLIDE" token is encountered. Thus the ending is not mandatory.
Classes can be appended to slide 
 tag, via CSS-Selector-like syntaxes, such as:
!SLIDE.chapter[data-title="html5"]
Emits
  
!STACK, !ENDSTACK

Marks the starting and ending of a stack (vertical slide stack). Rules are the same as !SLIDE and !ENDSLIDE.
Code spans & code blocks

Code spans are wrapped by ``. This emits a  block. Brackets (<, >) are escaped to < and > automatically. To output a '' charactor, escape it like '\'.

Two types of code blocks are supported here. The code blocks wrapped in three or more '`'s. This kind of code blocks emits 
...
. The second kind is wrapped in three or more '~'s. This kind of code blocks emits <script type="text/x-sample">...</script>, which makes uses of sample.js.
HTML elements

HTML tags are allowed in the syntax and is outputted as-is. Since we do not have any token that emits custom 
, one can write 
 in vebdew directly.
Headers

Headers has the syntax derived from kramdown. The following syntaxes are allowed:
H1 Header

H2 Header

...
H6 Header

H1 Header

H2 Header

Horizontal Rules

Three or more '-' in a row with a leading and trailing blank line emits a 
 tag.
Paragraphs

Lines with leading and trailing blank lines, if not matched by any of the rules above, are treated as a paragraph. (p element).
Attributes

CSS-Selector like decorators can be appended to any of the elements above. The syntax is like:
{:#ID.class[attr=value]}
This syntax is derived from Kramdown. Such examples are:
Introducing HTML

{:.inverted}
generating
  Introducing HTML

Another example is:
<input> tag has an attribute called type{:.attr[title="checkbox|radio|submit"]}
emits
<input> tag has an attribute called type