Hero-unit

#+begin_o_blog_hero_unit
#+HTML: <h1>Heading</h1>

 tagline

#+BEGIN_HTML
    <a class="btn btn-primary btn-large">
      Learn more
    </a>
#+END_HTML
#+end_o_blog_hero_unit

Heading

tagline

Learn more

Page header

#+begin_o_blog_page_header
#+HTML: <h1>Page header</h1>
Some text
#+end_o_blog_page_header

Using labels

Label and annotate text using a label:TYPE link prefix where TYPE is one of default, success, warning, important, info or reverse. The URL part of the link is used as the label text.

[[ob-label:default][Default]]
[[ob-label:success][Success]]
[[ob-label:warning][Warning]]
[[ob-label:important][Important]]
[[ob-label:info][Info]]
[[ob-label:inverse][Inverse]]
  • Default
  • Success
  • Warning
  • Important
  • Info
  • Inverse

Using badges

Indicators and unread counts as for labels. Use the badge:TYPE link prefix.

[[ob-badge:default][Default]]
[[ob-badge:success][Success]]
[[ob-badge:warning][Warning]]
[[ob-badge:important][Important]]
[[ob-badge:info][Info]]
[[ob-badge:inverse][Inverse]]
  • Default
  • Success
  • Warning
  • Important
  • Info
  • Inverse

Using progress bars

For loading, redirecting, or action status. Use a progress:TYPE link where TYPE is one of info, success, warning or danger. Additional classes (striped or active) can be added using comma. The URL is the progress percent.

[[ob-progress:info][25]]
[[ob-progress:success,striped][50]]
[[ob-progress:warning,striped,active][75]]
[[ob-progress:danger][100]]

Well

Use the well as a simple effect on an element to give it an inset effect.

 #+begin_o_blog_well
, Look, I'm in a well!
 #+end_o_blog_well

Look, I'm in a well!

blog comments powered by Disqus