From 1f661ce7c827948eae21a7202443e771ce3fa683 Mon Sep 17 00:00:00 2001
From: Olivier Tassinari <olivier.tassinari@gmail.com>
Date: Wed, 14 Jul 2021 11:19:21 +0200
Subject: [PATCH] [docs] Fix layout regression (#27266)

---
 docs/src/modules/components/AppLayoutDocs.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/docs/src/modules/components/AppLayoutDocs.js b/docs/src/modules/components/AppLayoutDocs.js
index 733e3f4c47c6a7..ff6c81f375c3ce 100644
--- a/docs/src/modules/components/AppLayoutDocs.js
+++ b/docs/src/modules/components/AppLayoutDocs.js
@@ -14,10 +14,16 @@ import AdManager from 'docs/src/modules/components/AdManager';
 import AdGuest from 'docs/src/modules/components/AdGuest';
 import AppLayoutDocsFooter from 'docs/src/modules/components/AppLayoutDocsFooter';
 
+const TOC_WIDTH = 175;
+const NAV_WIDTH = 240;
+
 const useStyles = makeStyles((theme) => ({
   root: {
     display: 'flex',
     width: '100%',
+    [theme.breakpoints.up('lg')]: {
+      width: `calc(100% - ${NAV_WIDTH}px)`,
+    },
   },
   container: {
     position: 'relative',
@@ -39,7 +45,7 @@ const useStyles = makeStyles((theme) => ({
   },
   toc: {
     [theme.breakpoints.up('sm')]: {
-      width: 'calc(100% - 175px)',
+      width: `calc(100% - ${TOC_WIDTH}px)`,
     },
   },
   disableToc: {