* feat: create responsive-image helper * feat: new responsive-image helper * feat: Implement responsive image rendering in page content using a new partial and configure image processing widths. * feat: add `sizes` attribute for enhanced image responsiveness * feat: add responsive image to page header too * Check for `.Enabled` before processing image * style: remove wrong article-list--tile width and height * feat: add `helper/thumbnail-image` for responsive thumbnails * feat: enable content image processing and update responsive image `sizes` attributes for improved display. * fix: get src from the attributes so external image can work correctly * fix: add missing data-title-escaped * Update layouts/_partials/article/components/header.html Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * feat: remove default `true` for thumbnail resize parameter. * Update layouts/_markup/render-image.html Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * Update layouts/_partials/helper/thumbnail-image.html Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * add original width and height to thumbnail pictures, for case that resize is not enabled * Update layouts/_partials/helper/thumbnail-image.html Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
33 lines
1.1 KiB
HTML
33 lines
1.1 KiB
HTML
<article>
|
|
<a href="{{ .RelPermalink }}">
|
|
<div class="article-details">
|
|
<h2 class="article-title">
|
|
{{- .Title -}}
|
|
</h2>
|
|
<footer class="article-time">
|
|
<time datetime='{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}'>
|
|
{{- .Date | time.Format (or .Site.Params.dateFormat.published "Jan 02, 2006") -}}
|
|
</time>
|
|
</footer>
|
|
</div>
|
|
|
|
{{- $image := partial "helper/image" (dict "Image" .Params.image "Resources" .Resources) -}}
|
|
{{ if $image }}
|
|
<div class="article-image">
|
|
{{ partial "helper/thumbnail-image" (dict
|
|
"Resource" $image.Resource
|
|
"Width" 60
|
|
"Height" 60
|
|
"Resize" .Site.Params.ImageProcessing.Thumbnail.Enabled
|
|
"Attributes" (dict
|
|
"src" $image.Permalink
|
|
"alt" .Title
|
|
"loading" "lazy"
|
|
"width" $image.Width
|
|
"height" $image.Height
|
|
)
|
|
) }}
|
|
</div>
|
|
{{ end }}
|
|
</a>
|
|
</article> |