congo/layouts/partials/article-link.html

80 lines
2.9 KiB
HTML

<article class="mt-6 flex max-w-prose flex-row">
{{- $images := $.Resources.ByType "image" }}
{{- $thumbnail := $images.GetMatch (.Params.thumbnail | default "*thumb*") }}
{{- $feature := $images.GetMatch (.Params.feature | default "*feature*") | default $thumbnail }}
{{- with $feature }}
<div class="flex-none pe-4 sm:pe-6 ">
<a
href="{{ with $.Params.externalUrl }}
{{ . }}
{{ else }}
{{ $.RelPermalink }}
{{ end }}"
aria-label="{{ $.Title | emojify }}"
>
<img
alt="{{ $.Params.featureAlt | default $.Params.thumbnailAlt | default "" }}"
{{ if eq .MediaType.SubType "svg" }}
class="w-24 max-w-[6rem] max-h-[4.5rem] rounded-md sm:max-h-[7.5rem] sm:w-40
sm:max-w-[10rem]" src="{{ .RelPermalink }}"
{{ else }}
class="w-24 rounded-md sm:w-40" srcset="
{{- (.Fill "160x120 smart").RelPermalink }}
160w, {{- (.Fill "320x240 smart").RelPermalink }} 2x"
src="{{ (.Fill "160x120 smart").RelPermalink }}"
width="160"
height="120"
{{ end }}
{{ if $.Site.Params.enableImageLazyLoading | default true }}
loading="lazy"
{{ end }}
/>
</a>
</div>
{{- end }}
<div>
<h3 class="flex items-center text-xl font-semibold">
{{ with .Params.externalUrl }}
<div>
<a
class="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"
href="{{ . }}"
target="_blank"
rel="external"
>{{ $.Title | emojify }}</a
>
<span
class="cursor-default align-top text-xs text-neutral-400 dark:text-neutral-500"
title="{{ i18n "list.externalurl_title" }}"
>
<span class="rtl:hidden">&#8599;</span>
<span class="ltr:hidden">&#8598;</span>
</span>
</div>
{{ else }}
<a
class="text-neutral-800 decoration-primary-500 hover:underline hover:underline-offset-2 dark:text-neutral"
href="{{ .RelPermalink }}"
>{{ .Title | emojify }}</a
>
{{ end }}
{{ if and .Draft .Site.Params.article.showDraftLabel }}
<div class="ms-2">
{{ partial "badge.html" (i18n "article.draft" | emojify) }}
</div>
{{ end }}
{{ if templates.Exists "partials/extend-article-link.html" }}
{{ partial "extend-article-link.html" . }}
{{ end }}
</h3>
<div class="text-sm text-neutral-500 dark:text-neutral-400">
{{ partial "article-meta.html" . }}
</div>
{{ if .Params.showSummary | default (.Site.Params.list.showSummary | default false) }}
<div class="prose py-1 dark:prose-invert">
{{ .Summary | emojify }}
</div>
{{ end }}
</div>
</article>