diff --git a/packages/gitbook/src/components/DocumentView/Blocks.tsx b/packages/gitbook/src/components/DocumentView/Blocks.tsx index 4bbe605d87..8285af2721 100644 --- a/packages/gitbook/src/components/DocumentView/Blocks.tsx +++ b/packages/gitbook/src/components/DocumentView/Blocks.tsx @@ -47,6 +47,23 @@ type UnwrappedBlocksProps = DocumentContextProps & isOffscreen?: boolean; }; +/* Blocks that can be full width are automatically expanded on full-width pages. + * Ideally we'd rely on the block type to determine if it can be full width, but + * the block's `fullWidth` property does not differentiate between `undefined` and `false`. + * So instead we hardcode a list of blocks that can be full width. */ +const FULL_WIDTH_BLOCKS = [ + 'table', + 'tabs', + 'integration', + 'openapi', + 'images', + 'embed', + 'columns', + 'code', + 'content-ref', + 'hint', +]; + /** * Renders a list of blocks without a wrapper element. */ @@ -72,6 +89,7 @@ export function UnwrappedBlocks(props: UnwrappedBl node.data && 'fullWidth' in node.data && node.data.fullWidth ? 'max-w-screen-2xl' : 'page-full-width:ml-0 max-w-3xl', + FULL_WIDTH_BLOCKS.includes(node.type) && 'page-full-width:max-w-screen-2xl', blockStyle, ]} isEstimatedOffscreen={isOffscreen} diff --git a/packages/gitbook/src/components/PageBody/PageBody.tsx b/packages/gitbook/src/components/PageBody/PageBody.tsx index 801db03ce2..71cbb791a1 100644 --- a/packages/gitbook/src/components/PageBody/PageBody.tsx +++ b/packages/gitbook/src/components/PageBody/PageBody.tsx @@ -28,7 +28,7 @@ export function PageBody(props: { const { customization } = context; const contentFullWidth = document ? hasFullWidthBlock(document) : false; - const pageFullWidth = page.id === 'wtthNFMqmEQmnt5LKR0q'; + const pageFullWidth = page.layout.width === 'wide'; const asFullWidth = pageFullWidth || contentFullWidth; const language = getSpaceLanguage(customization); const updatedAt = page.updatedAt ?? page.createdAt; diff --git a/packages/gitbook/src/components/PageBody/PageBodyBlankslate.tsx b/packages/gitbook/src/components/PageBody/PageBodyBlankslate.tsx index 86187cea55..b90e61c6ca 100644 --- a/packages/gitbook/src/components/PageBody/PageBodyBlankslate.tsx +++ b/packages/gitbook/src/components/PageBody/PageBodyBlankslate.tsx @@ -68,11 +68,13 @@ export async function PageBodyBlankslate(props: { className={tcls( 'grid', 'max-w-3xl', + 'page-full-width:max-w-screen-2xl', 'w-full', 'mx-auto', 'gap-4', 'grid-cols-1', - 'sm:grid-cols-2' + 'sm:grid-cols-2', + 'page-full-width:md:grid-cols-3' )} > {pageElements}