add pagination to blog, categories and tags, and fix some issues and typos
This commit is contained in:
parent
a37ff92523
commit
ca69a65980
6 changed files with 282 additions and 1 deletions
|
@ -2,7 +2,7 @@
|
|||
other = "NO ENCONTRADO"
|
||||
|
||||
[not_found_desc]
|
||||
other = "Haz tomado una ruta que no existe..."
|
||||
other = "Has tomado una ruta que no existe..."
|
||||
|
||||
[home]
|
||||
other = "Inicio"
|
||||
|
|
44
layouts/blog/list.html
Normal file
44
layouts/blog/list.html
Normal file
|
@ -0,0 +1,44 @@
|
|||
{{ define "title"}}
|
||||
{{ .Title }} | {{ .Site.Params.author.name }}
|
||||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
|
||||
<div>
|
||||
<div class="listHeader">
|
||||
<h1>{{ .Title }}</h1>
|
||||
</div>
|
||||
|
||||
{{ with .Content }}
|
||||
<div class="listContent">
|
||||
{{- . -}}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div>
|
||||
{{ $pages := where site.RegularPages "Type" "blog" }}
|
||||
{{ $paginator := .Paginate $pages.ByDate.Reverse 10 }}
|
||||
|
||||
{{ range $paginator.Pages.ByDate.Reverse }}
|
||||
|
||||
<a class="postListLink" href="{{ .Permalink }}">
|
||||
<!-- [html-validate-disable-next prefer-native-element] -->
|
||||
<div class="postListItem" role="listitem">
|
||||
<div class="postHeader">
|
||||
<span class="postTitle">{{ .Title }}</span>
|
||||
{{ $formattedDate := .Date.Format "2006-01-02" }}
|
||||
<time class="postDate" datetime="{{ $formattedDate }}">{{ .Date | time.Format ":date_long" }}</time>
|
||||
</div>
|
||||
<div class="postExcerpt">
|
||||
<p>{{ .Summary }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
{{end}}
|
||||
{{ template "partials/pagination.html" . }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ end }}
|
44
layouts/categories/list.html
Normal file
44
layouts/categories/list.html
Normal file
|
@ -0,0 +1,44 @@
|
|||
{{ define "title"}}
|
||||
{{ .Title }} | {{ .Site.Params.author.name }}
|
||||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
|
||||
<div>
|
||||
<div class="listHeader">
|
||||
<h1>{{ .Title }}</h1>
|
||||
</div>
|
||||
|
||||
{{ with .Content }}
|
||||
<div class="listContent">
|
||||
{{- . -}}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div>
|
||||
{{ $pages := where site.RegularPages "Type" "categories" }}
|
||||
{{ $paginator := .Paginate (where .Data.Pages "Type" "blog") 10 }}
|
||||
|
||||
{{ range $paginator.Pages.ByDate.Reverse }}
|
||||
|
||||
<a class="postListLink" href="{{ .Permalink }}">
|
||||
<!-- [html-validate-disable-next prefer-native-element] -->
|
||||
<div class="postListItem" role="listitem">
|
||||
<div class="postHeader">
|
||||
<span class="postTitle">{{ .Title }}</span>
|
||||
{{ $formattedDate := .Date.Format "2006-01-02" }}
|
||||
<time class="postDate" datetime="{{ $formattedDate }}">{{ .Date | time.Format ":date_long" }}</time>
|
||||
</div>
|
||||
<div class="postExcerpt">
|
||||
<p>{{ .Summary }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
{{end}}
|
||||
{{ template "partials/pagination.html" . }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ end }}
|
|
@ -3,6 +3,35 @@
|
|||
<head>
|
||||
<style>
|
||||
code { padding: 2px 4px; font-size: 90%; border-radius: 4px; background-color: #1c1c1d; }
|
||||
|
||||
.pagination {
|
||||
list-style: none;
|
||||
margin: 3;
|
||||
padding: 0;
|
||||
margin-top: 1em;
|
||||
padding-top: 0.5em;
|
||||
font: 1.2em FiraMono;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.pagination li {
|
||||
margin: 0 1px;
|
||||
}
|
||||
|
||||
.pagination a {
|
||||
display: block;
|
||||
padding: 0.1em 0.8em;
|
||||
margin: 1px;
|
||||
border-radius: 0.5em;
|
||||
text-decoration: none;
|
||||
background-color: #2f2f2f;
|
||||
}
|
||||
|
||||
.pagination a:hover {
|
||||
color: #f8f8ff;
|
||||
background-color: #f26d63;
|
||||
}
|
||||
.searchprompt {
|
||||
color: #4b4b4b;
|
||||
font-size: 12px;
|
||||
|
|
120
layouts/partials/pagination.html
Normal file
120
layouts/partials/pagination.html
Normal file
|
@ -0,0 +1,120 @@
|
|||
<!--
|
||||
//
|
||||
// PAGE NUMBERS
|
||||
//––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||
-->
|
||||
{{ $paginator := .Paginator }}
|
||||
|
||||
<!-- Number of links either side of the current page. -->
|
||||
{{ $adjacent_links := 2 }}
|
||||
|
||||
<!-- $max_links = ($adjacent_links * 2) + 1 -->
|
||||
{{ $max_links := (add (mul $adjacent_links 2) 1) }}
|
||||
|
||||
<!-- $lower_limit = $adjacent_links + 1 -->
|
||||
{{ $lower_limit := (add $adjacent_links 1) }}
|
||||
|
||||
<!-- $upper_limit = $paginator.TotalPages - $adjacent_links -->
|
||||
{{ $upper_limit := (sub $paginator.TotalPages $adjacent_links) }}
|
||||
|
||||
<!-- If there's more than one page. -->
|
||||
{{ if gt $paginator.TotalPages 1 }}
|
||||
|
||||
<ul class="pagination">
|
||||
|
||||
<!-- First page. -->
|
||||
{{ if ne $paginator.PageNumber 1 }}
|
||||
<li class="pagination__item pagination__item--first">
|
||||
<a class="pagination__link pagination__link--first" href="{{ $paginator.First.URL }}">
|
||||
««
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
|
||||
<!-- Previous page. -->
|
||||
{{ if $paginator.HasPrev }}
|
||||
<li class="pagination__item pagination__item--previous">
|
||||
<a href="{{ $paginator.Prev.URL }}" class="pagination__link pagination__link--previous">
|
||||
«
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
|
||||
<!-- Page numbers. -->
|
||||
{{ range $paginator.Pagers }}
|
||||
|
||||
{{ $.Scratch.Set "page_number_flag" false }}
|
||||
|
||||
|
||||
<!-- Advanced page numbers. -->
|
||||
{{ if gt $paginator.TotalPages $max_links }}
|
||||
|
||||
|
||||
<!-- Lower limit pages. -->
|
||||
<!-- If the user is on a page which is in the lower limit. -->
|
||||
{{ if le $paginator.PageNumber $lower_limit }}
|
||||
|
||||
<!-- If the current loop page is less than max_links. -->
|
||||
{{ if le .PageNumber $max_links }}
|
||||
{{ $.Scratch.Set "page_number_flag" true }}
|
||||
{{ end }}
|
||||
|
||||
|
||||
<!-- Upper limit pages. -->
|
||||
<!-- If the user is on a page which is in the upper limit. -->
|
||||
{{ else if ge $paginator.PageNumber $upper_limit }}
|
||||
|
||||
<!-- If the current loop page is greater than total pages minus $max_links -->
|
||||
{{ if gt .PageNumber (sub $paginator.TotalPages $max_links) }}
|
||||
{{ $.Scratch.Set "page_number_flag" true }}
|
||||
{{ end }}
|
||||
|
||||
|
||||
<!-- Middle pages. -->
|
||||
{{ else }}
|
||||
|
||||
{{ if and ( ge .PageNumber (sub $paginator.PageNumber $adjacent_links) ) ( le .PageNumber (add $paginator.PageNumber $adjacent_links) ) }}
|
||||
{{ $.Scratch.Set "page_number_flag" true }}
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
|
||||
|
||||
<!-- Simple page numbers. -->
|
||||
{{ else }}
|
||||
|
||||
{{ $.Scratch.Set "page_number_flag" true }}
|
||||
|
||||
{{ end }}
|
||||
|
||||
<!-- Output page numbers. -->
|
||||
{{ if eq ($.Scratch.Get "page_number_flag") true }}
|
||||
<li class="pagination__item{{ if eq . $paginator }} pagination__item--current{{ end }}">
|
||||
<a href="{{ .URL }}" class="pagination__link">
|
||||
{{ .PageNumber }}
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
|
||||
<!-- Next page. -->
|
||||
{{ if $paginator.HasNext }}
|
||||
<li class="pagination__item pagination__item--next">
|
||||
<a href="{{ $paginator.Next.URL }}" class="pagination__link pagination__link--next">
|
||||
»
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
|
||||
<!-- Last page. -->
|
||||
{{ if ne $paginator.PageNumber $paginator.TotalPages }}
|
||||
<li class="pagination__item pagination__item--last">
|
||||
<a class="pagination__link pagination__link--last" href="{{ $paginator.Last.URL }}">
|
||||
»»
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
|
||||
</ul><!-- .pagination -->
|
||||
{{ end }}
|
44
layouts/tags/list.html
Normal file
44
layouts/tags/list.html
Normal file
|
@ -0,0 +1,44 @@
|
|||
{{ define "title"}}
|
||||
{{ .Title }} | {{ .Site.Params.author.name }}
|
||||
{{ end }}
|
||||
|
||||
{{ define "main" }}
|
||||
|
||||
<div>
|
||||
<div class="listHeader">
|
||||
<h1>{{ .Title }}</h1>
|
||||
</div>
|
||||
|
||||
{{ with .Content }}
|
||||
<div class="listContent">
|
||||
{{- . -}}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div>
|
||||
{{ $pages := where site.RegularPages "Type" "tags" }}
|
||||
{{ $paginator := .Paginate (where .Data.Pages "Type" "blog") 10 }}
|
||||
|
||||
{{ range $paginator.Pages.ByDate.Reverse }}
|
||||
|
||||
<a class="postListLink" href="{{ .Permalink }}">
|
||||
<!-- [html-validate-disable-next prefer-native-element] -->
|
||||
<div class="postListItem" role="listitem">
|
||||
<div class="postHeader">
|
||||
<span class="postTitle">{{ .Title }}</span>
|
||||
{{ $formattedDate := .Date.Format "2006-01-02" }}
|
||||
<time class="postDate" datetime="{{ $formattedDate }}">{{ .Date | time.Format ":date_long" }}</time>
|
||||
</div>
|
||||
<div class="postExcerpt">
|
||||
<p>{{ .Summary }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
|
||||
{{end}}
|
||||
{{ template "partials/pagination.html" . }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ end }}
|
Loading…
Add table
Add a link
Reference in a new issue