Add alt as caption, add details to header, add some early writing to DNDT

src/components/MDX/IMG.astro

@@ -7,4 +7,11 @@ import { getImageByPath } from "@lib/utils";
 const image = getImageByPath(src);
 ---
 
-{image && <Image src={image} alt={alt} />}
+{
+  image && (
+    <div class="my-8">
+      <Image src={image} alt={alt} />
+      <div class="mt-2 block w-full text-center text-sm italic">{alt}</div>
+    </div>
+  )
+}