fix(core): bg color issues in transparent mode (#5278)

fix the following style issue
![CleanShot 2023-12-13 at 00.06.13@2x.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/T2klNLEk0wxLh4NRDzhk/46f5e766-e6c9-4965-bab7-6fd6dbb2c651.png)

packages/frontend/core/src/layouts/workspace-layout.tsx

@@ -219,6 +219,10 @@ export const WorkspaceLayoutInner = ({
 
   const { appSettings } = useAppSettingHelper();
   const location = useLocation();
+  const { pageId } = useParams();
+
+  // todo: refactor this that the root layout do not need to check route state
+  const isInPageDetail = !!pageId;
 
   return (
     <>
@@ -247,15 +251,18 @@ export const WorkspaceLayoutInner = ({
               paths={pathGenerator}
             />
           </Suspense>
-          <Suspense fallback={<MainContainer />}>
-            <MainContainer padding={appSettings.clientBorder}>
+          <MainContainer
+            transparent={isInPageDetail}
+            padding={appSettings.clientBorder}
+          >
+            <Suspense>
               {migration ? (
                 <WorkspaceUpgrade migration={migration} />
               ) : (
                 children
               )}
-            </MainContainer>
-          </Suspense>
+            </Suspense>
+          </MainContainer>
         </AppContainer>
         <PageListTitleCellDragOverlay />
       </DndContext>