blogs/hugo
1
0
Fork 0
mirror of https://github.com/gohugoio/hugo.git synced 2026-08-25 07:48:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Always show the latest showcase item on front page

Browse Source
This commit is contained in:
Bjørn Erik Pedersen
2018-02-13 15:45:38 +01:00
parent 665b1eb5e7
commit 6d2e68521a
1 changed files with 28 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
themes/gohugoioTheme/layouts/partials/home-page-sections/showcase.html
+28 -21
View File
@@ -4,26 +4,10 @@
<div class="w-100">
<div class="w-100 overflow-x-scroll">
<div class="row nowrap mv2 pb1">
{{ range $p := first 10 (where .Site.RegularPages "Section" "showcase" | shuffle) }}
{{ $img := (.Resources.ByType "image").GetMatch "*featured*" }}
{{ with $img }}
{{ $big := .Fill "1024x512 top" }}
{{ $small := $big.Resize "512x" }}
<a href="{{ $p.RelPermalink}}" class="tile lazyload cover dib f4 h5 ml1 mr4 bg-black relative mw-100 shadow-5" style="width:{{ $small.Width }}px;"
data-bg="{{ $img.RelPermalink }}"
data-sizes="auto"
data-srcset="{{ $small.RelPermalink }} 1x,
{{ $big.RelPermalink }} 2x" data-src="small"
>
{{with $p.Title}}
<div class="details absolute bottom-0 f3-ns f4 left-0 o-0 right-0 top-0">
<div class="absolute bottom-0 pa2 tc white">
{{.}} &#8594;
</div>
</div>
{{end}}
</a>
{{ end }}
{{ $showcasePages := where .Site.RegularPages "Section" "showcase" }}
{{ template "home_showcase_item" (index $showcasePages 0) }}
{{ range $p := first 10 ($showcasePages | after 1 | shuffle) }}
{{template "home_showcase_item" $p }}
{{end}}
</div>
</div>
@@ -32,4 +16,27 @@
<div class="flex w-100 mt4 justify-end">{{/* using Flex to make the button show up on the right side */}}
<a href="/showcase/" class="br2 f6 bg-primary-color-dark hover-bg-primary-color link ph3 pv2 ttu white">See All</a>
</div>
</section>
</section>
{{ define "home_showcase_item" }}
{{ $img := (.Resources.ByType "image").GetMatch "*featured*" }}
{{ with $img }}
{{ $big := .Fill "1024x512 top" }}
{{ $small := $big.Resize "512x" }}
<a href="{{ $.RelPermalink}}" class="tile lazyload cover dib f4 h5 ml1 mr4 bg-black relative mw-100 shadow-5" style="width:{{ $small.Width }}px;"
data-bg="{{ $img.RelPermalink }}"
data-sizes="auto"
data-srcset="{{ $small.RelPermalink }} 1x,
{{ $big.RelPermalink }} 2x" data-src="small"
>
{{with $.Title}}
<div class="details absolute bottom-0 f3-ns f4 left-0 o-0 right-0 top-0">
<div class="absolute bottom-0 pa2 tc white">
{{.}} &#8594;
</div>
</div>
{{end}}
</a>
{{ end }}
{{ end }}