From a986ee89ec269c21509bd0161ce9f9e8b48cd4d3 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Thu, 14 Mar 2024 15:16:12 -0700
Subject: [PATCH 1/3] fix: DocsNav sizing / layout responsiveness

---
 src/components/DocsNav.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/DocsNav.tsx b/src/components/DocsNav.tsx
index bdd11c5d1af..b2f480c38ad 100644
--- a/src/components/DocsNav.tsx
+++ b/src/components/DocsNav.tsx
@@ -58,8 +58,8 @@ const CardLink = ({ docData, isPrev, contentNotTranslated }: CardLinkProps) => {
     <LinkBox
       as={Flex}
       alignItems="center"
-      mt={4}
-      w="262px"
+      w="full"
+      flex="1"
       h="82px"
       bg="background.base"
       border="1px"
@@ -145,7 +145,14 @@ const DocsNav = ({ contentNotTranslated }: DocsNavProps) => {
     <Flex
       as="nav"
       aria-label="Paginate to document"
-      direction={{ base: "column-reverse", md: "row" }}
+      direction={{
+        base: "column-reverse",
+        md: "row",
+        lg: "column-reverse",
+        xl: "row",
+      }}
+      mt="8"
+      gap="4"
       justify="space-between"
       alignItems={{ base: "center", md: "flex-start" }}
     >

From cdbd55941c9ee0945a31ed8525135dd1325df112 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Thu, 14 Mar 2024 15:17:38 -0700
Subject: [PATCH 2/3] patch: dev docs content width

todo: find solution that doesn't use flex=1/width=0
---
 src/layouts/Docs.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/Docs.tsx b/src/layouts/Docs.tsx
index 1f45c3a6aef..1bf40273deb 100644
--- a/src/layouts/Docs.tsx
+++ b/src/layouts/Docs.tsx
@@ -150,7 +150,7 @@ const Content = (props: ChildOnlyProp) => {
     <Box
       as={MainArticle}
       flex={`1 1 ${mdBreakpoint}`}
-      maxW={{ base: "full", lg: mdBreakpoint }}
+      w={{ base: "full", lg: "0" }}
       pt={{ base: 32, md: 12 }}
       pb={{ base: 8, md: 16 }}
       px={{ base: 8, md: 16 }}

From 2393c1033429164d81a3b99881625188ae1d220e Mon Sep 17 00:00:00 2001
From: Nuno Loureiro <loureironuno@gmail.com>
Date: Fri, 15 Mar 2024 16:51:20 +0000
Subject: [PATCH 3/3] change the minW of the nav bar

---
 src/components/SideNav.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/SideNav.tsx b/src/components/SideNav.tsx
index b8da9f69d11..de6b4a7a0ab 100644
--- a/src/components/SideNav.tsx
+++ b/src/components/SideNav.tsx
@@ -156,8 +156,8 @@ const SideNav = ({ path }: SideNavProps) => {
       pt={8}
       pb={16}
       h="calc(100vh - 80px)" // TODO take footer into account for height?
-      w="calc((100% - 1448px) / 2 + 298px)"
-      minW="298px"
+      w="calc((100% - 1448px) / 2 + 256px)"
+      minW="256px"
       overflowY="auto"
       transition="transform 0.2s ease"
       bgColor="background.base"