millironx/pages
1
0
Fork 0
Code Issues Pull requests Releases Packages Activity

refactor: move list card to partial template

Browse source
This commit is contained in:
Thomas A. Christensen II 2024-12-14 17:54:43 -06:00
parent d675dc24ff
commit 64d0b6520f
Signed by: millironx
GPG key ID: 19A2EF3A3C0C18A9
2 changed files with 79 additions and 78 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

79
layouts/_default/list.html
View file

@ -8,84 +8,7 @@
</div>
{{ range .Pages }}
<div class="card">
{{ partial "category-button" . }}
{{ with .Param "fa-thumbnail" }}
<div class="card-header">
<div class="thumb-icon-wrapper">
<span class="thumb-icon-badge">
{{- partial "fa.html" . -}}
</span>
</div>
</div>
{{ end }}
{{/* Thumbnail images should be stored as 'thumbnail'.* in the page bundle, but
historically they might have been referenced as 'thumbnail' in the front
matter, or (even more historically) as 'cardImage'. Use scratch to
normalize all these different systems.
*/}}
{{ $bundleGlob := "thumbnail.*" }}
{{ $frontThumbGlob := print "images/" (.Params.thumbnail) ".*" }}
{{ $frontCardGlob := print "images/" (.Params.cardImage) ".jpg" }}
{{ $allThumbnailGlob := print "{" $frontThumbGlob "," $frontCardGlob "," $bundleGlob "}" }}
{{ with .Resources.GetMatch $allThumbnailGlob }}
{{ $thumbnail := . }}
{{ $thumbnailResized := $thumbnail.Resize "600x" }}
<div class="card-header">
<img
class="img-thumbnail"
src="{{ $thumbnailResized.RelPermalink }}"
alt="Thumbnail of {{ .Title }}"
/>
</div>
{{ end }}
<div class="card-body">
{{/* Prefer full-text links over local ones */}}
<div class="card-title">
{{ $link := default .RelPermalink (index .Params "link") }}
<a href="{{ $link }}"><h3>{{ .Title }}</h3></a>
</div>
<div>
{{ dateFormat "02 Jan 2006" .Date }}
</div>
{{ range (.GetTerms "people") }}
<a
href="{{ .RelPermalink }}"
class="card-link {{ if eq .LinkTitle "Thomas A. Christensen II" }}
bolder
{{ end }}"
>{{- partial "fa.html" "user" }} {{ .LinkTitle }}</a
>
{{ end }}
<p class="card-text">
{{ .Summary }}
<strong
><small
><a href="{{ $link }}">Read&nbsp;more&nbsp;&raquo;</a></small
></strong
>
</p>
<div class="card-footer">
{{ range (.GetTerms "tags") }}
<a href="{{ .RelPermalink }}" class="icon-link card-link"
>{{- partial "fa.html" "tag" }} {{ .LinkTitle }}</a
>
{{ end }}
</div>
</div>
</div>
<!-- </card> -->
{{ partial "itemcard.html" . }}
{{ end }}
</section>
{{ end }}

78
layouts/partials/itemcard.html Normal file
View file

@ -0,0 +1,78 @@
<div class="card">
{{ partial "category-button" . }}
{{ with .Param "fa-thumbnail" }}
<div class="card-header">
<div class="thumb-icon-wrapper">
<span class="thumb-icon-badge">
{{- partial "fa.html" . -}}
</span>
</div>
</div>
{{ end }}
{{/* Thumbnail images should be stored as 'thumbnail'.* in the page bundle, but
historically they might have been referenced as 'thumbnail' in the front
matter, or (even more historically) as 'cardImage'. Use scratch to
normalize all these different systems.
*/}}
{{ $bundleGlob := "thumbnail.*" }}
{{ $frontThumbGlob := print "images/" (.Params.thumbnail) ".*" }}
{{ $frontCardGlob := print "images/" (.Params.cardImage) ".jpg" }}
{{ $allThumbnailGlob := print "{" $frontThumbGlob "," $frontCardGlob "," $bundleGlob "}" }}
{{ with .Resources.GetMatch $allThumbnailGlob }}
{{ $thumbnail := . }}
{{ $thumbnailResized := $thumbnail.Resize "600x" }}
<div class="card-header">
<img
class="img-thumbnail"
src="{{ $thumbnailResized.RelPermalink }}"
alt="Thumbnail of {{ .Title }}"
/>
</div>
{{ end }}
<div class="card-body">
{{/* Prefer full-text links over local ones */}}
<div class="card-title">
{{ $link := default .RelPermalink (index .Params "link") }}
<a href="{{ $link }}"><h3>{{ .Title }}</h3></a>
</div>
<div>
{{ dateFormat "02 Jan 2006" .Date }}
</div>
{{ range (.GetTerms "people") }}
<a
href="{{ .RelPermalink }}"
class="card-link {{ if eq .LinkTitle "Thomas A. Christensen II" }}
bolder
{{ end }}"
>{{- partial "fa.html" "user" }} {{ .LinkTitle }}</a
>
{{ end }}
<p class="card-text">
{{ .Summary }}
<strong
><small
><a href="{{ $link }}">Read&nbsp;more&nbsp;&raquo;</a></small
></strong
>
</p>
<div class="card-footer">
{{ range (.GetTerms "tags") }}
<a href="{{ .RelPermalink }}" class="icon-link card-link"
>{{- partial "fa.html" "tag" }} {{ .LinkTitle }}</a
>
{{ end }}
</div>
</div>
</div>
<!-- </card> -->