Files
hugo-theme-stack/layouts/_partials/article-list/compact.html
T
22edce91ab feat: add responsive image support (#1283)
* 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>
2026-03-04 23:32:33 +01:00

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>