From 1ed98ba0cea6efbe66bc78f09beb185db76763be Mon Sep 17 00:00:00 2001 From: Julian Date: Mon, 30 May 2022 22:04:26 +0200 Subject: [PATCH] feat(toolPage): :lipstick: Add onError for images & background color --- assets/ImageNotLoaded.png | Bin 0 -> 7135 bytes components/ToolMain.tsx | 8 +++++--- 2 files changed, 5 insertions(+), 3 deletions(-) create mode 100644 assets/ImageNotLoaded.png diff --git a/assets/ImageNotLoaded.png b/assets/ImageNotLoaded.png new file mode 100644 index 0000000000000000000000000000000000000000..f6bb9aeeda0a4e32b25fe5c53bd1ff7de373a4a9 GIT binary patch literal 7135 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 Lcvz@z`Qd*6hUQEx literal 0 HcmV?d00001 diff --git a/components/ToolMain.tsx b/components/ToolMain.tsx index feaa9ee..4d5b5b9 100644 --- a/components/ToolMain.tsx +++ b/components/ToolMain.tsx @@ -5,6 +5,7 @@ import { Suspense } from "react"; import { FaGithub, FaLink, FaTwitter } from "react-icons/fa"; import EmbeddedSearchbar from "./EmbeddedSearchbar"; import Image from "next/image"; +import ImageNotLoaded from "../assets/ImageNotLoaded.png"; export default function ToolMain(props: any) { @@ -49,19 +50,20 @@ export default function ToolMain(props: any) { props.toolData.tool_images.length > 0 ? ( props.toolData.tool_images.map((image: any, index: number) => { return ( -
+
{ e.target.src = ImageNotLoaded }} alt={props.toolData.tool_name} />
) }) ) : ( -
+
) } -
+