From 38efaaa380d2ec0ea925e9568a81f6a98edfdf92 Mon Sep 17 00:00:00 2001
From: Andy Leuchtturm <d-leuchtturm@gmx.net>
Date: Thu, 28 Sep 2023 13:57:36 +0200
Subject: [PATCH] implement imageLoader
---
components/it-standards/LifecyclePicture.tsx | 5 +++++
1 file changed, 5 insertions(+)
diff --git a/components/it-standards/LifecyclePicture.tsx b/components/it-standards/LifecyclePicture.tsx
index aca7810..d0f011e 100644
--- a/components/it-standards/LifecyclePicture.tsx
+++ b/components/it-standards/LifecyclePicture.tsx
@@ -4,6 +4,10 @@ import useImgPath from 'shared/use-img-path'
const { getImgPath } = useImgPath()
+const imageLoader = ({ src, width, quality }) => {
+ return `${src}?w=${width}&q=${quality || 75}`
+}
+
export default function LifecyclePicture(lifecyclephase:Tag) {
/* beim tag 'status' soll das zugehĂśrige Lebenszyklus-Bild ausgegeben werden */
const imagePath = `/img/standards/lifecycle/${lifecyclephase.value}.svg`
@@ -11,6 +15,7 @@ export default function LifecyclePicture(lifecyclephase:Tag) {
<div className="border border-gray-300 rounded-lg overflow-hidden py-2">
{/* Die Next.js Image-Komponente verwendet das "src" Attribut */}
<Image
+ loader={imageLoader}
src={getImgPath(imagePath)}
alt={`Bild fĂźr Tag ${lifecyclephase.value}`}
width={500} // Breite des Bildes
--
GitLab