Convert `.md` files to `.mdx` so we can use `<Image>` components to compress images

[ArberTu474]

The MdxImage component should look like something like this:

---
export interface Props {
  src: string;
  alt: string;
  classes: string;
  caption?: string;
  format: string
  quality: string;
  width: number;
}
const { src, alt, format, quality, classes, caption, width } = Astro.props;
import { Image } from "astro:assets";
---

<div class="max-w-2xl mx-auto">
  <Image
    src={src}
    alt={alt}
    format={format}
    quality={quality}
    class={classes}
    width={width}
  />
  <div class="italic text-[0.9rem] text-gray-700 dark:text-sky-100 text-center px-3 mt-1 mb-4">{caption}</div>
</div>
---