Browse Source

Implemented paging

master
Mark Pitman 7 years ago
parent
commit
a76fda6810
  1. 1
      .gitignore
  2. 3
      layouts/index.html
  3. 9
      layouts/partials/pagination.html
  4. 41
      static/css/main.css

1
.gitignore vendored

@ -0,0 +1 @@
*.swp

3
layouts/index.html

@ -1,11 +1,12 @@
{{ partial "header.html" . }}
<div class="article-list">
{{ range $index, $page := .Site.Pages }}
{{ range $index, $page := .Paginator.Pages }}
{{ if ne $index 0 }}
<hr/>
{{ end }}
{{ .Render "li" }}
{{ end }}
</div>
{{ partial "pagination.html" .Paginator }}
{{ partial "footer.html" . }}

9
layouts/partials/pagination.html

@ -0,0 +1,9 @@
<nav class="pagination" role="navigation">
{{if .HasPrev}}
<a class="newer-posts" href="{{ .Prev.URL }}">&laquo; Newer Posts</a>
{{end}}
<span class="page-number">Page {{ .PageNumber }} of {{.TotalPages}}</span>
{{if .HasNext}}
<a class="older-posts" href="{{ .Next.URL }}">Older Posts &raquo;</a>
{{end}}
</nav>

41
static/css/main.css

@ -216,6 +216,47 @@ a.btn-back {
color: rgba(255, 255, 255, 1.0);
}
/* Pagination */
.pagination
{
width: 720px;
text-align: center;
}
.older-posts,.newer-posts
{
display: inline!important;
border: 1px solid #ddd;
border-radius: 15px;
text-decoration: none;
transition: border .3s ease;
padding: 5px 14px;
}
.page-number
{
display: inline-block;
min-width: 100px;
padding: 2px 0;
}
.newer-posts
{
float: left;
}
.older-posts
{
float: right;
}
.older-posts:hover,.newer-posts:hover
{
color: #889093;
border-color: #98a0a4;
}
/* Override some of Bootstrap's styles */
pre {

Loading…
Cancel
Save