From 5e482bb925fd99f2bb9b9a973327296b586ac18c Mon Sep 17 00:00:00 2001
From: Mikkel Laursen <mlaursen03@gmail.com>
Date: Mon, 29 Nov 2021 15:30:57 -0700
Subject: [PATCH] chore(docs): Update images/videos for markdown pages

---
 .../src/components/Markdown/renderers.tsx     | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/packages/documentation/src/components/Markdown/renderers.tsx b/packages/documentation/src/components/Markdown/renderers.tsx
index 46ef7600de..5f11f8129e 100644
--- a/packages/documentation/src/components/Markdown/renderers.tsx
+++ b/packages/documentation/src/components/Markdown/renderers.tsx
@@ -1,6 +1,7 @@
 import {
   DEFAULT_MARKDOWN_RENDERERS,
   getTokensText,
+  ImageRenderer,
   MarkdownRenderers,
   useSluggedId,
 } from "react-marked-renderer";
@@ -117,6 +118,24 @@ export const renderers: MarkdownRenderers = {
     );
   },
 
+  img: function Img({ href, ...props }) {
+    return (
+      <Link
+        href={href}
+        className="rmd-media-container rmd-media-container--auto"
+      >
+        {href.endsWith(".mp4") ? (
+          <video autoPlay loop muted controls>
+            <source src={href} type="video/mp4" />
+            {props.text || props.title}
+          </video>
+        ) : (
+          <ImageRenderer href={href} {...props} />
+        )}
+      </Link>
+    );
+  },
+
   table: function TableRenderer({ children }) {
     return (
       <TableContainer>