From bbd4a31bad0c0d6134d4e7a6ed2928c15b97da98 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Tue, 6 Dec 2022 14:35:53 +0100
Subject: [PATCH] add max width of 100% to md content on mobile (#130)

---
 src/components/UI/docs/MDComponents.tsx | 2 +-
 src/pages/[...slug].tsx                 | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/UI/docs/MDComponents.tsx b/src/components/UI/docs/MDComponents.tsx
index ff1217b126..dab3a440d1 100644
--- a/src/components/UI/docs/MDComponents.tsx
+++ b/src/components/UI/docs/MDComponents.tsx
@@ -101,7 +101,7 @@ const MDComponents = {
   },
   // tables
   table: ({ children }: any) => (
-    <Flex maxW='min(100%, 100vw)' overflowX='auto'>
+    <Flex overflowX='auto'>
       <Table
         variant='striped'
         colorScheme='greenAlpha'
diff --git a/src/pages/[...slug].tsx b/src/pages/[...slug].tsx
index 3c5166e91b..b68760f344 100644
--- a/src/pages/[...slug].tsx
+++ b/src/pages/[...slug].tsx
@@ -116,7 +116,7 @@ const DocPage: NextPage<Props> = ({ frontmatter, content, navLinks, lastModified
             </Stack>
 
             <Flex width='100%' placeContent='space-between' gap={8}>
-              <Stack maxW='768px' sx={{ "*:first-of-type": { marginTop: '0 !important' } }}>
+              <Stack maxW='min(100%, 768px)' sx={{ "*:first-of-type": { marginTop: '0 !important' } }}>
                 <ReactMarkdown
                   remarkPlugins={[gfm]}
                   rehypePlugins={[rehypeRaw]}