showcase.html

<h1>Prawn Markup Showcase</h1>

<h2>Text features</h2>
<div>
  <p>paragraphs are nicely separated from each other.</p>
  <p></p>
  <p>Margin is or will be customizable at some point.</p>
</div>
<p><br /></p>
<p>
  <strong>Strong</strong> or <em>emphasized</em> formatting as well as
  <a href="http://github.com/puzzle/prawn-markup">links</a> are supported.
</p>
<hr />
and horizontal lines!

<h2>Table features</h2>
<p>Also tables are nice:</p>
<div>
  <table>
    <tr>
      <th style="width: 1cm;">No</th>
      <th>Description</th>
      <th style="width: 25%;">State</th>
    </tr>
    <tr>
      <td>1</td>
      <td>Headers and custom widths are supported</td>
      <td>Done</td>
    </tr>
    <tr>
      <td>2</td>
      <td>
        <table>
          <tr>
            <td>subtables</td>
            <td>so</td>
          </tr>
          <tr>
            <td>very</td>
            <td>crazy</td>
          </tr>
        </table>
      </td>
      <td>Done</td>
    </tr>
    <tr>
      <td>3</td>
      <td>
        Even lists
        <ol>
          <li>one</li>
          <li>two</li>
        </ol>
      </td>
      <td>Check</td>
    </tr>
    <tr>
      <td>4</td>
      <td>
        and Images:
        <img
          src="https://github.com/puzzle/prawn-markup/blob/master/spec/fixtures/logo.png?raw=true"
          style="width: 50px;"
        />
      </td>
      <td>Yieha</td>
    </tr>
  </table>
  This table has text underneath
</div>

<h2>List features</h2>
<h3>Unordered</h3>
Here may be text, too
<ul>
  <li>
    Lorem ipsum doler sit amet. Lorem ipsum doler sit amet. Lorem ipsum doler
    sit amet. Lorem ipsum doler sit amet. Lorem ipsum doler sit amet. Lorem
    ipsum doler sit amet.
  </li>
  <li>anything</li>
</ul>
<h3>Ordered</h3>
<ol>
  <li>
    Lorem ipsum doler sit amet. Lorem ipsum doler sit amet. Lorem ipsum doler
    sit amet. Lorem ipsum doler sit amet. Lorem ipsum doler sit amet. Lorem
    ipsum doler sit amet.
  </li>
  <li>anything</li>
</ol>

<h2>Inputs</h2>
<p><input type="checkbox" checked="checked" /> Checkboxes</p>
<p>
  <input type="checkbox" /> Radios - <input type="radio" /> BBC &nbsp;
  <input type="radio" checked /> RaBe &nbsp; <input type="radio" /> Vatikan
</p>

<h2>So far</h2>
<img
  src="https://github.com/puzzle/prawn-markup/blob/master/spec/fixtures/logo.png?raw=true"
  style="width: 100%;"
/>
<p>and thanks for all the fish</p>
<iframe src="http://codez.ch"></iframe>