make the markdown list slighly more to the right

src/app/components/mdx-components.tsx

@@ -0,0 +1,22 @@
+import { MDXRemote } from "remote-mdx/rsc";
+import { ReactElement } from "react";
+import { formatCode, formatHeading, formatLink, formatList } from "@/app/components/mdx-renderer";
+
+/**
+ * The components to use in the MDX renderer.
+ */
+const components = {
+  h1: (props: any) => formatHeading(1, props),
+  h2: (props: any) => formatHeading(2, props),
+  h3: (props: any) => formatHeading(3, props),
+  h4: (props: any) => formatHeading(4, props),
+  h5: (props: any) => formatHeading(5, props),
+  h6: (props: any) => formatHeading(6, props),
+  code: (props: any) => formatCode(props),
+  ul: (props: any) => formatList(props),
+  a: (props: any) => formatLink(props),
+};
+
+export function CustomMDX(props: any): ReactElement {
+  return <MDXRemote {...props} components={{ ...components, ...(props.components || {}) }} />;
+}