Function ImageInline

src/components/RichDescription.tsx:15–56

({ src }: { src: string })

}

function ImageInline({ src }: { src: string }) {
  const [fullscreen, setFullscreen] = useState(false);

  return (
    <>
      <img
        src={src}
        alt=""
        onClick={() => setFullscreen(true)}
        style={{
          maxWidth: "100%",
          maxHeight: "400px",
          borderRadius: "0.5rem",
          marginTop: "0.5rem",
          cursor: "pointer",
          border: "1px solid var(--border)",
        }}
      />
      {fullscreen && (
        <div
          onClick={() => setFullscreen(false)}
          style={{
            position: "fixed",
            inset: 0,
            zIndex: 9999,
            backgroundColor: "rgba(0,0,0,0.85)",
            display: "flex",
            alignItems: "center",
            justifyContent: "center",
            cursor: "zoom-out",
          }}
        >
          <img
            src={src}
            alt=""
            style={{ maxWidth: "95vw", maxHeight: "95vh", borderRadius: "0.5rem" }}
          />
        </div>
      )}
    </>
  );
}

interface RichDescriptionProps {
  text: string;