Foundation Decorator

The Foundation decorator produces pagination html based on Foundation version 6.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
<?php
use Vespula\Paginator\Paginator;
use Vespula\Paginator\Decorator\Foundation;
use Zend\Diactoros\Uri;

$decorator = new Foundation();
$paginator = new Paginator($decorator);
$uri = new Uri('http://example.com');

$page = 2;
$total = 234;

echo $paginator->paginate($page, $total, $uri); 

There are a few notable configuration differences for this decorator. These can be overridden at construction, or using $decorator->setConfig()

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
<?php
// Default decorator config, that you can override
$config = [
    'active_class'=>'current', // the class for the active item
    'previous_class'=>'pagination-previous', // class applied to previous
    'next_class'=>'pagination-next', // class applied to next
    'aria_container'=>'Pagination', // aria-label applied to the container
    'sr_class'=>'show-for-sr', // screen reader only class
    'aria_current'=>'You are on page', // aria-label for the current item
];

Sample output

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
<ul class="pagination">
    <li class="disabled"><span aria-label="First page">First</span></li>
    <li class="disabled"><span aria-label="Previous page">Previous</span></li>
    <li class="active"><span aria-label="Page 1">1 <span class="sr-only">(current)</span></span></li>
    <li><a href="http://example.com?page=2" aria-label="Page 2">2</a></li>
    <li><a href="http://example.com?page=3" aria-label="Page 3">3</a></li>
    <li><a href="http://example.com?page=4" aria-label="Page 4">4</a></li>
    <li><a href="http://example.com?page=5" aria-label="Page 5">5</a></li>
    <li><a href="http://example.com?page=6" aria-label="Page 6">6</a></li>
    <li><a href="http://example.com?page=7" aria-label="Page 7">7</a></li>
    <li><a href="http://example.com?page=8" aria-label="Page 8">8</a></li>
    <li><a href="http://example.com?page=9" aria-label="Page 9">9</a></li>
    <li><a href="http://example.com?page=10" aria-label="Page 10">10</a></li>
    <li><a href="http://example.com?page=2" aria-label="Next page">Next</a></li>
    <li><a href="http://example.com?page=24" aria-label="Last page">Last</a></li>
</ul>