🚸 Add support for article images in front matter

Ref #381
This commit is contained in:
James Panther
2023-01-13 13:02:32 +11:00
parent 0813583381
commit af7067b86f
6 changed files with 34 additions and 14 deletions
+17 -11
View File
@@ -1,7 +1,7 @@
{{ define "main" }}
{{- $images := .Resources.ByType "image" }}
{{- $cover := $images.GetMatch "*cover*" }}
{{- $feature := $images.GetMatch "*feature*" | default $cover }}
{{- $cover := $images.GetMatch (.Params.cover | default "*cover*") }}
{{- $feature := $images.GetMatch (.Params.feature | default "*feature*") | default $cover }}
<article>
<header class="max-w-prose">
{{ if .Params.showBreadcrumbs | default (.Site.Params.article.showBreadcrumbs | default false) }}
@@ -14,15 +14,21 @@
{{ partial "article-meta.html" (dict "context" . "scope" "single") }}
</div>
{{ with $feature }}
<img
class="mb-6 -mt-4 rounded-md"
srcset="
{{- (.Resize "330x").RelPermalink }} 330w,
{{- (.Resize "660x").RelPermalink }} 660w,
{{- (.Resize "1024x").RelPermalink }} 1024w,
{{- (.Resize "1320x").RelPermalink }} 2x"
src="{{ (.Resize "660x").RelPermalink }}"
/>
<div class="prose">
<img
class="mb-6 -mt-4 rounded-md"
srcset="
{{- (.Resize "330x").RelPermalink }} 330w,
{{- (.Resize "660x").RelPermalink }} 660w,
{{- (.Resize "1024x").RelPermalink }} 1024w,
{{- (.Resize "1320x").RelPermalink }} 2x"
src="{{ (.Resize "660x").RelPermalink }}"
alt="{{ $.Params.featureAlt | default $.Params.coverAlt | default "" }}"
/>
{{ with $.Params.coverCaption }}
<figcaption class="mb-6 -mt-3 text-center">{{ . | markdownify }}</figcaption>
{{ end }}
</div>
{{ end }}
</header>
<section class="flex flex-col max-w-full mt-0 prose dark:prose-invert lg:flex-row">
+3 -3
View File
@@ -1,7 +1,7 @@
<article class="flex flex-row mt-6 max-w-prose">
{{- $images := $.Resources.ByType "image" }}
{{- $thumbnail := $images.GetMatch "*thumb*" }}
{{- $feature := $images.GetMatch "*feature*" | default $thumbnail }}
{{- $thumbnail := $images.GetMatch (.Params.thumbnail | default "*thumb*") }}
{{- $feature := $images.GetMatch (.Params.feature | default "*feature*") | default $thumbnail }}
{{- with $feature }}
<div class="flex-none pr-4 sm:pr-6 ">
<a
@@ -18,7 +18,7 @@
{{- (.Fill "160x120 smart").RelPermalink }} 160w,
{{- (.Fill "320x240 smart").RelPermalink }} 2x"
src="{{ (.Fill "160x120 smart").RelPermalink }}"
alt=""
alt="{{ $.Params.featureAlt | default $.Params.thumbnailAlt | default "" }}"
/>
</a>
</div>