memorium/components/Image.tsx

import { asset } from "$fresh/runtime.ts";
import * as CSS from "https://esm.sh/csstype@3.1.2";

const Image = (
  props: {
    class: string;
    src: string;
    alt?: string;
    thumbnail?: string;
    width?: number | string;
    height?: number | string;
    style?: CSS.HtmlAttributes;
  },
) => {
  return (
    <span
      style={{
        position: "absolute",
        width: "100%",
        height: "100%",
        zIndex: -1,
      }}
      data-thumb={props.thumbnail}
    >
      <img
        data-thumb={props.thumbnail}
        data-thumb-img
        loading="lazy"
        alt={props.alt}
        style={props.style}
        src={asset(props.src)}
        width={props.width}
        height={props.height}
        class={props.class}
      />
    </span>
  );
};

export default Image;