feat: add url to site config, add webp support, change image sizing

This commit is contained in:
2024-12-15 01:27:03 +01:00
parent a967366a9b
commit af66646775
7 changed files with 64 additions and 14 deletions

View File

@@ -3,7 +3,19 @@
<f:if condition="{newsItem.media}">
<f:then>
<picture>
<source
<!-- WEBP source -->
<source
type="image/webp"
srcset="
{f:uri.image(image:newsItem.media.0, width:'320c', cropVariant:'default', fileExtension:'webp')} 320w,
{f:uri.image(image:newsItem.media.0, width:'768c', cropVariant:'default', fileExtension:'webp')} 768w,
{f:uri.image(image:newsItem.media.0, width:'1024c', cropVariant:'default', fileExtension:'webp')} 1024w"
sizes="(max-width: 320px) 100vw,
(max-width: 768px) 50px,
400px" />
<!-- Fallback source -->
<source
srcset="
{f:uri.image(image:newsItem.media.0, width:'320c', cropVariant:'default')} 320w,
{f:uri.image(image:newsItem.media.0, width:'768c', cropVariant:'default')} 768w,
@@ -11,12 +23,12 @@
sizes="(max-width: 320px) 100vw,
(max-width: 768px) 50vw,
400px" />
<f:image
image="{newsItem.media.0}"
treatIdAsReference="1"
<f:image
image="{newsItem.media.0}"
treatIdAsReference="1"
cropVariant="default"
width="1024c"
alt="{newsItem.title}"
alt="{newsItem.title}"
class="news-item-grid-image" />
</picture>
</f:then>