{{ enablePlugins('prettify') }}
{% set title = "Pagination" %}

{% extends "layouts/application.html" %}


{% block content %}
  {% include "shared/page-title.html" %}

  <div class="card-panel">
    <div class="row">
      <div class="col m6 s12">
        Add pagination links to help split up your long content into shorter, easier to understand blocks.
       <ul class="pagination">
          <li class="disabled"><a href="#!"><i class="mdi-navigation-chevron-left"></i></a></li>
          <li class="active"><a href="#!">1</a></li>
          <li class="waves-effect"><a href="#!">2</a></li>
          <li class="waves-effect"><a href="#!">3</a></li>
          <li class="waves-effect"><a href="#!">4</a></li>
          <li class="waves-effect"><a href="#!">5</a></li>
          <li class="waves-effect"><a href="#!"><i class="mdi-navigation-chevron-right"></i></a></li>
        </ul>
      </div>
      <div class="col m6 s12">
        <pre class="prettyprint linenums no-margin">
&lt;ul class="pagination">
  &lt;li class="disabled">&lt;a href="#!">&lt;i class="mdi-navigation-chevron-left">&lt;/i>&lt;/a>&lt;/li>
  &lt;li class="active">&lt;a href="#!">1&lt;/a>&lt;/li>
  &lt;li class="waves-effect">&lt;a href="#!">2&lt;/a>&lt;/li>
  &lt;li class="waves-effect">&lt;a href="#!">3&lt;/a>&lt;/li>
  &lt;li class="waves-effect">&lt;a href="#!">4&lt;/a>&lt;/li>
  &lt;li class="waves-effect">&lt;a href="#!">5&lt;/a>&lt;/li>
  &lt;li class="waves-effect">&lt;a href="#!">&lt;i class="mdi-navigation-chevron-right">&lt;/i>&lt;/a>&lt;/li>
&lt;/ul></pre>
      </div>
    </div>
  </div>

{% endblock %}