develop/blog - list refactor and pagination navigation features #3
|
|
@ -8,4 +8,9 @@ draft: false
|
|||
|
||||
![Air Jordan 3 Retro Georgetown (2021) [Navy]](/images/aj3georgetownstock.jpg)
|
||||
|
||||
This Air Jordan 3 (Retro) features a navy coloured tint to a familliar colour-blocking pattern. Being a new colourway rather than a direct copy of one of the designs of the original Air Jordan 3, Jordan (brand) elected to replace all of the Nike branding with the word Jordan, and the replacement of the Swoosh with a "Jumpman" logo. That being said, the absense of Nike branding is not a reason to ignore this colourway; it's so easy to wear.
|
||||
This Air Jordan 3 (Retro) features a navy coloured tint to a familliar
|
||||
colour-blocking pattern. Being a new colourway rather than a direct copy of
|
||||
one of the designs of the original Air Jordan 3, Jordan (brand) elected to
|
||||
replace all of the Nike branding with the word Jordan, and the replacement of
|
||||
the Swoosh with a "Jumpman" logo. That being said, the absense of Nike
|
||||
branding is not a reason to ignore this colourway; it's so easy to wear.
|
||||
|
|
|
|||
|
|
@ -1,15 +1,20 @@
|
|||
{{ define "main" }}
|
||||
<div class="row" style="margin-top: 25%">
|
||||
{{ $paginator := .Paginate ( where site.RegularPages "Type" "in" site.Params.mainSections ) }}
|
||||
{{ $paginator := .Paginate ( where site.RegularPages "Type" "in" site.Params.mainSections ) }}
|
||||
{{ if ne .Kind "home" }}
|
||||
{{ $paginator = .Data }}
|
||||
{{ end }}
|
||||
<div class="row grid" data-masonry='{ "itemSelector": ".grid-item" }' style="margin-top: 25%">
|
||||
<div class="columns"></div>
|
||||
|
||||
{{ range $paginator.Pages }}
|
||||
<div class="five columns">
|
||||
<div class="five columns grid-item">
|
||||
{{ range .Params.categories }}
|
||||
<a href="{{ $.Site.BaseURL }}categories/{{ . | urlize }}/">{{ . }}</a>
|
||||
{{ end }}
|
||||
<h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
|
||||
<p class="date">{{.Date.Format "January 2, 2006"}}</p>
|
||||
{{ if ne .Kind "term" }}
|
||||
<p class="date">{{.Date.Format "January 2, 2006"}}</p>
|
||||
{{ end }}
|
||||
<p class="summary">{{ .Summary | plainify | htmlUnescape }}</p>
|
||||
<p>
|
||||
{{ range .Params.tags }}
|
||||
|
|
@ -20,17 +25,7 @@
|
|||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if gt $paginator.TotalPages 1 }}
|
||||
<div class="row" style="margin-top: 2em">
|
||||
<nav aria-label="Page navigation">
|
||||
<ul class="pagination">
|
||||
{{ range $paginator.Pagers }}
|
||||
<li class="page-item {{ if eq $paginator.PageNumber .PageNumber }}active{{ end }}">
|
||||
<a class="page-link" href="{{ .URL }}">{{.PageNumber}}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{- partial "pagination.html" . -}}
|
||||
|
||||
<script src="/js/masonry.js"></script>
|
||||
{{ end }}
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
{{ define "main" }}
|
||||
<div class="row" style="margin-top: 25%">
|
||||
{{ $paginator := .Paginate ( where site.RegularPages "Type" "in" site.Params.mainSections ) }}
|
||||
{{ $paginator = .Data }}
|
||||
<div class="columns"></div>
|
||||
|
||||
{{ range $paginator.Pages }}
|
||||
<div class="five columns">
|
||||
{{ range .Params.categories }}
|
||||
<a href="/categories/{{ . | urlize }}/">{{ . }}</a>
|
||||
{{ end }}
|
||||
<h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
|
||||
<p class="date">{{.Date.Format "January 2, 2006"}}</p>
|
||||
<p class="summary">{{ .Summary | plainify | htmlUnescape }}</p>
|
||||
<p>
|
||||
{{ range .Params.tags }}
|
||||
<a href="/tags/{{ . | urlize }}/">#{{ . }}</a>
|
||||
{{ end }}
|
||||
</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if gt $paginator.TotalPages 1 }}
|
||||
<div class="row" style="margin-top: 2em">
|
||||
<nav aria-label="Page navigation">
|
||||
<ul class="pagination">
|
||||
{{ range $paginator.Pagers }}
|
||||
<li class="page-item {{ if eq $paginator.PageNumber .PageNumber }}active{{ end }}">
|
||||
<a class="page-link" href="{{ .URL }}">{{.PageNumber}}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
{{ define "main" }}
|
||||
<div class="row" style="margin-top: 25%">
|
||||
{{ $paginator := .Paginate ( where site.RegularPages "Type" "in" site.Params.mainSections ) }}
|
||||
{{ $paginator = .Data }}
|
||||
<div class="columns"></div>
|
||||
|
||||
{{ range $paginator.Pages }}
|
||||
<div class="five columns">
|
||||
{{ range .Params.categories }}
|
||||
<a href="/categories/{{ . | urlize }}/">{{ . }}</a>
|
||||
{{ end }}
|
||||
<h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
|
||||
<p class="summary">{{ .Summary | plainify | htmlUnescape }}</p>
|
||||
<p>
|
||||
{{ range .Params.tags }}
|
||||
<a href="/tags/{{ . | urlize }}/">#{{ . }}</a>
|
||||
{{ end }}
|
||||
</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ if gt $paginator.TotalPages 1 }}
|
||||
<div class="row" style="margin-top: 2em">
|
||||
<nav aria-label="Page navigation">
|
||||
<ul class="pagination">
|
||||
{{ range $paginator.Pagers }}
|
||||
<li class="page-item {{ if eq $paginator.PageNumber .PageNumber }}active{{ end }}">
|
||||
<a class="page-link" href="{{ .URL }}">{{.PageNumber}}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
{{ $paginator := $.Paginator }}
|
||||
{{ if ne .Kind "home" }}
|
||||
{{ $paginator = .Data }}
|
||||
{{ end }}
|
||||
{{ if gt $paginator.TotalPages 1 }}
|
||||
{{ $.Scratch.Set "dot_rendered" false }}
|
||||
<nav aria-label="page navigation">
|
||||
<ul class="pagination">
|
||||
{{ if and (ne $paginator.PageNumber 1) (ne $paginator.PageNumber 2) }}
|
||||
<li class="page-item"><a href="{{ $paginator.First.URL }}" rel="first" class="page-link">« First</a></li>
|
||||
{{ end }}
|
||||
|
||||
{{ if $paginator.HasPrev }}
|
||||
<li class="page-item"><a href="{{ $paginator.Prev.URL }}" rel="prev" class="page-link">‹ Prev</a></li>
|
||||
{{ end }}
|
||||
|
||||
{{ range $paginator.Pagers }}
|
||||
{{ if eq . $paginator }}
|
||||
<li class="page-item active"><a href="{{ .URL }}" class="page-link">{{ .PageNumber }}</a></li>
|
||||
{{ else if and (ge .PageNumber (sub $paginator.PageNumber 2)) (le .PageNumber (add $paginator.PageNumber 2)) }}
|
||||
{{ $.Scratch.Set "dot_rendered" false }}
|
||||
<li class="page-item"><a href="{{ .URL }}" class="page-link">{{ .PageNumber }}</a></li>
|
||||
{{ else if eq ($.Scratch.Get "dot_rendered") false }}
|
||||
{{ $.Scratch.Set "dot_rendered" true }}
|
||||
<li class="page-item disabled"><a class="page-link">...</a></li>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
||||
{{ if $paginator.HasNext }}
|
||||
<li class="page-item"><a href="{{ $paginator.Next.URL }}" rel="next" class="page-link">Next ›</a></li>
|
||||
{{ end }}
|
||||
|
||||
{{ if and (ne $paginator.PageNumber $paginator.TotalPages) ((ne $paginator.PageNumber (sub $paginator.TotalPages 1))) }}
|
||||
<li class="page-item"><a href="{{ $paginator.Last.URL }}" rel="last" class="page-link">Last »</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
{{ end }}
|
||||
|
|
@ -1,3 +1,38 @@
|
|||
/* post styles */
|
||||
article p img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* pagination styles */
|
||||
.pagination {
|
||||
display: flex;
|
||||
list-style: none;
|
||||
border-radius: .25rem;
|
||||
margin: 20px 0;
|
||||
padding: 0;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.page-item {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 0.5em;
|
||||
margin: 0.25em;
|
||||
line-height: 1.25;
|
||||
border: 1px dashed;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.page-item.active {
|
||||
background: #1EAEDB;
|
||||
}
|
||||
|
||||
.page-item.active .page-link {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.page-item.disabled .page-link {
|
||||
color: #6c757d;
|
||||
pointer-events: none;
|
||||
cursor: auto;
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue