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>
This commit is contained in:
Jimmy
2026-03-04 23:32:33 +01:00
committed by GitHub
co-authored by Copilot
parent 78800c7379
commit 22edce91ab
10 changed files with 143 additions and 33 deletions
+1 -1
View File
@@ -207,8 +207,8 @@
border-radius: var(--card-border-radius);
overflow: hidden;
position: relative;
height: 350px;
width: 250px;
height: 150px;
box-shadow: var(--shadow-l1);
transition: box-shadow 0.3s ease;
background-color: var(--card-background);
-2
View File
@@ -242,8 +242,6 @@
margin-right: 15px;
flex-shrink: 0;
overflow: hidden;
width: 250px;
height: 150px;
.article-title {
font-size: 1.8rem;
-2
View File
@@ -56,8 +56,6 @@
width: max-content;
article {
width: 250px;
height: 150px;
margin-right: 20px;
flex-shrink: 0;