<div class="bootstrap-wrapper wt-webpart-projectspace-favourites">
    <table class="table" ng-if="sites.length > 0">
        <thead>
            <tr>
                <th>{{'Title' | translate}}</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="site in sites track by $index">
                <td>
                    <a role="button" class="glyphicon glyphicon-star" title="{{'Remove from favourites' | translate}}" ng-click="removeFavourite(site)"></a>
                    <a ng-show="site.sharePointWebStatus.id == 4" ng-href="{{site.url}}" ng-click="checkIfSiteExists(site)">{{site.name}}</a>
                    <a ng-show="site.sharePointWebStatus.id == 0 && site.o365GroupUrl" ng-href="{{site.o365GroupUrl}}" ng-bind-html="site.name"></a>
                    <span ng-hide="site.sharePointWebStatus.id == 4 || (site.sharePointWebStatus.id == 0 && site.o365GroupUrl)">{{site.name}}</span>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div class="row text-center">
    <div class="col-xs-12">
        <pagination ng-show="totalCount > webpartProperties.sitesPerPage"
                    total-items="totalCount"
                    ng-model="currentPage.value"
                    ng-change="pageChanged(currentPage.value)"
                    items-per-page="webpartProperties.sitesPerPage"
                    max-size="5"
                    boundary-links="false"
                    previous-text="&lsaquo;"
                    next-text="&rsaquo;"
                    first-text="&laquo;"
                    last-text="&raquo;"></pagination>
    </div>
</div>