<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv='content-type' content='text/html; charset=utf-8' />
    <title>PageCalc example</title>
    <style type='text/css'>
      #paginator .active {
        font-size   : 16pt;
        font-weight : bold;
      }
      #paginator a {
        display   : inline-block;
        min-width : 12px; 
      }
    </style>
  </head>
  <body>
    <div>
      {% if data %}
	      <h1>Content</h1>
	      <ul>
	      {% for value in data %}
	        <li>{{ value }}</li>
	      {% endfor %}
	      </ul>
	      <h1>Pagination</h1>
	      {% include 'paginator.html' %}
      {% else %}
        <h1>Pagination styles</h1>
        <a href='/sliding'>Sliding</a>
        <a href='/jumping'>Jumping</a>
      {% endif %}
    </div>
  </body>
</html>